Since structured content is a very important task the theme comes with the option for simple content display toggling, accordion toggling and neat javascript tabs. Take a look at the examples bellow to see what can be accomplish with a few simple shortcodes 🙂
Content Toggler
Once clicked the content stays visible until the heading is clicked again
[toggle title=’Click here to show/hide a small content box’]
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur.
[/toggle]
[toggle title=’Click here to see another content box’ active]
Ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur.
[/toggle]
[hr top]
Accordion Toggler
Once you click another heading all other content areas are closed.
[toggle title=’Clicking one of these headlines closes all other toggle-boxes’ close = ‘closeAll’]
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.
Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nuluis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur.
[/toggle]
[toggle title=’Ut aliquip ex ea commodo consequat.’ close = ‘closeAll’]
Ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur.
[/toggle]
[toggle title=’dolor sit amet, consectetur adipisicing elit’ close = ‘closeAll’]
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.
Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur.
[/toggle]
[toggle title=’Duis aute irure dolor’ close = ‘closeAll’]
Ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur.
[/toggle]
[toggle title=’Lorem ipsum dolor sit amet, consectetur adipisicing elit.’ close = ‘closeAll’]
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam
[/toggle]
[toggle title=’Ut aliquip ex ea commodo consequat.’ close = ‘closeAll’]
Ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur , quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur.
[/toggle]
[hr top]
Tabs
Simple to use Tabs with custom headings of your choice
[tab_container]
[tab title=’Tab 1′ active]
Ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur.Ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur , quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur.
[/tab]
[tab title=’Tab 2′]
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam
[/tab]
[tab title=’Tab 3 – the last one’]
Ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur , quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur.
[/tab]
[/tab_container]
[hr top]
Content Slideshow
The Content slideshow uses the famous AviaSlider and already comes bundled with the theme. Pretty much every option you can see on the AviaSlider Demo Page is possible within the theme with the simple use of shortcodes.
Fade Slider
[slideshow]
[slide src=’http://dl.dropbox.com/u/2025095/alwaysonline/cleancut/medium1.jpg’ url=’http://dl.dropbox.com/u/2025095/alwaysonline/cleancut/medium1.jpg’]
[slide src=’http://dl.dropbox.com/u/2025095/alwaysonline/cleancut/medium2.jpg’ url=’http://dl.dropbox.com/u/2025095/alwaysonline/cleancut/medium2.jpg’]
[slide src=’http://dl.dropbox.com/u/2025095/alwaysonline/cleancut/medium3.jpg’ url=’http://dl.dropbox.com/u/2025095/alwaysonline/cleancut/medium3.jpg’]
[/slideshow]
Block Slider
[slideshow height=’60’ width=’60’ transition=’slide’ ]
[slide src=’http://dl.dropbox.com/u/2025095/alwaysonline/cleancut/medium1.jpg’ url=’http://dl.dropbox.com/u/2025095/alwaysonline/cleancut/medium1.jpg’]
[slide src=’http://dl.dropbox.com/u/2025095/alwaysonline/cleancut/medium2.jpg’ url=’http://dl.dropbox.com/u/2025095/alwaysonline/cleancut/medium2.jpg’]
[slide src=’http://dl.dropbox.com/u/2025095/alwaysonline/cleancut/medium3.jpg’ url=’http://dl.dropbox.com/u/2025095/alwaysonline/cleancut/medium3.jpg’]
[/slideshow]
Curtain Slider
[slideshow height=’full’ width=’60’ transition=’drop’ delay=’100′ ]
[slide src=’http://dl.dropbox.com/u/2025095/alwaysonline/cleancut/medium1.jpg’ url=’http://dl.dropbox.com/u/2025095/alwaysonline/cleancut/medium1.jpg’]
[slide src=’http://dl.dropbox.com/u/2025095/alwaysonline/cleancut/medium2.jpg’ url=’http://dl.dropbox.com/u/2025095/alwaysonline/cleancut/medium2.jpg’]
[slide src=’http://dl.dropbox.com/u/2025095/alwaysonline/cleancut/medium3.jpg’ url=’http://dl.dropbox.com/u/2025095/alwaysonline/cleancut/medium3.jpg’]
[/slideshow]