Button Style
[button class=”btn-default” size=”” inline=”false” link=”#” ]Default[/button][button class=”btn-inverse” size=”” inline=”true” link=”#” ]Inverse[/button]
[button class=”btn-primary” size=”” inline=”false” link=”#” ]Primary[/button][button class=”btn-success” size=”” inline=”true” link=”#” ]Success[/button][button class=”btn-info” size=”” inline=”true” link=”#” ]Info[/button][button class=”btn-warning” size=”” inline=”true” link=”#” ]Warning[/button][button class=”btn-danger” size=”” inline=”true” link=”#” ]Danger[/button]
Button Sizes
[button class=”btn-default” size=”btn-hg” inline=”false” link=”#” ]Extra Large[/button][button class=”btn-default” size=”btn-lg” inline=”true” link=”#” ]Large[/button][button class=”btn-default” size=”” inline=”true” link=”#” ]Medium[/button][button class=”btn-default” size=”btn-sm” inline=”true” link=”#” ]Small[/button][button class=”btn-default” size=”btn-xs” inline=”true” link=”#” ]Extra Small[/button]
Modal 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.
[modal modal_name=”modal_box1″ btn_label=”Launch Modal Box” btn_size=”btn-hg” btn_class=”btn-default” ][modal_header title=”Modal title”][/modal_header][modal_content]
Typi non habent claritatem insitam; est usus legentis in iis qui facit eorum claritatem.
Text in a modal
Duis mollis, est non commodo luctus, nisi erat porttitor ligula.
Popover in a modal
This [popover position=”right” title=”popover title” label=”And here’s some amazing content. It’s very engaging. right?”]popover[/popover] should trigger a popover on click.
Tooltips in a modal
Here is some dummy text. You can also use [tooltip position=”top” title=”Hey, i’m a top tooltip!” ]tooltips[/tooltip]. That one showed on top, but you can have it on the [tooltip position=”bottom” title=”Hey, i’m a bottom tooltip!”]bottom too[/tooltip]! How about [tooltip position=”left” title=”Hey, i’m a left tooltip!” ]left[/tooltip] or [tooltip position=”right” title=”Hey, i’m a right tooltip!” ]right[/tooltip]?
Overflowing text to show scroll behavior
Cras mattis consectetur purus sit amet fermentum. Cras justo odio, dapibus ac facilisis in, egestas eget quam. Morbi leo risus, porta ac consectetur ac, vestibulum at eros.Praesent commodo cursus magna, vel scelerisque nisl consectetur et. Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor. Aenean lacinia bibendum nulla sed consectetur. Praesent commodo cursus magna, vel scelerisque nisl consectetur et. Donec sed odio dui.
Donec ullamcorper nulla non metus auctor fringilla.Cras mattis consectetur purus sit amet fermentum. Cras justo odio, dapibus ac facilisis in, egestas eget quam. Morbi leo risus, porta ac consectetur ac, vestibulum at eros. Praesent commodo cursus magna, vel scelerisque nisl consectetur et. Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor. Aenean lacinia bibendum nulla sed consectetur. Praesent commodo cursus magna, vel scelerisque nisl consectetur et. Donec sed odio dui.
Donec ullamcorper nulla non metus auctor fringilla. Cras mattis consectetur purus sit amet fermentum. Cras justo odio, dapibus ac facilisis in, egestas eget quam. Morbi leo risus, porta ac consectetur ac, vestibulum at eros.Praesent commodo cursus magna, vel scelerisque nisl consectetur et. Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor. Aenean lacinia bibendum nulla sed consectetur. Praesent commodo cursus magna, vel scelerisque nisl consectetur et. Donec sed odio dui. Donec ullamcorper nulla non metus auctor fringilla.[/modal_content][modal_footer][/modal_footer][/modal]
Tooltips
Here is some dummy text. You can also use [tooltip position=”top” title=”Hey, i’m a top tooltip!” ]tooltips[/tooltip]. That one showed on top, but you can have it on the [tooltip position=”bottom” title=”Hey, i’m a bottom tooltip!”]bottom too[/tooltip]! How about [tooltip position=”left” title=”Hey, i’m a left tooltip!” ]left[/tooltip] or [tooltip position=”right” title=”Hey, i’m a right tooltip!” ]right[/tooltip]?
Social Icons
[social_icons align=”left”][social name=”dribbble” link=”#” label=”Dribbble” target=”_blank”][/social][social name=”flickr” link=”#” label=”Flickr” target=”_blank”][/social][social name=”github” link=”#” label=”Github” target=”_blank”][/social][social name=”pinterest” link=”#” label=”Pinterest” target=”_blank”][/social][social name=”twitter” link=”#” label=”Twitter” target=”_blank”][/social][social name=”facebook” link=”#” label=”Facebook” target=”_blank”][/social][social name=”google+” link=”#” label=”Google+” target=”_blank”][/social][social name=”skype” link=”#” label=”Skype” target=”_blank”][/social][social name=”tumblr” link=”#” label=”Tumblr” target=”_blank”][/social][social name=”vimeo” link=”#” label=”Vimeo” target=”_blank”][/social][social name=”youtube” link=”#” label=”Youtube” target=”_blank”][/social][social name=”linkedin” link=”#” label=”LinkedIn” target=”_blank”][/social][/social_icons]
Tabs
[tab ids=”tab1,tab2,tab3″ nav=”FIRST STEP,SECOND STEP,FINAL STEP”][tabpane id=”tab1″]
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
[/tabpane][tabpane id=”tab2″]
Absolutely! As shown with a few examples within this demo, you can use all the bootstrap goodies such as carousels, modal windows, tooltips, tabs, accordions, form elements…
[/tabpane][tabpane id=”tab3″]
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
[/tabpane][/tab]
Accordion
[accordion_wrap][accordion id=”one” title=”Is this template compatible with Bootstrap 3?”]
Absolutely! As shown with a few examples within this demo, you can use all the bootstrap goodies such as carousels, modal windows, tooltips, tabs, accordions, form elements…
[/accordion][accordion id=”two” title=”Is this template compatible with Bootstrap 3?”]
Absolutely! As shown with a few examples within this demo, you can use all the bootstrap goodies such as carousels, modal windows, tooltips, tabs, accordions, form elements…
[/accordion][accordion id=”three” title=”Is this template compatible with Bootstrap 3?”]
Absolutely! As shown with a few examples within this demo, you can use all the bootstrap goodies such as carousels, modal windows, tooltips, tabs, accordions, form elements…
[/accordion][/accordion_wrap]
Alert Boxes
[alert class=”alert-success” ]Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.[/alert]
[alert class=”alert-info” ]Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.[/alert]
[alert class=”alert-warning” ]Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.[/alert]
[alert class=”alert-danger” ]Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.[/alert]
Two Columns
[column_wrapper][one_half]
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.
[/one_half][one_half]
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.
[/one_half][/column_wrapper]
Three Columns
[column_wrapper][one_third]
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.
[/one_third][one_third]
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.
[/one_third][one_third]
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.
[/one_third]
[/column_wrapper]
Four Columns
[column_wrapper][one_fourth]
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.
[/one_fourth][one_fourth]
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.
[/one_fourth][one_fourth]
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.
[/one_fourth][one_fourth]
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.
[/one_fourth][/column_wrapper]