Override the Divi blog module

Copy this file: Divi/includes/builder/module/Blog.php
to (after the creation of the folder /module/) :
Divi-Child-Theme/module/Blog.php

At the top of the new Blog.php replace this code:

require_once 'helpers/Overlay.php';
class ET_Builder_Module_Blog extends ET_Builder_Module_Type_PostBased {

with this:

get_template_part( '/includes/builder/module/helpers/Overlay.php' );
class AWK_ET_Builder_Module_Blog extends ET_Builder_Module_Type_PostBased {

Then change (around line 15) :

$this->vb_support = 'on'; with $this->vb_support = 'off';

Then remove the last line :

new ET_Builder_Module_Blog();

Finally add the code below to functions.php

// Override the divi blog module
function blog_module_setup() {
    get_template_part( 'module/Blog' ); 
    remove_shortcode( 'et_pb_blog' ); 
    add_shortcode( 'et_pb_blog', array( new AWK_ET_Builder_Module_Blog(), '_shortcode_callback' ) ); 
}
add_action( 'et_builder_ready', 'blog_module_setup' );

Now you are ready to change the code on new Blog.php and see the changes on front end.

A very common addition is to insert Advanced Custom Fields – ACF inside the blog module.
In order to add an ACF, find this line (around 1586 line) inside Blog.php:

echo '<div class="post-content">';

and add the ACF:

the_field('my_field_name');

Another approach is this here:

How to customize the PHP code of any Divi Module
https://github.com/eduard-ungureanu/Divi-tuts/wiki/How-to-customize-the-PHP-code-of-any-Divi-Module

And here:

Moving Blog module in Child theme
https://intercom.help/elegantthemes/en/articles/4532734-moving-blog-module-in-child-theme
with a useful tutorial how to add custom fields inside Blog module:


Customizing Divi Blog module to add Custom Fields
https://intercom.help/elegantthemes/en/articles/4532813-customizing-divi-blog-module-to-add-custom-fields

Scroll to Top