Any size any color! Fully Customizable Flat Button:

With the flat button shortcode you create various button sizes by simply adjusting the padding and font size. Here’s some examples:
[clear]
[flat_button text=»READ MORE…» title=»Flat Button» url=»#flat-btn-demo» padding=»10px 20px» bg_color=»transparent» border_color=»#FF5C00″ border_width=»1px» text_color=»#FF5C00″ text_size=»10px» align=»left» target=»_self»]

[clear]

[flat_button text=»Read more…» title=»Flat Button» url=»#flat-btn-demo» padding=»14px 36px» bg_color=»#FF5C00″ border_color=»#FF5C00″ border_width=»1px» text_color=»#FFFFFF» text_size=»14px» align=»center» target=»_self»]

[clear]

[flat_button text=»Read more…» title=»Flat Button» url=»#flat-btn-demo» padding=»20px 60px» bg_color=»#59CCF2″ border_color=»#1C99C2″ border_width=»2px» text_color=»#FFFFFF» text_size=»20px» align=»right» target=»_self»]

[clear]

[flat_button text=»READ MORE…» title=»Flat Button» url=»#flat-btn-demo» padding=»30px 110px» bg_color=»transparent» border_color=»#5EB840″ border_width=»2px» text_color=»#5EB840″ text_size=»18px» align=»right» target=»_self»]

[divider_top]

Expandable Buttons shortcode:
Large Button Example:

You can generate a button by using the following shortcode syntax (if style is not specified it defaults to dark):
[button text=»Cool Button…» title=»Cool Button» url=»#exp-btns-demo» align=»left»]

Here’s another example with alignment ‘center’:
[button text=»Centered Button…» title=»Centered Button…» style=»light» url=»#exp-btns-demo» align=»center» target=»_self»]

Here’s another example with longer text, ‘light’ style and ‘right’ alignment and the link opening in a new window:
[button text=»Looooooooooong Button…» title=»Looooooooooong Button…» style=»light» url=»#exp-btns-demo» align=»right» target=»_blank»]

Small Button Example:

You can generate a button by using the following shortcode syntax (if style is not specified it defaults to dark):
[small_button text=»Cool Button…» title=»Cool Button» url=»#exp-btns-demo» align=»left»]

Here’s another example of ‘light’ style and ‘right’ alignment and the link opening in a new window:
[small_button style=»light» text=»Cool Button…» title=»Cool Button…» url=»#exp-btns-demo» align=»right» target=»_blank»]
[/code]

Round Button:

You can generate a round button by using the following shortcode syntax (if style is not specified it defaults to dark), also a target can be specified by adding target="_blank" to open the link in s a new window:
[round_button text=»Round Button…» style=»light» title=»Round Button» url=»#exp-btns-demo» align=»left» target=»_blank»]

[divider_top]

«Read more» link with shortcode:

You can generate a «Read more» link as seen in this demos site by using the following shortcode syntax:
[read_more text=»Read more» title=»Read More…» url=»#read-more-btn-demo» align=»left» target=»_self»]

«Read more» link right aligned:

You can generate a «Read more» link, this time «right» aligned by using the following shortcode syntax:
[read_more text=»Read more» title=»Read More…» url=»#read-more-btn-demo» align=»right» target=»_self»]

[divider_top]

Custom Button:

You can pick the colors, size and alignment of your button.
To generate a custom button use the following shortcode syntax:
[clear]
[custom_button text=»Custom Button» title=»Custom Button» url=»#custom-btn-demo» size=»medium» bg_color=»#FF5C00″ text_color=»#FFFFFF» align=»left» target=»_self»] [custom_button text=»Custom Button» title=»Custom Button» url=»#custom-btn-demo» size=»medium» bg_color=»#333333″ text_color=»#FFFFFF» align=»left» target=»_self»] [custom_button text=»Custom Button» title=»Custom Button» url=»#custom-btn-demo» size=»medium» bg_color=»#666666″ text_color=»#FFFFFF» align=»left» target=»_self»] [custom_button text=»Custom Button» title=»Custom Button» url=»#custom-btn-demo» size=»medium» bg_color=»#FFFFFF» text_color=»#333333″ align=»left» target=»_self»] [custom_button text=»Custom Button» title=»Custom Button» url=»#custom-btn-demo» size=»medium» bg_color=»#00ADEE» text_color=»#FFFFFF» align=»left» target=»_self»] [custom_button text=»Custom Button» title=»Custom Button» url=»#custom-btn-demo» size=»medium» bg_color=»#91BD09″ text_color=»#FFFFFF» align=»left» target=»_self»] [custom_button text=»Custom Button» title=»Custom Button» url=»#custom-btn-demo» size=»medium» bg_color=»#E62727″ text_color=»#FFFFFF» align=»left» target=»_self»] [custom_button text=»Custom Button» title=»Custom Button» url=»#custom-btn-demo» size=»medium» bg_color=»#FC0FC4″ text_color=»#FFFFFF» align=»left» target=»_self»]

[clear]

The «size» options are: ‘small’, ‘medium’, ‘large’ and ‘x-large’:
[clear] [custom_button text=»X-Large Custom Button» title=»X-Large Custom Button» url=»#custom-btn-demo» size=»x-large» bg_color=»#FF5C00″ text_color=»#FFFFFF» align=»left» target=»_self»]

[clear]
[custom_button text=»Large Custom Button» title=»Large Custom Button» url=»#custom-btn-demo» size=»large» bg_color=»#FF5C00″ text_color=»#FFFFFF» align=»left» target=»_self»]
[clear]
[custom_button text=»Medium Custom Button» title=»Medium Custom Button» url=»#custom-btn-demo» size=»medium» bg_color=»#FF5C00″ text_color=»#FFFFFF» align=»left» target=»_self»]
[clear]
[custom_button text=»Small Custom Button» title=»Small Custom Button» url=»#custom-btn-demo» size=»small» bg_color=»#FF5C00″ text_color=»#FFFFFF» align=»left» target=»_self»]

[clear]

Right alignment:

[clear] [custom_button text=»Large Custom Button» title=»Large Custom Button» url=»#custom-btn-demo» size=»large» bg_color=»#FF5C00″ text_color=»#FFFFFF» align=»right» target=»_self»]

[clear]

Center alignment:

[clear] [custom_button text=»Centered Custom Button» title=»Centered Custom Button» url=»#custom-btn-demo» size=»large» bg_color=»#FF5C00″ text_color=»#FFFFFF» align=»center» target=»_self»]

[divider_top]