(833) 888-2666 hello@myvivatel.com

Toggle and Tabs

Tabs

[row]
[one_whole]

Simple Tabs

[tabgroup ]

Tab 1 content – A good designer knows that tables should not be used for layout, but rather for displaying columns and rows of data. HTML enables the creation of well-structured, well-formatted tables.
Tab 2content – A good designer knows that tables should not be used for layout.
Tab 3 content – HTML enables the creation of well-structured, well-formatted tables.
[/tabgroup]
[/one_whole]
[/row]

[row]
[one_whole]
[row]
[one_whole]

Tab Sizing

If you want your tabs to run the full width of their container evenly, you can add class of .two-up, .three-up, .four-up, and .five-up to them.

[tabgroup size=”three-up”]

Tab 1 content – A good designer knows that tables should not be used for layout, but rather for displaying columns and rows of data. HTML enables the creation of well-structured, well-formatted tables.
Tab 2content – A good designer knows that tables should not be used for layout.
Tab 3 content – HTML enables the creation of well-structured, well-formatted tables.
[/tabgroup]
[/one_whole]
[/row]
[row]
[one_whole]

How?

[tabgroup size=”three-up”]
[tab title=”Simpletab 1″]Tab 1 content goes here…[/tab]
[tab title=”Simpletab 2″]Tab 2 content goes here…[/tab]
[/tabgroup]

[/one_whole]
[/row]

[row]

Accordion

[accordiongroup][accordion title=”Accordion 1″]Accordion 1 content goes here[/accordion][accordion title=”Accordion 2″]Accordion 2content goes here[/accordion][accordion title=”Accordion 3″]Accordion 3 content goes here[/accordion][accordion title=”Accordion 4″]Accordion 4 content goes here[/accordion][/accordiongroup]


Toggle

[togglegroup][toggle title=”toggle 1″]toggle 1 content goes here[/toggle][toggle title=”toggle 2″]toggle 2content goes here[/toggle][toggle title=”toggle 3″]toggle 3 content goes here[/toggle][toggle title=”toggle 4″]toggle 4 content goes here[/toggle][/togglegroup]


[/row]
[row]

How to accordion?

[accordiongroup]
[accordion title=”Accordion 1″]Accordion 1 content goes here[/accordion]
[accordion title=”Accordion 2″]Accordion 2content goes here[/accordion]
[/accordiongroup]

How to toggle?

[togglegroup]
[toggle title=”toggle 1″]Toggle 1 content goes here[/toggle]
[toggle title=”toggle 2″]Toggle 2 content goes here[/toggle]
[/togglegroup]

[/row]