Adding Tabs

Tabs show related content side by side in the same space. Visitors select a tab name to see its content. They work well for a few parallel topics, such as Trash, Recycling and Yard Waste. Tabs are added as a Content Section.

Add Tabs

At the bottom of the Content Sections area, select the arrow beside the Add button, then choose Add Tabs.

The tabs appear with the first tab. Each tab has:

• Tab Name – the short label visitors select, such as “Recycling”. It’s required.
• Tab Body – the content shown when the tab is selected.

Add the Tab Content

Type the tab name. Then, under Tab Body, select Add Simple to add a text editor. To add something else, select the arrow beside it: an image, columns, a view or a Google map.

Type the content in the text editor. It has the same buttons as the main text editor.

A tab body can hold more than one item, for example text followed by an image. Add them in order with the same buttons.

Add More Tabs

Select Add Tab Section below the last tab, then fill in its name and body the same way.

Reorder, Copy or Remove a Tab

• Reorder: drag a tab by the dotted handle on its left. The first tab is the one visitors see when the page opens.
• Copy: select the three dots at the top right of the tab, then Duplicate.
• Remove: select the three dots, then Remove. If asked, select Confirm removal.

To remove all the tabs, use the Remove button at the top right of Tabs.

On Your Page

Save the page and view it. The tab names show in a row, and the first tab’s content shows below them. Visitors select a name to switch tabs. Keyboard users can also move between tabs with the arrow keys. Colors and styles depend on your site.

Tabs or an Accordion?

• Use tabs for two to five related topics with short names, where visitors pick the one that applies to them.
• Use an accordion for longer lists, such as frequently asked questions, or when titles are longer than a few words. See Adding Accordions.

Tips

• Keep tab names to one to three words, so they fit on one line on phones.
• Tab names aren’t headings. If a tab’s content needs headings, follow the page’s outline: Heading 2 for main sections, Heading 3 inside them. See Headings and Text Formatting.
• Put the most important or most used topic in the first tab. Content in other tabs is hidden until a visitor selects it.
• Save the page as Published when you are done so the public can see it.

See Content Sections for the other section types.