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”]

[code language=”php” gutter=”false” tabsize=”4″ toolbar=”true”][[button text="Cool Button…" title="Cool Button" url="http://www.your-link-goes-here.com/" align="left"]][/code]

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”]

[code language=”php” gutter=”false” tabsize=”4″ toolbar=”true”][[button text="Looooooooooong Button…" title="Looooooooooong Button…" style="light" url="http://www.your-link-goes-here.com/" align="right" target="_blank"]][/code]

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”]

[code language=”php” gutter=”false” tabsize=”4″ toolbar=”true”][[small_button text="Cool Button…" title="Cool Button" url="http://www.your-link-goes-here.com/" align="left"]][/code]

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 language=”php” gutter=”false” tabsize=”4″ toolbar=”true”][[small_button style="light" text="Cool Button…" title="Cool Button…" url="http://www.your-link-goes-here.com/" 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”]
[code language=”php” gutter=”false” tabsize=”4″ toolbar=”true”][[round_button text="Round Button…" style="light" title="Round Button" url="http://www.your-link-goes-here.com/" align="left" target="_blank"]][/code]

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]
[code language=”php” gutter=”false” tabsize=”4″ toolbar=”true”][[custom_button text="Custom Button" title="Custom Button" url="http://www.your-link-goes-here.com/" size="medium" bg_color="#FF5C00" text_color="#FFFFFF" align="left" target="_self"]][/code]

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]
[code language=”php” gutter=”false” tabsize=”4″ toolbar=”true”]
[[custom_button text="X-Large Custom Button" title="X-Large Custom Button" url="http://www.your-link-goes-here.com/" size="x-large" bg_color="#FF5C00" text_color="#FFFFFF" align="left" target="_self"]]
[/code]
[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]
[code language=”php” gutter=”false” tabsize=”4″ toolbar=”true”]
[[custom_button text="Large Custom Button" title="Large Custom Button" url="http://www.your-link-goes-here.com/" size="large" bg_color="#FF5C00" text_color="#FFFFFF" align="left" target="_self"]]
[/code]
[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]
[code language=”php” gutter=”false” tabsize=”4″ toolbar=”true”]
[[custom_button text="Medium Custom Button" title="Medium Custom Button" url="http://www.your-link-goes-here.com/" size="medium" bg_color="#FF5C00" text_color="#FFFFFF" align="left" target="_self"]]
[/code]
[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]
[code language=”php” gutter=”false” tabsize=”4″ toolbar=”true”]
[[custom_button text="Small Custom Button" title="Small Custom Button" url="http://www.your-link-goes-here.com/" size="small" bg_color="#FF5C00" text_color="#FFFFFF" align="left" target="_self"]]
[/code]

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]
[code language=”php” gutter=”false” tabsize=”4″ toolbar=”true”]
[[custom_button text="Large Custom Button" title="Large Custom Button" url="http://www.your-link-goes-here.com/" size="large" bg_color="#FF5C00" text_color="#FFFFFF" align="right" target="_self"]]
[/code]

[divider_top]