Buttons

Here are some examples of the default Button Colors. Aliquam eu ante iaculis, ultricies orci ut, pellentesque elit. Curabitur placerat orci libero.

Default Buttons Styles

Default Primary Success Info Warning Danger

Shortcode

{button title="" link="#" color="btn-default"}Default{/button}
{button title="" link="#" color="btn-primary"}Primary{/button}
{button title="" link="#" color="btn-success"}Success{/button}
{button title="" link="#" color="btn-info"}Info{/button}
{button title="" link="#" color="btn-warning"}Warning{/button}
{button title="" link="#" color="btn-danger"}Danger{/button}

Buttons Alternative Styles

Default Primary Success Info Warning Danger

Shortcode

{button title="" style="btn-alt" link="#" color="btn-default"}Default{/button}
{button title="" style="btn-alt" link="#" color="btn-primary"}Primary{/button}
{button title="" style="btn-alt" link="#" color="btn-success"}Success{/button}
{button title="" style="btn-alt" link="#" color="btn-info"}Info{/button}
{button title="" style="btn-alt" link="#" color="btn-warning"}Warning{/button}
{button title="" style="btn-alt" link="#" color="btn-danger"}Danger{/button}

Buttons Sizes

Primary-XS Primary-SM Primary-MD Primary-LG

Shortcode

{button title="" link="#" color="btn-primary" size="btn-xs"}Default{/button}
{button title="" link="#" color="btn-primary" size="btn-sm"}Default{/button}
{button title="" link="#" color="btn-primary" size="btn-md"}Default{/button}
{button title="" link="#" color="btn-primary" size="btn-lg"}Default{/button}

Buttons with Icons

Default Left Primary Right Success Left Info Right

Shortcode

{button title="" link="#" color="btn-default"}
  {icon-avendor name="chat-1" class="iconleft"}Default Left
{/button}

{button title="" link="#" color="btn-primary"}
  Primary Right{icon-fa name="fa-space-shuttle" class="iconright"}
{/button}

{button title="" link="#" color="btn-success" style="btn-alt"}
  {icon-avendor name="atom" class="iconleft"}Success Left
{/button}

{button title="" link="#" color="btn-info" style="btn-alt"}
  Info Right{icon-avendor name="pin-2" class="iconright"}
{/button}

Buttons with Livicons

Default Left Primary Right Success Left Info Right

Shortcode

{button title="" link="#" color="btn-default"}
  {icon-livicon ... class="iconleft"}Default Left
{/button}

{button title="" link="#" color="btn-primary"}
  Primary Right{icon-livicon ... class="iconright"}
{/button}

{button title="" link="#" color="btn-success" style="btn-alt"}
  {icon-livicon ... class="iconleft"}Success Left
{/button}

{button title="" link="#" color="btn-info" style="btn-alt"}
  Info Right{icon-livicon ... class="iconright"}
{/button}

Buttons with Functions

Image Vimeo New Window Fans

Shortcode

{button link="image.jpg" color="btn-default" lightbox="image"}Image{/button}

{button title="Tooltip Text here" link="#" color="btn-primary" class="ToolTip" data="data-opie-position='tl:bl'"}Tooltip{/button}

{button link="vimeo.com" color="btn-success" lightbox="video"}Vimeo{/button}

{button title="" link="http://www.ws-theme.com" color="btn-info" style="btn-alt" target="_blank"}New Window{/button}

{button link="#" color="btn-warning" style="btn-alt"}
  {icon-fa name="fa-thumbs-up" class="iconleft"}
  {counter-text class="xbold" start="0" end="957" speed="9000" refresh="50"} Fans
{/button}