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
{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
{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
{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
{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
{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 Tooltip Vimeo New Window Fans
{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}