Widgets usage example

[header type=”h3″] Accordion widget [/header]

In accordion widget only one toggle can be opened at time. You may specify which toggle will be opened by default when the page load by adding ‘show’ class to ‘accordion-header’ and ‘accordion-content’ elements of this toggle. You may add unlimited accordion at pages.

[accordion]

[section title=”Panel 1″ show=”show”]Pellentesque fermentum dolor. Aliquam quam lectus, facilisis auctor, ultrices ut, elementum vulputate, nunc. Nulla a arcu mollis, dictum lacus at, dapibus nunc. Maecenas est dui, rutrum eget justo nec, eleifend imperdiet eros. Nullam tincidunt tincidunt elementum. Vivamus in risus lorem.[/section]

[section title=”Panel 2″]Donec nec justo eget felis facilisis fermentum. Aliquam porttitor mauris sit amet orci. Aenean dignissim pellentesque felis. Aliquam quam sem, placerat vel eros vitae, consequat sodales tortor. Donec dignissim dolor non augue egestas luctus. Mauris tristique egestas lectus, a fringilla justo consectetur sed.[/section]
[section title=”Panel 3″]Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Phasellus hendrerit. Pellentesque aliquet nibh nec urna. In nisi neque, aliquet vel, dapibus id, mattis vel, nisi. Sed pretium, ligula sollicitudin laoreet viverra, tortor libero sodales leo, eget blandit nunc tortor eu nibh. Nullam mollis. Ut justo. Suspendisse potenti. Nulla a arcu mollis, dictum lacus at, dapibus nunc.[/section]

[/accordion]

[spacing size=”60px”]

[header type=”h3″] Toggle widget [/header]

In toggle widget unlimited amount of toggles can be opened at time. You may specify which toggle will be opened by default when the page load by adding ‘show’ class to ‘accordion-header’ and ‘accordion-content’ elements of this toggle. You may add unlimited toggle at pages.

[toggle]
[section title=”Panel 1″]Pellentesque fermentum dolor. Aliquam quam lectus, facilisis auctor, ultrices ut, elementum vulputate, nunc. Nulla a arcu mollis, dictum lacus at, dapibus nunc. Maecenas est dui, rutrum eget justo nec, eleifend imperdiet eros. Nullam tincidunt tincidunt elementum. Vivamus in risus lorem.[/section]
[section title=”Panel 2″]Donec nec justo eget felis facilisis fermentum. Aliquam porttitor mauris sit amet orci. Aenean dignissim pellentesque felis. Aliquam quam sem, placerat vel eros vitae, consequat sodales tortor. Donec dignissim dolor non augue egestas luctus. Mauris tristique egestas lectus, a fringilla justo consectetur sed.[/section]
[section title=”Panel 3″]Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Phasellus hendrerit. Pellentesque aliquet nibh nec urna. In nisi neque, aliquet vel, dapibus id, mattis vel, nisi. Sed pretium, ligula sollicitudin laoreet viverra, tortor libero sodales leo, eget blandit nunc tortor eu nibh. Nullam mollis. Ut justo. Suspendisse potenti. Nulla a arcu mollis, dictum lacus at, dapibus nunc.[/section]
[/toggle]

[spacing size=”60px”]

[header type=”h3″] Tab widget [/header]

Donec non enim in turpis pulvinar facilisis. Ut felis. Praesent dapibus, neque id cursus faucibus, tortor neque egestas augue, eu vulputate. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Vestibulum tortor quam, feugiat vitae, ultricies eget, tempor sit amet, ante. Donec vitae ornare sem, eget feugiat justo.

[spacing size=”40px”]

[tabs]
[tab title=”First Tab” icon=”icon-comments”]Sed vel est a leo vehicula condimentum ac et mauris. Phasellus fermentum nisi dignissim sem condimentum malesuada. In hac habitasse platea dictumst. Maecenas feugiat ante nibh, nec luctus magna pharetra id. Proin ultricies risus semper nibh iaculis pharetra. Curabitur ullamcorper placerat metus at varius.[/tab]
[tab title=”Second Tab” icon=”icon-coffee”]Sed vel est a leo vehicula condimentum ac et mauris. Phasellus fermentum nisi dignissim sem condimentum malesuada. In hac habitasse platea dictumst. Maecenas feugiat ante nibh, nec luctus magna pharetra id. Proin ultricies risus semper nibh iaculis pharetra. Curabitur ullamcorper placerat metus at varius.[/tab]
[tab title=”Third Tab” icon=”icon-pushpin”]Nulla nec tellus at dolor accumsan aliquet ut at lorem. In tincidunt magna quis sollicitudin tincidunt. Nulla luctus orci tortor, sit amet consequat metus ultrices in. Sed consequat, nibh bibendum malesuada sodales, lectus mauris elementum justo, quis ornare nunc metus vitae tortor. Proin tristique pretium posuere.[/tab]
[/tabs]

Leave a Reply