How to Change Button Color in Divi Builder: 3 Easy Methods

If you’re using Divi Builder and want to customize the button color in your Gallery Module, you’ve come to the right place! Whether you’re a beginner or an advanced user, I’ll walk you through three simple methods to change the button color. Let’s dive in!

Method 1: Change Button Color Using Divi Builder’s Built-in Settings

This is the easiest way to customize your button color using Divi’s built-in options.

1. Open the Gallery Module
   • Edit the page using Divi Builder.
   • Click on the Gallery Module where you want to change the button color.
2. Go to the Design Tab
   • In the Gallery settings, click on the Design tab.
3. Customize the Button
   • Scroll down to find Button Styles.
   • Enable Use Custom Styles for Button.
   • Change the Button Background Color, Text Color, and other styles as needed.
4. Save and Update
   • Click the checkmark ✅ to save your changes.
   • Update the page to apply the new button color.

That’s it! Your button color is now updated.

Method 2: Change Button Color Using Custom CSS (Advanced)

If the built-in settings don’t give you enough flexibility, you can use custom CSS to style the button manually.

1. Go to Divi Theme Options
   • Navigate to Divi → Theme Options → Custom CSS.
2. Add This CSS CodecssCopy.et_pb_gallery .et_pb_gallery_item .et_pb_more_button { background-color: #ff6600 !important; /* Change to your desired color */ color: #ffffff !important; /* Change text color */ }
   • Replace #ff6600 with your preferred button color.
   • Replace #ffffff with the text color you want.
3. Save Changes
   • Click Save Changes, then refresh your page to see the new button color.

This method gives you full control over the button’s appearance.

Method 3: Change Button Color Using Additional CSS in Page Settings

If you want to apply the button color to only one specific page, follow these steps:

1. Edit the Page with Divi Builder
   • Open the page where you want to change the button color.
2. Click the Three Dots Menu (Bottom Settings)
   • Go to Page Settings → Advanced → Custom CSS.
3. Paste This CodecssCopy.et_pb_gallery .et_pb_gallery_item .et_pb_more_button { background-color: #0073e6 !important; /* Change color */ }
   • Replace #0073e6 with your desired button color.
4. Save and Update the Page
   • Save your changes and update the page to see the updated button color.

This method is perfect for making page-specific customizations without affecting other pages.

Final Tips

• Clear Cache: If you’re using caching plugins or a CDN, make sure to clear the cache after making changes.
• Test on Mobile: Always check how the button looks on mobile devices to ensure it displays correctly.

And there you have it! Three easy ways to change the button color in Divi Builder. If you need further adjustments or have any questions, feel free to ask.