As you continue to create pages, and add content to them, you'll likely find yourself needing to perform tasks like re-organizing your navigation menu or re-arranging content on a page. In this article, you'll learn how to do both.
Organize your pages
Before you learn how to organize your pages, it's important to understand the CMS's three main Navigation Areas, and how adding a page to each of these areas dictates where it's displayed. If you're not familiar with these concepts, refer to Navigation Areas Overview below before continuing.
Navigation areas overview
Pages are organized by a community's three main Navigation Areas:
- The Main Button Bar represents a community's top-level navigation. Adding/removing pages to/from the button bar is how to manage a community's main navigation options. When creating a page, you’ll typically do so under the Main Button Bar and configure it to (a) appear directly in your community’s navigation or (b) as a hidden page you’ll link to from elsewhere, like other pages, discussion posts, emails, etc.
TIP: Nesting pages in the Main Button Bar is how you create drop-down menus in your navigation menu containing additional pages:
- Pages added to Text Links at Top display as links in a community's banner (Contact Us and Code of Conduct are the default links) and are available across all pages.
NOTE: Text Links at Top is not applicable to customers using our Higher Logic Thrive Community model.
- Pages added to Text Links at Bottom display as links in a community's footer and are available across all pages.
EXAMPLE: Compare the two images below to see where content added to each area displays in a community.
CMS
Community
Navigation Tree
The Navigation Tree on the left lists all of a community's pages, each represented by a tile. Pages can be nested under one another to create a tiered structure, with top-level pages known as "parents" and sub-pages known as "children."
Parent pages have a plus icon that can be clicked to view its children. In the image above, I've expanded the Main Button Bar (the parent) to view its nine sub-pages (the children). Seven of these pages are active, while the bottom two are set to not be visible in the front-end navigation, indicated by the eye icon.
NOTE: Pages configured to not be visible can still be accessed indirectly, like from an announcement or email.
Moving pages
To the left of each page tile is directional arrow icon that can be used to reposition that page tile in your navigation structure. Drag and drop this icon to move a page to the desired location:
TIP: As explained earlier, there are three main levels: Main Button Bar, Text Links at Top, and Text Links at Bottom; you can drag and drop pages among these three main levels. For example, let's say you have a page containing several links in Text Links at Top but you'd prefer they reside at the bottom of your community; in this case, you can easily drag and drag the page from Text Links at Top to Text Links at Bottom.
In addition, you can move pages anywhere within each of these three levels. For example, to nest a page under another, creating a parent/child relationship, drag and drop the page below and to the right of another, as illustrated below:
Organize content on a page
The foundation of page content are Rows. You can add six Row types to a page, from single column to multiple two- and three-column Rows:
Use these various Row types to structure a page into specific content areas; you can then add Content Items and Widgets to each area to achieve the desired layout and design.
View a page's content
Select your page in the Navigation Tree and click Edit.
Moving content on a page
Like most actions, moving content is as simple as dragging and dropping it to the desired location on the canvas. This applies to both:
- moving an entire Row
- or content within a Row to a different column in its current Row or a different Row altogether.
Use this functionality to easily organize content on new pages and re-organize content on existing ones.
Let's look at a few examples.
Moving an entire row
EXAMPLE: The Latest Discussions List Widget is at the top of the page, sharing a Row with an Announcements List Widget.
I want to move these two Widgets so they're positioned above the Most Active Users List below. Rather than creating a new Row at that location and moving each Widget individually, I can just move the entire Row. First, I click at the top-most edge of the Row to select the entire Row.
In the blue header area, I can now drag-and-drop it.
Moving content within a row
EXAMPLE: The Latest Discussions List and Announcements List Widgets are in a two-column Row.
I want to move the Latest Discussions List Widget from the first column to the second column. First, I click to select the Widget. In the blue header area, I can now drag and drop it to the second column, above or below the other Widget.
Now, I repeat this process to select and move the Announcements List Widget to the first column. These two Widgets have switched positions in the Row.
Moving content to a different Row
EXAMPLE: The Latest Discussions List Widget is at the top of the page, sharing a Row with an Announcements List Widget.
I think the Latest Discussions List Widget would be better-suited in the Row below. First, I click to select the Widget. In the blue header area, I can now drag and drop it to any column in the Row below, above or below the other Widgets there.
Manage the Text Links sections
The Text Links at Top and Text Links at Bottom sections differ from the other CMS sections in that you cannot:
- Move pages from the Text Links sections out to other sections.
- Move pages from other sections into the Text Links sections.
- Move pages from one Text Links section to another.
In the following image, Page 1 is a page in the Text Links at Bottom section.
When Page 1 is dragged to a different section, it is blocked, as indicated by the red shading in the image below. When you release the mouse button, it automatically returns to its original position.
NOTE: This behavior is the same if you try to move (i.e., drag) a page from another section into either of these sections.
You can:
- add pages to these sections and
- copy pages within these sections.
Workaround
It is possible to get around this situation and populate a page with the content that you want without moving the page. To demonstrate this, assume two scenarios:
- Scenario 1: get content from a Text Links section to a different section
- Scenario 2: get content from a different section to a Text Links section
These scenarios are, essentially, the same; the difference is in where you add a page.
- Add a page to the section that you want to host the content.
NOTE: For Scenario 1, add the page to any non-Text Links section. For Scenario 2, add the page to either of the Text Links sections.
- Edit the page and insert a Hyperlink/URL content item.
- Specify a redirect to the URL or page code that is hosting the content (see Build Page Layout and Content).
- Click Save.
- Click Publish to make the page visible.