Vous êtes ici : Styles ›
Vertical Tabs
Vertical tab widgets follow the same core structure as the regular tab widgets.
The only difference is that you have to add and additional class on the parent HTML Widget and where the parent HTML widget lives.
Configuration:
- Add an HTML widget to a page and press Edit in the upper right-hand corner.
- Switch to the Appearance tab and copy & paste ps-tabs tab-group-main tabs-style-vertical into the Class dialog box.
- Drag & drop at least 2 widgets underneath the parent HTML widget.
- Go to the Appearance tab of each widget and copy & paste ps-tab tab-group-main into the Class dialog box.
- Name the tabs by entering a unique Title on the Options tab of each child widget.
- Add row class vertical-tabs to have it stack nicely on smaller screens
- Publish the page.
*The RSS Feed widget is not compatible with Widget Tabs
Tip:
- You can add multiple instances of Widget Tabs on the same page by replacing the word main with a unique group identifier. For example, tab-group-main could become tab-group-sales. The child widgets just need the same unique class name applied to them as well.
Tab 1
Tab 1 Content
Tab 2
Tab 2 Content
Tab 3
Tab 3 Content
Affiché 130 fois