Skip to main content
Edit Mode is how you change your website. You edit each page in place: click any part of the page, and its editor opens in a sidebar on the left. You need the Content Management permission to use Edit Mode. See Who can edit the website.

Turning Edit Mode on and off

1

Go to the page you want to edit

Log in, then browse to the page on your website.
2

Press Edit Mode

Press the floating Edit Mode button in the lower-right corner of the page.
3

Select something to edit

The editor sidebar opens on the left and says “Select an element on the page to edit it.” Move your pointer over the page; a box shows which element you’re pointing at. Click it to edit it.
While Edit Mode is on, the lower-right corner shows three buttons:
  • Search Website — find any page on your site, or add a member page
  • Dismiss — leave Edit Mode
  • Hide — leave Edit Mode and hide the Edit Mode button until you reload the page, so you can see the page as visitors do
You can also leave Edit Mode by closing the sidebar with its X button or by pressing Esc. When you go to another page on your site, Edit Mode stays on.
The Edit Mode button doesn’t appear on admin pages, or on member account, profile, dues, member list, announcement, forum, and event list pages. Those pages have their own editing tools.

What’s different in Edit Mode

  • Clicking selects instead of navigating. Clicking a link or button selects it for editing instead of following it. To go to another page, use Search Website, or leave Edit Mode first.
  • The selected element is outlined, and the page scrolls to keep it in view.
  • Empty areas show an Add content button, so you can fill them in.
  • On public pages, a bar appears at the top of the page with Page Details, New Page, and a page options menu. See Pages.
  • On the home page, the Welcome Back pop-up stays closed while you edit.

The editor sidebar

The sidebar shows the editor for whatever you selected. Its heading shows where that element sits on the page, for example Page › Main Section › Two Columns › Column. Click an earlier part of that heading to move up and edit the element that contains it. To select a container instead of something inside it, click an empty gap inside the container. For example, clicking the space between two columns selects the Two Columns element.

Resizing the sidebar

Drag the sidebar’s right edge to make it wider or narrower. Double-click the edge to return it to its default width. You can also resize it with the keyboard: move focus to the edge (labeled “Resize content editor”), then use the Left and Right arrow keys. Press Home or Enter to reset it. Your browser remembers the width you choose.
On a phone, the sidebar covers the whole screen while you edit an element.

Saving your changes

Each editor has a save button at the bottom, usually labeled Save. Some editors save different parts separately, for example Save Elements, Save Spacing, and Save Background. Changes go live as soon as you save. To undo changes you haven’t saved yet, press Cancel, or close the sidebar.

If you try to leave without saving

If an editor has unsaved changes and you do something that would close it, GroupFlow asks Discard unsaved changes? Choose Keep editing to go back, or Discard to throw the changes away. You’ll see this if you:
  • Select another element
  • Press Search Website, Dismiss, or Hide
  • Close the sidebar or press Esc
  • Follow a link, or use your browser’s Back or Forward button
If you reload the page or close the tab, your browser shows its own warning instead.

Adding, moving, and removing elements

Pages are built from elements: blocks of text, images, columns, buttons, forms, and so on. See Page Elements for what each one does. To add elements to a page, select the page’s Main Section. Click an empty gap in the main content area of the page, or click the main area in the sidebar’s heading. The Main Section editor lists the elements on the page under Main Section Elements, with an Element Library below it.
1

Add an element

Tap an element in the Element Library to add it to the end of the list. Or drag it by its + into the list above, to the spot where you want it.
2

Rearrange elements

Drag elements by their handles to change their order.
3

Save

Press Save Elements. Your additions, moves, and deletions aren’t applied until you do.
Each element in the list has a Detail button that opens its editor, and a menu with more actions:
  • Clone element — Adds a copy of the element, and everything inside it, directly below the original.
  • Delete element — Removes the element. GroupFlow asks you to confirm first.
  • Publish element / Unpublish element — Shows or hides the element on your site. See below.
Columns inside a Two Columns element work the same way, with a Column Elements list and their own Element Library. In a column, each element’s menu has only Delete element.

Published and draft elements

An unpublished element is a draft: it stays in your editor with a Draft badge, but it doesn’t appear on your website. Use this to prepare content before you show it, or to take something down temporarily without deleting it. Elements you add from the Element Library are published.

Editing outside Edit Mode

On the event editing pages, members with the Events or Content Management permission see a small Edit link under the instructions text. It opens the same editor sidebar for that text.