Divi Blog Layout

Divi Blog Layout

Build your Divi Website easily with one of our premium Divi Blog Module design

Total 84 Blog Layout (More Blog Layout Coming Soon)

Blog Grid Layout

3 Column Blog Layout

2 Column Blog Layout

Blog List Image Left Layout

Blog List Image Right Layout

Fullwidth Blog Layout

Details:

Blog 84 – Divi Blog Module Bundle contains, 82 pre-designed modern and responsive Divi Blog Module with an eye-catching design.

Features & Benefits:

• 84 Divi Blog Module
• Clean and modern design
• Nice hover effects
• Fully responsive
• Quick and easy setup
• Ready to use

If you are satisfied with the product, please take a moment to submit a product review. Thank you! ????

How to Import Divi Testimonial Style?

Step 1

After buy you can found a zip file so please unzip that file and you can see all styles json file.

Step 2

Go to Dashboard –>  Divi  –>  Divi Library –>  Click On “Import & Export” Button

Step 3

After click on button, you will see below and select “Import” Tab

Have added “Blog Layout V01 to V10.json” File and “Blog Layout 01.json” File.
You can add here Individual JSON file like “Blog Layout 01.json”

Step 4

After  “Import”  you can see “Blog Layout V01 to V10.json” Data and Individual JSON file like “Blog Layout 01.json” Data

Important Step

How can I edit blog styles?

Each section contain 2 row (Title + Blog Style X). Blog style row includes 1 Divi Blog module and 1 Divi Code module.

– You can change Blog module settings

– You can change Blog module custom css settings

– You can change custom css in Code module (This module contain the hover effect code, read more button code, etc.)

How to turn off the Ken Burns Hover Effect?

Delete this code from the Code module:

.blog-style-x .et_pb_post .entry-featured-image-url {

overflow: hidden;

}

.blog-style-x .et_pb_post .entry-featured-image-url img:hover{

transition: transform 2000ms ease 0ms,transform 2000ms ease 0ms,transform 2000ms ease 0ms;

transform: scaleX(1.36) scaleY(1.36) translateX(9%) translateY(3%) rotateX(0deg) rotateY(0deg) rotateZ(6deg)!important;}

.blog-style-x .et_pb_post:hover .entry-featured-image-url img{

transition: transform 2000ms ease 0ms,transform 2000ms ease 0ms,transform 2000ms ease 0ms;

transform: scaleX(1.36) scaleY(1.36) translateX(9%) translateY(3%) rotateX(0deg) rotateY(0deg) rotateZ(6deg)!important;}

Important:

The Divi Blog Module Bundle doesn’t contain demo blog posts. Please use your own blog posts!

Tutorial:

https://www.elegantthemes.com/documentation/divi/library-import/ (Read this section: Importing Individual Divi Layouts)

By Divi Pot