Other Elements

[epsilon_heading1 title= »Other Elements » full_width= »0″ bgstyle= »bg-red-dark » bgcolor= » » tcolor= » » icon= »fa-question » icolor= » » ]

Features as simple as buttons or elements that have a significant, important, function, such as calling to action, or different button classes that are important for everything catchy you may need!

[epsilon_heading2 title= »Buttons » stitle= »Simple buttons, many variations! » tcolor= » » tcolor2= » » full_width= »1″ url= »http://mobile.webbudesign.com/circlemobile/wp-content/uploads/sites/14/2016/10/3.jpg » ocolor= »1″ ]

[epsilon_container fullscreen= »no »]

[epsilon_one_thirdt]Regular Button Classes
Oldschool buttons that fit all needs.

[epsilon_button type= »re » icon= » » text= »Button » link= »# » target= »_self » prestyle= »green » size= » » tcolor= »#ffffff » bgcolor= » » ][epsilon_button type= »re » icon= » » text= »Button » link= »# » target= »_self » prestyle= »teal » size= » » tcolor= »#ffffff » bgcolor= » » ][epsilon_button type= »re » icon= » » text= »Button » link= »# » target= »_self » prestyle= »blue » size= » » tcolor= »#ffffff » bgcolor= » » ][epsilon_button type= »re » icon= » » text= »Button » link= »# » target= »_self » prestyle= »red » size= » » tcolor= »#ffffff » bgcolor= » » ][epsilon_button type= »re » icon= » » text= »Button » link= »# » target= »_self » prestyle= »dark » size= » » tcolor= »#ffffff » bgcolor= » » ][epsilon_button type= »re » icon= » » text= »Button » link= »# » target= »_self » prestyle= »yellow » size= » » tcolor= »#ffffff » bgcolor= » » ][epsilon_button type= »re » icon= » » text= »Button » link= »# » target= »_self » prestyle= »orange » size= » » tcolor= »#ffffff » bgcolor= » » ][epsilon_button type= »re » icon= » » text= »Button » link= »# » target= »_self » prestyle= »magenta » size= » » tcolor= »#ffffff » bgcolor= » » ][/epsilon_one_thirdt]
[epsilon_hr pad= »full-top » classes= »hide-if-responsive » ][epsilon_one_thirdt]Rounded Button Classes
Oldschool buttons that fit all needs.

[epsilon_button type= »ro » icon= » » text= »Button » link= »# » target= »_self » prestyle= »green » size= » » tcolor= »#ffffff » bgcolor= » » ][epsilon_button type= »ro » icon= » » text= »Button » link= »# » target= »_self » prestyle= »teal » size= » » tcolor= »#ffffff » bgcolor= » » ][epsilon_button type= »ro » icon= » » text= »Button » link= »# » target= »_self » prestyle= »blue » size= » » tcolor= »#ffffff » bgcolor= » » ][epsilon_button type= »ro » icon= » » text= »Button » link= »# » target= »_self » prestyle= »red » size= » » tcolor= »#ffffff » bgcolor= » » ][epsilon_button type= »ro » icon= » » text= »Button » link= »# » target= »_self » prestyle= »dark » size= » » tcolor= »#ffffff » bgcolor= » » ][epsilon_button type= »ro » icon= » » text= »Button » link= »# » target= »_self » prestyle= »yellow » size= » » tcolor= »#ffffff » bgcolor= » » ][epsilon_button type= »ro » icon= » » text= »Button » link= »# » target= »_self » prestyle= »orange » size= » » tcolor= »#ffffff » bgcolor= » » ][epsilon_button type= »ro » icon= » » text= »Button » link= »# » target= »_self » prestyle= »magenta » size= » » tcolor= »#ffffff » bgcolor= » » ]
[/epsilon_one_thirdt]
[epsilon_hr pad= »full-top » classes= »hide-if-responsive » ][epsilon_one_thirdt_last]3D Button Classes
Oldschool buttons that fit all needs.

[epsilon_button type= »3d » icon= » » text= »Button » link= »# » target= »_self » prestyle= »green » size= » » tcolor= »#ffffff » bgcolor= » » ][epsilon_button type= »3d » icon= » » text= »Button » link= »# » target= »_self » prestyle= »teal » size= » » tcolor= »#ffffff » bgcolor= » » ][epsilon_button type= »3d » icon= » » text= »Button » link= »# » target= »_self » prestyle= »blue » size= » » tcolor= »#ffffff » bgcolor= » » ][epsilon_button type= »3d » icon= » » text= »Button » link= »# » target= »_self » prestyle= »red » size= » » tcolor= »#ffffff » bgcolor= » » ][epsilon_button type= »3d » icon= » » text= »Button » link= »# » target= »_self » prestyle= »dark » size= » » tcolor= »#ffffff » bgcolor= » » ][epsilon_button type= »3d » icon= » » text= »Button » link= »# » target= »_self » prestyle= »yellow » size= » » tcolor= »#ffffff » bgcolor= » » ][epsilon_button type= »3d » icon= » » text= »Button » link= »# » target= »_self » prestyle= »orange » size= » » tcolor= »#ffffff » bgcolor= » » ][epsilon_button type= »3d » icon= » » text= »Button » link= »# » target= »_self » prestyle= »magenta » size= » » tcolor= »#ffffff » bgcolor= » » ]
[/epsilon_one_thirdt_last]

[/epsilon_container]

[epsilon_hr]

Icon Button Classes
Icon buttons are simple to use and they are powered by the huge 400 icon library that is Font Awesome. They are so easy to use you’ll fall in love with them in a heart beat!

[epsilon_button type= »re » icon= »fa-angle-right » text= »Button » link= »# » target= »_self » prestyle= »green » size= » » tcolor= »#ffffff » bgcolor= » » ][epsilon_button type= »re » icon= »fa-retweet » text= »Button » link= »# » target= »_self » prestyle= »teal » size= » » tcolor= »#ffffff » bgcolor= » » ][epsilon_button type= »re » icon= »fa-refresh fa-spin » text= »Button » link= »# » target= »_self » prestyle= »blue » size= » » tcolor= »#ffffff » bgcolor= » » ][epsilon_button type= »re » icon= »fa-angle-down » text= »Button » link= »# » target= »_self » prestyle= »red » size= » » tcolor= »#ffffff » bgcolor= » » ][epsilon_button type= »re » icon= »fa-circle » text= »Button » link= »# » target= »_self » prestyle= »dark » size= » » tcolor= »#ffffff » bgcolor= » » ][epsilon_button type= »re » icon= »fa-apple » text= »Button » link= »# » target= »_self » prestyle= »yellow » size= » » tcolor= »#ffffff » bgcolor= » » ][epsilon_button type= »re » icon= »fa-android » text= »Button » link= »# » target= »_self » prestyle= »orange » size= » » tcolor= »#ffffff » bgcolor= » » ]

[epsilon_hr]

[epsilon_container fullscreen= »no »]

[epsilon_one_halft]Social Sharing Buttons
Social sharing buttons can either be simple buttons, or you can use the ball icon approach.

[epsilon_sbutton layout= »social-button » type= »facebook » link= »# » ][epsilon_sbutton layout= »social-button » type= »twitter » link= »# » ][epsilon_sbutton layout= »social-button » type= »google » link= »# » ][epsilon_sbutton layout= »social-button » type= »pinterest » link= »# » ][epsilon_sbutton layout= »social-button » type= »dribbble » link= »# » ][epsilon_sbutton layout= »social-button » type= »tumblr » link= »# » ][epsilon_sbutton layout= »social-button » type= »reddit » link= »# » ][epsilon_sbutton layout= »social-button » type= »youtube » link= »# » ][epsilon_sbutton layout= »social-button » type= »linkedin » link= »# » ][epsilon_sbutton layout= »social-button » type= »whatsapp » link= »# » ][epsilon_sbutton layout= »social-button » type= »vk » link= »# » ][epsilon_sbutton layout= »social-button » type= »instagram » link= »# » ][epsilon_sbutton layout= »social-button » type= »phone » link= »# » ][epsilon_sbutton layout= »social-button » type= »sms » link= »# » ][epsilon_sbutton layout= »social-button » type= »mail » link= »# » ]
[/epsilon_one_halft]
[epsilon_one_halft_last]Rounded Sharing Icons
As an alternate solution, you can also use icons to share or show off your social networks.

[epsilon_sbutton layout= »social-ball » type= »facebook » link= »# » ][epsilon_sbutton layout= »social-ball » type= »twitter » link= »# » ][epsilon_sbutton layout= »social-ball » type= »google » link= »# » ][epsilon_sbutton layout= »social-ball » type= »pinterest » link= »# » ][epsilon_sbutton layout= »social-ball » type= »dribbble » link= »# » ][epsilon_sbutton layout= »social-ball » type= »tumblr » link= »# » ][epsilon_sbutton layout= »social-ball » type= »reddit » link= »# » ][epsilon_sbutton layout= »social-ball » type= »youtube » link= »# » ][epsilon_sbutton layout= »social-ball » type= »linkedin » link= »# » ][epsilon_sbutton layout= »social-ball » type= »whatsapp » link= »# » ][epsilon_sbutton layout= »social-ball » type= »vk » link= »# » ][epsilon_sbutton layout= »social-ball » type= »instagram » link= »# » ][epsilon_sbutton layout= »social-ball » type= »phone » link= »# » ][epsilon_sbutton layout= »social-ball » type= »sms » link= »# » ][epsilon_sbutton layout= »social-ball » type= »mail » link= »# » ][/epsilon_one_halft_last]

Square Social Icons
As an alternate solution, you can also use icons to share or show off your social networks.

[epsilon_sbutton layout= »social-square » type= »facebook » link= »# » ][epsilon_sbutton layout= »social-square » type= »twitter » link= »# » ][epsilon_sbutton layout= »social-square » type= »google » link= »# » ][epsilon_sbutton layout= »social-square » type= »pinterest » link= »# » ][epsilon_sbutton layout= »social-square » type= »dribbble » link= »# » ][epsilon_sbutton layout= »social-square » type= »tumblr » link= »# » ][epsilon_sbutton layout= »social-square » type= »reddit » link= »# » ][epsilon_sbutton layout= »social-square » type= »youtube » link= »# » ][epsilon_sbutton layout= »social-square » type= »linkedin » link= »# » ][epsilon_sbutton layout= »social-square » type= »whatsapp » link= »# » ][epsilon_sbutton layout= »social-square » type= »vk » link= »# » ][epsilon_sbutton layout= »social-square » type= »instagram » link= »# » ][epsilon_sbutton layout= »social-square » type= »phone » link= »# » ][epsilon_sbutton layout= »social-square » type= »sms » link= »# » ][epsilon_sbutton layout= »social-square » type= »mail » link= »# » ]

Button size variations
We’ve included the most used and most important sizes of buttons you can use by simply adding a class to any button template included.

[epsilon_button type= »re » icon= » » text= »Button XL » link= »# » target= »_self » prestyle= »green » size= »xl » tcolor= »#ffffff » bgcolor= » » ][epsilon_button type= »re » icon= » » text= »Button L » link= »# » target= »_self » prestyle= »green » size= »l » tcolor= »#ffffff » bgcolor= » » ][epsilon_button type= »re » icon= » » text= »Standard » link= »# » target= »_self » prestyle= »green » size= » » tcolor= »#ffffff » bgcolor= » » ][epsilon_button type= »re » icon= » » text= »Button S » link= »# » target= »_self » prestyle= »green » size= »s » tcolor= »#ffffff » bgcolor= » » ][epsilon_button type= »re » icon= » » text= »Button XS » link= »# » target= »_self » prestyle= »green » size= »xs » tcolor= »#ffffff » bgcolor= » » ]

[/epsilon_container]

[epsilon_heading2 title= »This or That » stitle= »Give choices! We all love em! » tcolor= » » tcolor2= » » full_width= »1″ url= »http://mobile.webbudesign.com/circlemobile/wp-content/uploads/sites/14/2016/10/6.jpg » ocolor= »1″ ]

Double button choice
When you have dual options, like plans or prices. A simple way to diferentiate these between one another.

[epsilon_dbutton type= »ro » size= » » dstyle= »or-buttons-style-1″ mword= »or » icon= » » text= »Get Pro » link= »# » target= »_self » prestyle= »blue » tcolor= » » bgcolor= » » icon2= » » text2= »Get Basic » link2= »# » target2= »_self » prestyle2= »red » tcolor2= » » bgcolor2= » » ][epsilon_space size= »10″ ]

[epsilon_hr]

The classic line breaker
Great to add between sections, simple to use. It’s just a copy and paste away!

[epsilon_hr2 word= »or » ][epsilon_space size= »10″ ]

[epsilon_hr]

The double liner
When your options need to attract a bit more attention, you can use a line breaker. Two buttons that center up and do their jobs by attracting the attention required.

[epsilon_dbutton type= »ro » size= » » dstyle= »or-buttons-style-2″ mword= »or » icon= » » text= »Get Pro – $ 25.00″ link= »# » target= »_self » prestyle= »blue » tcolor= » » bgcolor= » » icon2= » » text2= »Get Basic – $ 10.00″ link2= »# » target2= »_self » prestyle2= »red » tcolor2= » » bgcolor2= » » ][epsilon_space size= »10″ ]

 

Envoi
User Review
0 (0 votes)