Working with Page Layouts: Tabs
A tabbed layout can be another effective way to present a large amount of content in a relatively small space. Using patterns, you can place a ready-made tab branded with demo content that you can replace with your content in a couple of steps. Open or create a new page to which you want to add the tabs.
NOTE: If you create a new page, be sure to follow the steps in the banners section so that all your pages have the same flow.
- Click the GenerateBlocks icon.
- From the right-hand menu, click Open Pattern Library.
- Click the Blocks section.
- Find the option "Tabs" and click the Insert button to add the pattern to your page.
Once the Tabs block is in place, you need to configure the content and adjust the block's location so it is displayed correctly.
- Click the Document Overview icon.
- From the left-hand menu, drag and drop the Tabs block inside the Body Contentblock.
- Note the thin arrows in the image below, when the accordion icon is indented, it is inside another block.
- Click the Publish button (if you're doing this on a pre-existing page, the button will say Save).
If you need more than three tabs for the Tabs block, follow the below steps.
- Select the Tabs option in the Document Overview.
- Select Add New (+) from the pop-out menu.
- Click the Save button after adding as many tab options as you need.
If you need fewer than three tabs for the Tabs block, follow the below steps.
- Select the Tab option in the Document Overview that you want to remove (in the image this is Tab 3).
- Select the ellipsis from the pop-out menu.
- Click "Remove Tab Button & Item" to properly remove a tab. DO NOT use the standard delete option, this will break the rest of your Tabs block.
- Click the Save button after removing as many tab options as you need.
References