Welcome to the OpenCities help centre. Search for what you're after, or browse the categories.
Can't find what you're looking for? Submit a support ticket and we'll be in touch.


Using sections to divide your content

avatar of OpenCities Product Team

OpenCities Product Team

Last updated

Some informational pages will be heavy on text, and online content is best split into chunks. Readers are more likely to read and understand content when it is split up into headings or lists.

When your general pages are particularly wordy, you'll need to make sure that your page isn't just one very long scroll of text. There are several ways you can do this; you could use accordions or tabs to split up your content under important headings, or you could divide the pages into sections. This allows the content to be contained on one page but provides your community with a less daunting display of information that is easy to read and navigate.

Note: 'Divide this page into sections' is a feature that is only available on OC General pages.


How to Divide a page into sections 

  1. Make sure your general page has all the content you need and the headings for each section are styled properly
  2. Expand the 'Divide this page into sections' menu in the Overview tab of the page
  3. Choose the heading level by which you want to divide your content from the 'Divide page by...' dropdown menu
  4. Choose how you want your sections to display from the 'Display...' dropdown menu. Read about the different display options below.
  5. Choose if you want your section headings to be numbered, by checking or unchecking the 'Include numbering in heading' box
  6. Save and Preview your page to ensure your sections are displaying correctly
  7. Publish your page

Divide page into sections menu on a general page

Section display options

The sections feature uses heading levels to organise your sections. You can display your sections using a table of contents, sections links or both. You also have the option of numbering your headings. If the first part of your page does not have a heading, it will be given the heading 'Overview' when divided into sections.

Table of Contents:

Displays the heading sections in a table of contents above the content area

Note: the Table of Contents will always display in 2 columns. Beware of having too many sections. This will expand your table of contents as far as is needed, potentially taking up a very large portion of the reader's screen

General page with Table of Contents sections

Page sections:

Displays next and previous section buttons below the content area for manual navigation

General page with sections links

Table of Contents & Page Sections:

Displays the heading sections in both the table of contents above the content area and navigation buttons below the content area

Note: in this example, the 'Include numbering in heading' box has not been checked, in comparison to the examples above. When this occurs, the table of contents becomes a bulleted list.

General page with Table of Contents and sections links

If your sections are not displaying, there might be a problem with the heading level styling. If the headings have any ID or styling in them, which you will be able to see in the HTML, the page will not divide into sections. In the HTML tab of the WYSIWYG Editor, your heading should be between clear tags and should look like this: '<h2>Sample heading</h2>' 

If your sections are not displaying, you need to make sure there is no extraneous information in the heading tags. A common problem to look for are extra <div> tags.  As another example, code like this would not work: <h2 id="______">Sample heading</h2>. 

What else?

Was this article helpful?
1 out of 4 found this helpful