GabrielSoft - Tabs Section - Take your tabs a step further

A Tabs section on your website can help compile information into one, easy to read place. Take your tabs a step further with these unique features! Here are a few lesser-known options to help you customize your Tabs section into the perfect hub of information for your website.

In this article:

  1. Changing the style of your Tabs section
  2. Using a URL link to share an individual tab
  3. Change the tab layout (without losing any content!)
  4. Turn on Auto-Scroll feature
  5. Change the collapsed tab setting

Don't have a Tabs section on your site yet?

Learn more: Tabs Section - How it works

1

Change the style of your Tabs section

Just like other sections on your website, you're able to manually choose from a set of pre-determined style options to make your Tabs section stand out! To enable any style modifications to your Tabs section, follow these simple steps:

  1. Navigate to the Tab Section Settings at the top right corner of your Tabs section (gear icon).
  2. Under Styling, open the drop-down menu of styling options.
  3. Choose from a set of pre-determined style options that are unique to your website's theme. 
  4. Click on the green Save button and don't forget to Publish the page once you're done!

2

Use a URL link to share an individual tab

Share information from individual tabs directly using a distinct URL that can be easily shared on any digital platform. To share a specific tab, follow these steps:

  1. Navigate to the Tabs section and the specific tab that contains the information you would like to share.
  2. On the individual tab, click on the Tab Settings, which will open up the individual tab settings.
  3. Highlight and copy the information listed under the identified Link to Tab information.
  4. Place the copied text at the end of your website's homepage.

A correct URL link to an individual tab within your website will look similar to this: 

www.YourParish.org/tabs#tabContent_2550225

Now you have a link to use for bringing people directly to the information you want them to see!

3

Change tab layouts (without losing any content!)

If you need to change your tab layout without losing any content, toggling back and forth between a classic and accordion tab layout can be accomplished by following these steps:

  1. Navigate to the Tab Section Settings at the top right corner of your Tabs section (gear icon).
  2. In the Tab Section Settings, select Layout.
  3. Choose from four different types of classic layouts or the accordion layout.
  4. Click on the green Save button and don't forget to Publish the page once you're done!
4

Turn on Auto-Scroll feature

Auto-Scroll is a great way to feature several pieces of information without making your site visitors click-around and mine for information. 

  1. Navigate to the Tabs Section Settings at the top right corner of your Tabs section (gear icon).
  2. Under Auto-Scroll on Desktop, select On.
  3. Under Timing in Seconds, set the length of time you would like each tab to show before the next sequenced tab automatically appears.
  4. Click on the green Save button and be sure to Publish the page once you're finished.
NOTE: This feature will only activate when using a desktop or laptop computer and is only available for a Tabs section using one of the four classic layouts.

5

Change the collapsed tab setting

When you add a Tabs section in an accordion layout to your website, each tab is defaulted to appear in a collapsed fashion. This means that site visitors must click on each individual tab to see more information.

If you would like the first tab to appear open, so it displays more information without needing to be clicked, follow these instructions: 

  1. Navigate to the Tabs Section Settings at the top right corner of your Tabs section (gear icon).
  2. Under First Accordion Item, select Open.
  3. Click on the green Save button and don't forget to Publish the page once you're done!
NOTE: This feature is  only available for a Tabs section using the  accordion layout.