Download our Image Fill Text Module layout pack for Divi.

It is FREEBIE FRIDAY and for this edition, we have 2 Text Modules that have been filled with an image to create a unique effect that you are going to love. Best of all, they are easy to customize to fit your brand or site and can be used with any Divi install.

Preview:

We are coming at ya with 2 styles:

Style 1: Animated Image

The first style is using a gradient background image we generated using https://meshgradient.com/, definitely check it out!

Style 2: Static Image

For the second style, we tossed the animation and just added a cool code background to set your imagination on fire.

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 2 Column Row with a Text Module and its Code Module that contains the CSS in each column.

Step 2) Copy the Text 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 2 Columns with a Text Fill Style in each. If you want to use Text Fill Style 1, copy the Text and the CSS Code Module and go paste it on the page where you want to use it.

Step 3) Customize the Image

When you have the Text and the Code Module on the page you want, you can easily customize the image by opening the Code Module and editing the line with the comment that says “Change background image here” and replacing the image URL with the new image URL.