Custom buttons in Divi with the button module

This post came before the Divi builder had extensive options for customizing your buttons or a Divi button module. Now Divi makes it easy to create any type of button within your Divi site so take a look at the video below and learn how you can use and customize the Divi button module.

Before the Divi builder button modules we had to customize like this!

/*Divi ghost buttons with 1px stroke*/

Get a clean and light button style with a 1px border for your Divi buttons. Add the code to your Divi theme options custom CSS or into your child theme. To target specific buttons then add a css class to that button and target the class by modifying the code below.

.et_pb_bg_layout_light .et_pb_promo_button, .et_pb_bg_layout_light .et_pb_more_button, .et_pb_bg_layout_light .et_pb_newsletter_button, .et_pb_pricing_table_button {
background-color: rgba(255, 255, 255, 0) !important;
color: #82c0c7;
border-color: #82c0c7;}

.et_pb_promo_button, .et_pb_newsletter_button, a.et_pb_more_button, .et_pb_pricing_table_button {
background-color: rgba(0, 0, 0, 0);
border: solid 2px;}

Elegant Themes' Black Friday/Cyber Monday sale is still on if you want 25% discount! Dismiss

Pin It on Pinterest

By continuing to use the site, you agree to the use of cookies. more information

The cookie settings on this website are set to "allow cookies" to give you the best browsing experience possible. If you continue to use this website without changing your cookie settings or you click "Accept" below then you are consenting to this.

Close