Shortcodes: Buttons

BUTTONS WITH ICONS

This is just a small fraction of the buttons. You set the color of background and border in the shortcode so variations are limitless. Icons are picked up from Font Awesome so you can choose from over 300 different icons.

[button_icon link=”http://premiumcoding.com” background_color=”#DF5148″ border_color=”#C53D35″ text_color=”#fff” icon=”fa-link” ]Read more link Button[/button_icon]

[button_icon link=”http://premiumcoding.com” background_color=”#379bde” border_color=”#2c84bd” text_color=”#fff” icon=”fa-cloud-download” ]Download Button[/button_icon]

[button_icon link=”http://premiumcoding.com” background_color=”#34495E” border_color=”#2C3E50″ text_color=”#fff” icon=”fa-cloud-upload” ]Upload Button[/button_icon]

[button_icon link=”http://premiumcoding.com” background_color=”#3498DB” border_color=”#2980B9″ text_color=”#fff” icon=”fa-shopping-cart” ]Shopping Button[/button_icon]

[button_icon link=”http://premiumcoding.com” background_color=”#2ECC71″ border_color=”#27AE60″ text_color=”#fff” icon=”fa-home” ]Home page Button[/button_icon]

[button_icon link=”http://premiumcoding.com” background_color=”#95A5A6″ border_color=”#7F8C8D” text_color=”#fff” icon=”fa-save” ]Save Settings[/button_icon]

[button_icon link=”http://premiumcoding.com” background_color=”#9B59B6″ border_color=”#8E44AD” text_color=”#fff” icon=”fa-print” ]Print this Document[/button_icon]

[button_icon link=”http://premiumcoding.com” background_color=”#FFD56C” border_color=”#eac058″ text_color=”#111″ icon=”fa-gear” ]Just an awesome Icon[/button_icon]

[break/]

[break/]

SPINNING BUTTONS WITH ICONS

Did you know you can make the icons spin? A simple animation will add a spark of life into your buttons 🙂

[button_icon link=”http://premiumcoding.com” background_color=”#DF5148″ border_color=”#C53D35″ text_color=”#fff” icon=”fa-spinner fa-spin” ]SPINNING BUTTON[/button_icon]

[button_icon link=”http://premiumcoding.com” background_color=”#379bde” border_color=”#2c84bd” text_color=”#fff” icon=”fa-refresh fa-spin” ]SPINNING BUTTON[/button_icon]

[button_icon link=”http://premiumcoding.com” background_color=”#34495E” border_color=”#2C3E50″ text_color=”#fff” icon=”fa-cog fa-spin” ]SPINNING BUTTON[/button_icon]

[button_icon link=”http://premiumcoding.com” background_color=”#3498DB” border_color=”#2980B9″ text_color=”#fff” icon=”fa-sun-o fa-spin” ]SPINNING BUTTON[/button_icon]

[break/]

[break/]

SIMPLE ROUND BUTTONS

A set of simple rounded buttons with lower border. You can set any background color and any color of text.

[button_round link=”http://premiumcoding.com” background_color=”#DF5148″ border_color=”#C53D35″ text_color=”#fff” ]VIEW MORE[/button_round]

[button_round link=”http://premiumcoding.com” background_color=”#379bde” border_color=”#2c84bd” text_color=”#fff” ]VIEW MORE[/button_round]

[button_round link=”http://premiumcoding.com” background_color=”#34495E” border_color=”#2C3E50″ text_color=”#fff” ]VIEW MORE[/button_round]

[button_round link=”http://premiumcoding.com” background_color=”#3498DB” border_color=”#2980B9″ text_color=”#fff” ]VIEW MORE[/button_round]

[button_round link=”http://premiumcoding.com” background_color=”#2ECC71″ border_color=”#27AE60″ text_color=”#fff” ]VIEW MORE[/button_round]

[button_round link=”http://premiumcoding.com” background_color=”#95A5A6″ border_color=”#7F8C8D” text_color=”#fff” ]VIEW MORE[/button_round]

[button_round link=”http://premiumcoding.com” background_color=”#9B59B6″ border_color=”#8E44AD” text_color=”#fff” ]VIEW MORE[/button_round]

[button_round link=”http://premiumcoding.com” background_color=”#FFD56C” border_color=”#eac058″ text_color=”#111″ ]VIEW MORE[/button_round]

[break/]

[break/]

SIMPLE BUTTONS

A set of simple buttons with lower border.

[button_simple link=”http://premiumcoding.com” background_color=”#DF5148″ border_color=”#C53D35″ text_color=”#fff” ]DARK RED BUTTON[/button_simple]

[button_simple link=”http://premiumcoding.com” background_color=”#379bde” border_color=”#2c84bd” text_color=”#fff” ]TURQUOISE BUTTON[/button_simple]

[button_simple link=”http://premiumcoding.com” background_color=”#34495E” border_color=”#2C3E50″ text_color=”#fff” ]MIDNIGHT BLUE BUTTON[/button_simple]

[button_simple link=”http://premiumcoding.com” background_color=”#3498DB” border_color=”#2980B9″ text_color=”#fff” ]SKY BLUE BUTTON[/button_simple]

[button_simple link=”http://premiumcoding.com” background_color=”#2ECC71″ border_color=”#27AE60″ text_color=”#fff” ]GRASS GREEN BUTTON[/button_simple]

[button_simple link=”http://premiumcoding.com” background_color=”#95A5A6″ border_color=”#7F8C8D” text_color=”#fff” ]SIMPLE GREY BUTTON[/button_simple]

[button_simple link=”http://premiumcoding.com” background_color=”#9B59B6″ border_color=”#8E44AD” text_color=”#fff” ]AMETHYST BUTTON[/button_simple]

[button_simple link=”http://premiumcoding.com” background_color=”#FFD56C” border_color=”#eac058″ text_color=”#111″ ]SUNNY BUTTON[/button_simple]

[break/]

[break/]

SOCIAL BUTTONS

A set of convenient social buttons.

[button_social link=”https://twitter.com/premiumcoding” background_color=”#32CCFE” border_color=”#18ACDC” text-color=”#fff” icon=”fa-twitter” ]Follow us on Twitter[/button_social]

[button_social link=”https://www.facebook.com/PremiumCoding” background_color=”#4D68A2″ border_color=”#324D87″ text-color=”#fff” icon=”fa-facebook” ]Follow us on Facebook[/button_social]

[button_social link=”https://plus.google.com/+aleskrivecPMC/posts” background_color=”#E63532″ border_color=”#D7201D” text-color=”#fff” icon=”fa-google-plus” ]Follow us on Google+[/button_social]

[button_social link=”http://instagram.com/gljivec” background_color=”#967D69″ border_color=”#7F6652″ text-color=”#fff” icon=”fa-instagram” ]Follow us on Instagram[/button_social]

[button_social link=”http://www.pinterest.com/gljivec/” background_color=”#CC2127″ border_color=”#B4151B” text-color=”#fff” icon=”fa-pinterest” ]Follow us on Pinterest[/button_social]

[button_social link=”http://dribbble.com/gljivec” background_color=”#EA4C89″ border_color=”#D4306F” text-color=”#fff” icon=”fa-dribbble” ]Follow us on Dribbble[/button_social]

[button_social link=”https://www.youtube.com/channel/UCNBgJOY5FG13tGLEIlax5Zw” background_color=”#E63532″ border_color=”#D7201D” text-color=”#fff” icon=”fa-youtube” ]Follow us on Youtube[/button_social]

[button_social link=”http://premiumcoding.com” background_color=”#017EB4″ border_color=”#026c9a” text-color=”#fff” icon=”fa-linkedin” ]Follow us on LinkedIn[/button_social]

[break/]

[break/]

DOUBLE BUTTONS

A set of a little different buttons with double background.

[button_simple_double link=”http://premiumcoding.com” background_color_double=”#C53D35″ background_color=”#DF5148″ text_color=”#fff” ]Double simple button[/button_simple_double]

[button_simple_double link=”http://premiumcoding.com” background_color_double=”#2c84bd” background_color=”#379bde” text_color=”#fff” ]Double simple button[/button_simple_double]

[button_simple_double link=”http://premiumcoding.com” background_color_double=”#27AE60″ background_color=”#2ECC71″ text_color=”#fff” ]Double simple button[/button_simple_double]

[button_simple_double link=”http://premiumcoding.com” background_color_double=”#2980B9″ background_color=”#3498DB” text_color=”#fff” ]Double simple button[/button_simple_double]

[button_simple_double link=”http://premiumcoding.com” background_color_double=”#8E44AD” background_color=”#9B59B6″ text_color=”#fff” ]Double simple button[/button_simple_double]

[button_simple_double link=”http://premiumcoding.com” background_color_double=”#2C3E50″ background_color=”#34495E” text_color=”#fff” ]Double simple button[/button_simple_double]

[button_simple_double link=”http://premiumcoding.com” background_color_double=”#7F8C8D” background_color=”#95A5A6″ text_color=”#fff” ]Double simple button[/button_simple_double]

[button_simple_double link=”http://premiumcoding.com” background_color_double=”#ecbe4c” background_color=”#FFD56C” text_color=”#111″ ]Double simple button[/button_simple_double]

[break/]

[break/]

DOUBLE BUTTONS ICONS ONLY

A set of a little different buttons with double background and icons only.

[button_icon_double link=”http://premiumcoding.com” background_color_double=”#C53D35″ background_color=”#DF5148″ text_color=”#fff” icon=”fa-picture-o” ][/button_icon_double]

[button_icon_double link=”http://premiumcoding.com” background_color_double=”#2c84bd” background_color=”#379bde” text_color=”#fff” icon=”fa-picture-o” ][/button_icon_double]

[button_icon_double link=”http://premiumcoding.com” background_color_double=”#27AE60″ background_color=”#2ECC71″ text_color=”#fff” icon=”fa-picture-o” ][/button_icon_double]

[button_icon_double link=”http://premiumcoding.com” background_color_double=”#2980B9″ background_color=”#3498DB” text_color=”#fff” icon=”fa-picture-o” ][/button_icon_double]

[button_icon_double link=”http://premiumcoding.com” background_color_double=”#8E44AD” background_color=”#9B59B6″ text_color=”#fff” icon=”fa-picture-o” ][/button_icon_double]

[button_icon_double link=”http://premiumcoding.com” background_color_double=”#2C3E50″ background_color=”#34495E” text_color=”#fff” icon=”fa-picture-o” ][/button_icon_double]

[button_icon_double link=”http://premiumcoding.com” background_color_double=”#7F8C8D” background_color=”#95A5A6″ text_color=”#fff” icon=”fa-picture-o” ][/button_icon_double]

[button_icon_double link=”http://premiumcoding.com” background_color_double=”#DF5148″ background_color=”#E14F4F” text_color=”#fff” icon=”fa-picture-o” ][/button_icon_double]

[button_icon_double link=”http://premiumcoding.com” background_color_double=”#ecbe4c” background_color=”#FFD56C” text_color=”#111″ icon=”fa-picture-o” ][/button_icon_double]

[break/]

[break/]

Tinggalkan Balasan

Alamat email Anda tidak akan dipublikasikan. Ruas yang wajib ditandai *