FREE Divi Button Modules with unique Hover Effects

Download our Button Module layout pack for Divi.

It is FREEBIE FRIDAY and for this edition, we have some Divi Button Modules with unique Hover Effects effects which we know will help set your site apart. Best of all, they are easy to customize to fit your brand or site and can be used with any Divi install.

Preview:

Button Style 1
Button Style 2
Button Style 3

This Friday we have 3 styles for you:

Style 1: Expand from the center

The first style uses an eye-catching style that expands form the middle leaving 2 corners exposed.

Style 2: Expand from the left

For the second style, the background color pushes in from the left on hover.

Style 3: Expand from the top

For our last style, the background color pushes in from the top on hover.

Using the Custom Text Modules:

Step 1) Import the layout pack into the Divi Library

Similar to importing any layout pack we release, Import the JSON file directly into the Divi Library. Once it is imported you will see that the layout is a 3 Column Row with a Text Module which makes our button and its Code Module that contains the CSS in each column.

Step 2) Copy the Button style you want to use

This is super easy. Open the layout in the Divi Library. This will launch the Divi Builder and you will see our 3 Columns with a Button Style in each. If you want to use Button Style 1, copy the Text and the CSS Code Module and go paste it on the page where you want to use it.

NOTE: Alternatively, you could also just import the layout as a Row right on the page where you want the Buttons and just delete the styles you don’t want.

Step 3) Customize the Button Colors

When you have the Text and the Code Module on the page you want, you can easily customize the colors by opening the Code Module and editing the lines with the comments that mention you can change the color there.

Step 4) Customize the Button Link

All you need to do is open the Text Module and click on the Link section under Content, then change the URL to any page you want to link to.

If you loved this FREE Divi Button Modules with unique Hover Effects Layout Pack, you’ll love our other freebies. Click the link below to see other helpful tools to help you grow both your skills and business.

0 Comments

Submit a Comment

Explore more from Divi Engine

SPIN TO WIN

UPGRADE YOUR DISCOUNT!

  • Get ready to spin and win as we celebrate the Easter Holiday!
  • 1 spin per email
  • No cheating
Try Your Luck
Never
Remind later
No thanks