Buttons

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:

READ MORE...
[flat_button text="READ MORE..." title="Flat Button" url="http://www.your_link_goes_here..." padding="10px 20px" bg_color="transparent" border_color="#FF5C00" border_width="1px" text_color="#A9A9A9" text_size="10px" align="left" target="_self"]
[flat_button text="Read more..." title="Flat Button" url="http://www.your_link_goes_here..." padding="14px 36px" bg_color="#FF5C00" border_color="#FF5C00" border_width="1px" text_color="#FFFFFF" text_size="14px" align="center" target="_self"]
Read more...
[flat_button text="Read more..." title="Flat Button" url="http://www.your_link_goes_here..." padding="20px 60px" bg_color="#59CCF2" border_color="#1C99C2" border_width="2px" text_color="#FFFFFF" text_size="20px" align="right" target="_self"]
READ MORE...
[flat_button text="READ MORE..." title="Flat Button" url="http://www.your_link_goes_here..." padding="30px 110px" bg_color="transparent" border_color="#5EB840" border_width="2px" text_color="#5EB840" text_size="18px" align="right" target="_self"]
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):

Cool Button...
[button text="Cool Button..." title="Cool Button" url="http://www.your_link_goes_here..." align="left"]

Here’s another example with alignment ‘center’:

[button text="Centered Button..." title="Centered Button..." style="light" url="http://www.your_link_goes_here..." align="center" target="_self"]

Here’s another example with longer text, ‘light’ style and ‘right’ alignment and the link opening in a new window:

Looooooooooong Button...
[button text="Looooooooooong Button..." title="Looooooooooong Button..." style="light" url="http://www.your_link_goes_here..." 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):

Cool Button...
[small_button text="Cool Button..." title="Cool Button" url="http://www.your_link_goes_here..." align="left"]

Here’s another example of ‘light’ style and ‘right’ alignment and the link opening in a new window:

Cool Button...
[small_button style="light" text="Cool Button..." title="Cool Button..." url="http://www.your_link_goes_here..." align="right" target="_blank"]
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...
[round_button text="Round Button..." style="light" title="Round Button" url="http://www.your_link_goes_here..." align="left" target="_blank"]
“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

[read_more text="Read more" title="Read More..." url="http://www.your_link_goes_here..." 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

[read_more text="Read more" title="Read More..." url="http://www.your_link_goes_here..." align="right" target="_self"]
Custom Button:

You can pick the colors, size and alignment of your button.
To generate a custom button use the following shortcode syntax:

Custom Button Custom Button Custom Button Custom Button Custom Button Custom Button Custom Button Custom Button
[custom_button text="Custom Button" title="Custom Button" url="http://www.your_link_goes_here..." size="medium" bg_color="#FF5C00" text_color="#FFFFFF" align="left" target="_self"]

The “size” options are: ‘small’, ‘medium’, ‘large’ and ‘x-large’:

X-Large Custom Button
[custom_button text="X-Large Custom Button" title="X-Large Custom Button" url="http://www.your_link_goes_here..." size="x-large" bg_color="#FF5C00" text_color="#FFFFFF" align="left" target="_self"]
Large Custom Button
[custom_button text="Large Custom Button" title="Large Custom Button" url="http://www.your_link_goes_here..." size="large" bg_color="#FF5C00" text_color="#FFFFFF" align="left" target="_self"]
Medium Custom Button
[custom_button text="Medium Custom Button" title="Medium Custom Button" url="http://www.your_link_goes_here..." size="medium" bg_color="#FF5C00" text_color="#FFFFFF" align="left" target="_self"]
Small Custom Button
[custom_button text="Small Custom Button" title="Small Custom Button" url="http://www.your_link_goes_here..." size="small" bg_color="#FF5C00" text_color="#FFFFFF" align="left" target="_self"]
Right alignment:
Large Custom Button
[custom_button text="Large Custom Button" title="Large Custom Button" url="http://www.your_link_goes_here..." size="large" bg_color="#FF5C00" text_color="#FFFFFF" align="right" target="_self"]
Center alignment:
[custom_button text="Centered Custom Button" title="Centered Custom Button" url="http://www.your_link_goes_here..." size="large" bg_color="#FF5C00" text_color="#FFFFFF" align="center" target="_self"]

BLOG POSTS

ADDRESS

321 Street Name, UK, London
Phone: (000) 765-4321
Fax: (000) 765-4321
Website: http://yoursitename.com
Email: info@yoursitename.com

DISCLAIMER

Important: This site has been setup purely for demonstration purposes and all the content are designed to showcase the uDESIGN WP theme as it could look on a live site.
All images are copyrighted to their respective owners.