Shortcodes

November 26, 2012 / 0 Comments / Category:

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. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
[spacer height=”50px”]

Button Examples

[spacer height=”30px”]
[one_half]

BUTTON COLOR ALTERNATIVES

[spacer height=”20px”]
[bs_button url=”#” target=”_self”] Default Style [/bs_button]
[bs_button url=”#” target=”_self” class=”primary”] Primary Style [/bs_button]
[bs_button url=”#” target=”_self” class=”info”] Info Style [/bs_button]
[spacer height=”10px”]
[bs_button url=”#” target=”_self” class=”success”] Success Style [/bs_button]
[bs_button url=”#” target=”_self” class=”warning”] Warning Style [/bs_button]
[bs_button url=”#” target=”_self” class=”danger”] Danger Style [/bs_button]
[spacer height=”10px”]
[bs_button url=”#” target=”_self” class=”inverse”] Inverse Style [/bs_button]
[bs_button url=”#” target=”_self” class=”black”] Black Style [/bs_button]
[bs_button url=”#” target=”_self” class=”highlight”] Highlight Style [/bs_button]
[spacer height=”10px”]
[bs_button url=”#” target=”_self” class=”gray”] Gray Style [/bs_button]

[spacer height=”50px”]

MORE COLOR ALTERNATIVES

[spacer height=”20px”]
[bs_button size=”small” url=”#” target=”_self” class=”info”]

SMALL BUTTON

[/bs_button]
[bs_button size=”small” url=”#” target=”_self” class=”info”] VIEW [/bs_button][spacer height=”5px”]

[bs_button size=”small” url=”#” target=”_self” class=”success”]

SMALL BUTTON

[/bs_button]
[bs_button size=”small” url=”#” target=”_self” class=”success”] VIEW [/bs_button][spacer height=”5px”]

[bs_button size=”small” url=”#” target=”_self” class=”danger”]

SMALL BUTTON

[/bs_button]
[bs_button size=”small” url=”#” target=”_self” class=”danger”] VIEW [/bs_button][spacer height=”5px”]

[bs_button size=”small” url=”#” target=”_self” class=”inverse”]

SMALL BUTTON

[/bs_button]
[bs_button size=”small” url=”#” target=”_self” class=”inverse”] VIEW [/bs_button][spacer height=”5px”]

[bs_button size=”small” url=”#” target=”_self” class=”warning”]

SMALL BUTTON

[/bs_button]
[bs_button size=”small” url=”#” target=”_self” class=”warning”] VIEW [/bs_button][spacer height=”5px”]

[bs_button size=”small” url=”#” target=”_self” class=”black”]

SMALL BUTTON

[/bs_button]
[bs_button size=”small” url=”#” target=”_self” class=”black”] VIEW [/bs_button][spacer height=”5px”]

[bs_button size=”small” url=”#” target=”_self” class=”gray”]

SMALL BUTTON

[/bs_button]
[bs_button size=”small” url=”#” target=”_self” class=”gray”] VIEW [/bs_button][spacer height=”5px”]

[bs_button size=”small” url=”#” target=”_self” class=”highlight”]

SMALL BUTTON

[/bs_button]
[bs_button size=”small” url=”#” target=”_self” class=”highlight”] VIEW [/bs_button]

[spacer height=”50px”]

BUTTON SIZES

[spacer height=”20px”]
[bs_button class=”primary” size=”large”] Large Button [/bs_button]
[bs_button size=”large”] Large Button [/bs_button]
[spacer height=”10px”]
[bs_button class=”primary”] Default Button [/bs_button]
[bs_button] Default Button [/bs_button]
[spacer height=”10px”]
[bs_button class=”primary” size=”small”] Small Button [/bs_button]
[bs_button size=”small”] Small Button [/bs_button]
[spacer height=”10px”]
[bs_button class=”primary” size=”mini”] Mini Button [/bs_button]
[bs_button size=”mini”] Mini Button [/bs_button]
[spacer height=”50px”]

BUTTON BLOCK AND DISABLE

[spacer height=”20px”]
[bs_button class=”primary noneanimated” block=”on”] Block Button [/bs_button]
[spacer height=”10px”]
[bs_button class=”primary noneanimated” disabled=”on”] Disabled Button [/bs_button]
[bs_button disabled=”on”] Disabled Button [/bs_button]
[/one_half]
[one_half_last]

BUTTON SHORTCODES

[toggles]
[toggle title=”Button Color Alternatives” active=”active” class=”nopadding”][pre]

[bs_button url=”#” target=”_self”] Default Style [/bs_button]
[bs_button url=”#” target=”_self” class=”primary”] Primary Style [/bs_button]
[bs_button url=”#” target=”_self” class=”info”] Info Style [/bs_button]
[bs_button url=”#” target=”_self” class=”success”] Success Style [/bs_button]
[bs_button url=”#” target=”_self” class=”warning”] Warning Style [/bs_button]
[bs_button url=”#” target=”_self” class=”danger”] Danger Style [/bs_button]

[/pre][/toggle]

[toggle title=”Button Sizing” active=”not_active” class=”nopadding”][pre]

[bs_button class=”primary” size=”large”] Large Button [/bs_button]
[bs_button size=”large”] Large Button [/bs_button]
[bs_button class=”primary”] Default Button [/bs_button]
[bs_button] Default Button [/bs_button]
[bs_button class=”primary” size=”small”] Small Button [/bs_button]
[bs_button size=”small”] Small Button [/bs_button]
[bs_button class=”primary” size=”mini”] Mini Button [/bs_button]
[bs_button size=”mini”] Mini Button [/bs_button]

[/pre][/toggle]

[toggle title=”Button Block / Disable / Enable” active=”active” class=”nopadding”][pre]

[bs_button class=”primary” block=”on”] Block Button [/bs_button]
[bs_button block=”on”] Block Button [/bs_button]
[bs_button class=”primary” disabled=”on”] Disabled Button [/bs_button]
[bs_button disabled=”on”] Disabled Button [/bs_button][/pre][/toggle][/toggles][/one_half_last]
[spacer height=”45px”]
[background color=”#f1f1f1″ padding_top=”45px” padding_bottom=”45px”]

Hover Examples

[spacer height=”30px”]
[one_half]

TOOLTIP

Tight pants first level keffiyeh you probably haven’t heard of [bs_tooltip title=”On Top” delayhide=”2000″]top[/bs_tooltip]. Photo booth beard raw denim letterpress vegan messenger bag stumptown. Farm-to-table seitan, mcsweeney’s fixie sustainable quinoa 8-bit american apparel have a terry richardson [bs_tooltip placement=”left” title=”To the Left”]left[/bs_tooltip] chambray. Beard stumptown, cardigans banh mi lomo thundercats. Tofu biodiesel williamsburg marfa, four loko mcsweeney’s [bs_tooltip placement=”right” title=”To the Right”]right[/bs_tooltip] vegan chambray. A really ironic artisan whatever keytar, scenester farm-to-table banksy Austin twitter handle freegan cred raw [bs_tooltip placement=”bottom” title=”At the bottom”]bottom[/bs_tooltip] single-origin coffee viral.

[toggles] [toggle title=”Tooltip Shortcodes” active=”not_active” class=”nopadding”][pre]

[bs_tooltip title=”On Top” delayhide=”2000″]top[/bs_tooltip]
[bs_tooltip placement=”right” title=”Right”]right[/bs_tooltip]
[/pre][/toggle][/toggles][/one_half][one_half_last]

Popover

Tight pants first level keffiyeh you probably haven’t heard of [bs_popover placement=”top” title=”Top” body=”This popover is on top” delayhide=”2000″]top[/bs_popover]. Photo booth beard raw denim letterpress vegan messenger bag stumptown. Farm-to-table seitan, mcsweeney’s fixie sustainable quinoa 8-bit american apparel have a terry richardson [bs_popover placement=”left” title=”Left” body=”This popover is to the left“]left[/bs_popover] chambray. Beard stumptown, cardigans banh mi lomo thundercats. Tofu biodiesel williamsburg marfa, four loko mcsweeney’s [bs_popover placement=”right” title=”Right” body=”This popover is to the right“]right[/bs_popover] vegan chambray. A really ironic artisan whatever keytar, scenester farm-to-table banksy Austin twitter handle freegan cred raw [bs_popover placement=”bottom” title=”Bottom” body=”This popover is at the bottom“]bottom[/bs_popover] single-origin coffee viral.

[toggles] [toggle title=”Popover Shortcodes” active=”not_active” class=”nopadding”][pre]

[bs_popover placement=”top” title=”Top” body=”This popover is <strong>on top</strong>” delayHide=”2000″]top[/bs_popover]
[bs_popover placement=”bottom” title=”Bottom” body=”This popover is <strong>at the bottom</strong>”]bottom[/bs_popover]
[/pre][/toggle][/toggles][/one_half_last]
[/background]
[background color=”#ffffff” padding_top=”45px” padding_bottom=”45px”]

Alert Examples

[spacer height=”30px”]
[two_third]

SIMPLE ALERTS

[spacer height=”20px”]
[bs_alert] This is a sample of the default style alert box [/bs_alert]
[bs_alert type=”info”] This is a sample of the info style alert box [/bs_alert][bs_alert type=”success”] This is a sample of the success style alert box [/bs_alert][bs_alert type=”error”] This is a sample of the danger style alert box [/bs_alert][bs_alert type=”simple”] This is a sample of the simple style alert box [/bs_alert]
[/two_third]
[one_third_last]

ALERT SHORTCODES

[spacer height=”20px”]
[toggles] [toggle title=”Alert Types” active=”not_active” class=”nopadding”][pre]

[bs_alert] Content Default Alert [/bs_alert]
[bs_alert type=”info”] Content Info Alert [/bs_alert]
[bs_alert type=”success”] Content Success Alert [/bs_alert]
[bs_alert type=”error”] Content Errod Alert [/bs_alert]

[/pre][/toggle][/toggles]
[/one_third_last]
[/background]
[background color=”#f1f1f1″ padding_top=”45px” padding_bottom=”45px”]

List Examples

[spacer height=”30px”]
[one_fourth]
[styledlist style=”1″]

[/styledlist]
[/one_fourth]
[one_fourth]
[styledlist style=”2″]

[/styledlist]
[/one_fourth]
[one_fourth]
[styledlist style=”3″]

[/styledlist]
[/one_fourth]
[one_fourth_last]
[styledlist style=”4″]

[/styledlist]
[/one_fourth_last]
[spacer height=”25px”]
[bs_collapse] [bs_collapse_item title=”Shortcode Example” class=”nopadding” active=”not_active”]
[pre]
[styledlist style=”1″]
<ul>
<li><span>Lorem ipsum dolor sit amet, ut duo kauden lorem</span></li>
<li><span>Justo aeterno scripserit eos ut, sagettis latine veri</span></li>
<li><span>Prodesset ei has audiam et eam, vis dam civibus</span></li>
<li><span>Nominavi intellegebat ut pri otace porent et quali</span>
<ul class=”style1″>
<li><span>Decore iuvaret torquatos ut proper metre san</span></li>
<li><span> At cum dicat saperet, etusto docendi peni orc</span></li>
</ul>
</li>
<li><span>Sea prima abhorreant ad viderer tibique et libri</span></li>
</ul>
[/styledlist]
[/pre]
[/bs_collapse_item] [/bs_collapse]

[/background]
[background color=”#ffffff” padding_top=”45px” padding_bottom=”45px”]

Tab Examples

[spacer height=”30px”]
[bs_tabs] [bs_tab title=”First Tab”]Raw denim you probably haven’t heard of them jean shorts Austin. Nesciunt tofu stumptown aliqua, retro synth master cleanse. Mustache cliche tempor, williamsburg carles vegan helvetica. Reprehenderit butcher retro keffiyeh dreamcatcher synth. Cosby sweater eu banh mi, qui irure terry richardson ex squid. Aliquip placeat salvia cillum iphone. Seitan aliquip quis cardigan american apparel, butcher voluptate nisi qui. [/bs_tab][bs_tab title=”Second”]Food truck fixie locavore, accusamus mcsweeney’s marfa nulla single-origin coffee squid. Exercitation +1 labore velit, blog sartorial PBR leggings next level wes anderson artisan four loko farm-to-table craft beer twee. Qui photo booth letterpress, commodo enim craft beer mlkshk aliquip jean shorts ullamco ad vinyl cillum PBR. Homo nostrud organic, assumenda labore aesthetic magna delectus mollit. Keytar helvetica VHS salvia yr, vero magna velit sapiente labore stumptown. Vegan fanny pack odio cillum wes anderson 8-bit, sustainable jean shorts beard ut DIY ethical culpa terry richardson biodiesel. Art party scenester stumptown, tumblr butcher vero sint qui sapiente accusamus tattooed echo park.[/bs_tab][bs_tab title=”Third”] Food truck fixie locavore, accusamus mcsweeney’s marfa nulla single-origin coffee squid. Exercitation +1 labore velit, blog sartorial PBR leggings next level wes anderson artisan four loko farm-to-table craft beer twee. Qui photo booth letterpress, commodo enim craft beer mlkshk aliquip jean shorts ullamco ad vinyl cillum PBR. Homo nostrud organic, assumenda labore aesthetic magna delectus mollit. Keytar helvetica VHS salvia yr, vero magna velit sapiente labore stumptown. Vegan fanny pack odio cillum wes anderson 8-bit, sustainable jean shorts beard ut DIY ethical culpa terry richardson biodiesel. Art party scenester stumptown, tumblr butcher vero sint qui sapiente accusamus tattooed echo park.[/bs_tab] [/bs_tabs]
[spacer height=”25px”]
[toggles] [toggle title=”How to create Tabs via Shortcode” active=”not_active” class=”nopadding”][pre]

[bs_tabs]
[bs_tab title=”First Tab”] Content [/bs_tab]
[bs_tab title=”Second Tab”] Content [/bs_tab]
[bs_tab title=”Third Tab”] Content [/bs_tab]
[/bs_tabs]

[/pre][/toggle][/toggles]

[/background]
[background color=”#f1f1f1″ padding_top=”45px” padding_bottom=”45px”]

Styling Examples

[spacer height=”30px”]

DROPCAPS AND HIGHLIGHT

[spacer height=”20px”]
[one_fourth]
[dropcap style=”invers”]Phasellus diam nunc, tempor eg bibendum sit amet, placerat sit amet tellus. [bs_label type=”success”]Quisque imperdiet[/bs_label] feugiat neque nec rhoncus. Sed laoreet mauri non ante vulputate consectetur. Duis dignissim scelerisque tellus.[/dropcap]
[/one_fourth]
[one_fourth]
[dropcap]Phasellus diam nunc, tempor eg bibendum sit amet, placerat sit amet tellus. [bs_label type=”warning”]Quisque imperdiet[/bs_label] feugiat neque nec rhoncus. Sed laoreet mauri non ante vulputate consectetur. Duis dignissim scelerisque tellus.[/dropcap]
[/one_fourth]
[one_fourth]
[dropcap]Phasellus diam nunc, tempor eg bibendum sit amet, placerat sit amet tellus. [bs_label type=”info”]Quisque imperdiet[/bs_label] feugiat neque nec rhoncus. Sed laoreet mauri non ante vulputate consectetur. Duis dignissim scelerisque tellus.[/dropcap]
[/one_fourth]
[one_fourth_last]
Phasellus diam nunc, tempor eg bibendum sit amet, placerat sit amet tellus. Quisque imperdiet feugiat neque nec rhoncus. Sed laoreet mauri [bs_label type=”error”]vulputate consectetur.[/bs_label] Duis dignissim scelerisque tellus.
[/one_fourth_last]
[spacer height=”25px”]
[toggles] [toggle title=”Dropcap Shortcode” active=”not_active” class=”nopadding”][pre]

[dropcap]Mis carpens…[/dropcap]
[dropcap style=”circle” color=”success”]Lorem… [/dropcap]
[dropcap style=”circle” color=”success”]Dunter ellastis[/dropcap]
[/pre][/toggle][toggles] [toggle title=”Labels” active=”not_active” class=”nopadding”][pre]

[bs_label type=”success”]Cumque egori[/bs_label]
[bs_label type=”warning”]ascendit[/bs_label]
[bs_label type=”inverse”]Lacrimas effunditis[/bs_label]
[bs_label]aliquam tractos mas[/bs_label][/pre][/toggle][/toggles]
[/background]
[background color=”#fff” padding_top=”45px” padding_bottom=”45px”]

Blockquotes Examples

[spacer height=”30px”]

FULLWIDTH / LEFT / RIGHT

[spacer height=”20px”]
[blockquote author=”Leonardo da Vinci” quote=”Simplicity is the ultimate sophistication.” style=”fullwidthbq” color=”dark” float=”centered”]
[spacer height=”40px”]
[blockquote author=”Leonardo da Vinci” quote=”Simplicity is the ultimate sophistication.” style=”” color=”dark” float=”left”]
[spacer height=”40px”]
[blockquote author=”Leonardo da Vinci” quote=”Simplicity is the ultimate sophistication.” style=”” color=”dark” float=”right”]
[spacer height=”40px”]
[toggles] [toggle title=”BlockQuotes Shortcode” active=”not_active” class=”nopadding”][pre]

[spacer height=”20px”]
[blockquote author=”Leonardo da Vinci” quote=”Simplicity is the ultimate sophistication.” style=”fullwidthbq” color=”dark” float=”centered”]
[spacer height=”40px”]
[blockquote author=”Leonardo da Vinci” quote=”Simplicity is the ultimate sophistication.” style=”” color=”dark” float=”left”]
[spacer height=”40px”]
[blockquote author=”Leonardo da Vinci” quote=”Simplicity is the ultimate sophistication.” style=”” color=”dark” float=”right”]
[spacer height=”40px”]
[/pre][/toggle][/toggles]