Articles

BUTTON DESIGNS

CALL TO ACTION BUTTONS

This is a big yellow button This is a big button

Shortcode:

[big-button color="yellow" link="http://www.website.com/"]This is a big yellow button[/big-button]
 [big-button link="http://www.website.com/"]This is a big button[/big-button]

You can also use straight css class like .big-button (for making it big) and also .yellow, .green, .blue etc (for adding color). The html of this example is:

<a href="http://www.website.com/" class="big-button yellow">This is a big yellow button</a>

Medium blue button Green medium button Default medium button

Shortcode:

[medium-button color="blue" link="http://www.website.com/"]This is a medium blue button[/medium-button]
 [medium-button color="green" link="http://www.website.com/"]This is a medium green button[/medium-button]
 [medium-button link="http://www.website.com/"]This is a default medium button[/medium-button]

You can also use straight css class like .big-button (for making it big) and also .yellow, .green, .blue etc (for adding color). The html of this example is:

<a href="http://www.website.com/" class="medium-button yellow">This is a medium yellow button</a>

Small bluebutton Green small button Small red button Default small button

Shortcode:

[small-button color="blue" link="http://www.website.com/"]This is a small blue button[/small-button]
 [small-button color="green" link="http://www.website.com/"]This is a small green button[/small-button]
 [small-button color="red" link="http://www.website.com/"]This is a small red button[/small-button]
 [small-button link="http://www.website.com/"]This is a default small button[/small-button]

You can also use straight css class like .big-button (for making it big) and also .yellow, .green, .blue etc (for adding color). The html of this example is:

<a href="http://www.website.com/" class="small-button yellow">This is a small yellow button</a>

CUSTOM BUTTONS

The shortcode for buttons:

[button link="" title="" style="1" or style="2" rounded="yes"][/button]

The below examples have the style="1" to the shortcode:

Pellentesque Vestibulum condimentum sed

The below examples have the style="2" to the shortcode:

Pellentesque Vestibulum condimentum sed