Bootstrap Grid system

Bootstrap includes a responsive, mobile first fluid grid system that appropriately scales up to 12 columns as the device or viewport size increases. It includes predefined classes for easy layout options, as well as powerful mixins for generating more semantic layouts.

6 Columns Layout

[row]
[one_sixth]
… the content goes here
[/one_sixth]
[one_sixth]
… the content goes here
[/one_sixth]
[/row]

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas dictum rhoncus nulla at vulputate. Sed cursus orci nec lacinia pulvinar. Mauris adipiscing pharetra quam, non pellentesque purus.

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas dictum rhoncus nulla at vulputate. Sed cursus orci nec lacinia pulvinar. Mauris adipiscing pharetra quam, non pellentesque purus.

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas dictum rhoncus nulla at vulputate. Sed cursus orci nec lacinia pulvinar. Mauris adipiscing pharetra quam, non pellentesque purus.

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas dictum rhoncus nulla at vulputate. Sed cursus orci nec lacinia pulvinar. Mauris adipiscing pharetra quam, non pellentesque purus.

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas dictum rhoncus nulla at vulputate. Sed cursus orci nec lacinia pulvinar. Mauris adipiscing pharetra quam, non pellentesque purus.

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas dictum rhoncus nulla at vulputate. Sed cursus orci nec lacinia pulvinar. Mauris adipiscing pharetra quam, non pellentesque purus.


4 Columns

[row]
[one_fourth]
… the content goes here
[/one_fourth]
[one_fourth]
… the content goes here
[/one_fourth]
[/row]

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas dictum rhoncus nulla at vulputate. Sed cursus orci nec lacinia pulvinar. Mauris adipiscing pharetra quam, non pellentesque purus blandit vel.

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas dictum rhoncus nulla at vulputate. Sed cursus orci nec lacinia pulvinar. Mauris adipiscing pharetra quam, non pellentesque purus blandit vel.

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas dictum rhoncus nulla at vulputate. Sed cursus orci nec lacinia pulvinar. Mauris adipiscing pharetra quam, non pellentesque purus blandit vel.

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas dictum rhoncus nulla at vulputate. Sed cursus orci nec lacinia pulvinar. Mauris adipiscing pharetra quam, non pellentesque purus blandit vel.


3 Columns

[row]
[one_third]
… the content goes here
[/one_third]
[one_third]
… the content goes here
[/one_third]
[/row]

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas dictum rhoncus nulla at vulputate. Sed cursus orci nec lacinia pulvinar. Mauris adipiscing pharetra quam, non pellentesque purus blandit vel. Integer vitae cursus leo, non venenatis sem. Morbi mattis fringilla tellus id tristique. Cras mattis tellus libero, eu aliquet.

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas dictum rhoncus nulla at vulputate. Sed cursus orci nec lacinia pulvinar. Mauris adipiscing pharetra quam, non pellentesque purus blandit vel. Integer vitae cursus leo, non venenatis sem. Morbi mattis fringilla tellus id tristique. Cras mattis tellus libero, eu aliquet.

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas dictum rhoncus nulla at vulputate. Sed cursus orci nec lacinia pulvinar. Mauris adipiscing pharetra quam, non pellentesque purus blandit vel. Integer vitae cursus leo, non venenatis sem. Morbi mattis fringilla tellus id tristique. Cras mattis tellus libero, eu aliquet.


2 Columns

[row]
[one_half]
… the content goes here
[/one_half]
[one_half]
… the content goes here
[/one_half]
[/row]

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas dictum rhoncus nulla at vulputate. Sed cursus orci nec lacinia pulvinar. Mauris adipiscing pharetra quam, non pellentesque purus blandit vel. Integer vitae cursus leo, non venenatis sem. Morbi mattis fringilla tellus id tristique. Cras mattis tellus libero, eu aliquet.

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas dictum rhoncus nulla at vulputate. Sed cursus orci nec lacinia pulvinar. Mauris adipiscing pharetra quam, non pellentesque purus blandit vel. Integer vitae cursus leo, non venenatis sem. Morbi mattis fringilla tellus id tristique. Cras mattis tellus libero, eu aliquet.


Other shortcodes

Slider Shortcode

[row]
[one_column]
[slider ids="780,778,788"]
Just place the ids of images you want
[/row]
[/one_column]


Button Shortcode

Parameters
link_url = ( http://thelinkhere.com )
target = ( '_blank', 'self', 'patent' ) If you leave empty the default is _blank
title = ( 'Your link title' ) If you leave empty the default is the link_url
link_text = 'the button text'
Full example
[link_url='http://example.com' target='_blank' title='The title' link_text='button']

button


Intro featured

[intro]
… the content goes here
[/intro]

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam velit mi, hendrerit ut libero eget, viverra tincidunt quam. Morbi felis ante, scelerisque non rhoncus quis, cursus ac ipsum. Sed condimentum magna a lectus ornare, id imperdiet turpis placerat. In erat dolor, volutpat nec mattis lobortis, congue sit amet risus.

Signature

[signature]
… Your signature
[/signature]

Joe Statan