All Collections
Divi Documentation
Customizing Divi
Moving Portfolio Module To Child Theme
Moving Portfolio Module To Child Theme
You'll learn how to move the default Divi Portfolio Module to your child theme to customize it later
Karen avatar
Written by Karen
Updated over a week ago

These changes require a Divi child theme. Please check the following article if you have not set a child theme yet: https://intercom.help/elegantthemes/faq-s-and-troubleshooting/how-to-make-a-child-theme

  1. In the child theme folder create a new folder, for example   includes   folder.

  2. Now copy the  Divi/includes/builder/module/Portfolio.php   file into the  child-theme/includes/   folder.

  3. Rename the file to something else, for example:  custom-Portfolio.php   

  4.  Open up the  custom-Portfolio.php  file and replace this code (the first line):

class ET_Builder_Module_Portfolio extends ET_Builder_Module_Type_PostBased {


with:

class custom_ET_Builder_Module_Portfolio extends ET_Builder_Module_Type_PostBased {


Also, replace this line:

$this->vb_support = 'on';


with:

$this->vb_support = 'off';


6. Next, open up functions.php file in your child theme folder and add the following code at the very bottom:

function custom_portfolio_setup() {
get_template_part( 'includes/custom-Portfolio' );
$custom_portfolio = new custom_ET_Builder_Module_Portfolio();
remove_shortcode( 'et_pb_portfolio' );
add_shortcode( 'et_pb_portfolio', array( $custom_portfolio, '_render' ) );
}
add_action( 'et_builder_ready', 'custom_portfolio_setup' );

function divi_custom_portfolio_class( $classlist ) {
$classlist['et_pb_portfolio']['classname'] = 'custom_ET_Builder_Module_Portfolio';
return $classlist;
}
add_filter( 'et_module_classes', 'divi_custom_portfolio_class' );


Now you are ready to customize the Portfolio module the way you need and keep the changes while updating/reinstalling the parent Divi theme.

Did this answer your question?