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 and FTP/File manager experience. 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 the functions.php file in your child theme folder and add the following code at the very bottom:

/*================================================ 
#Load custom Portfolio Module
================================================*/

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.

Note: After moving the Portfolio module in the Child theme, Divi Visual Builder will assume the Portfolio module as a 3rd party module, therefore, it will show as a Grey box in Visual Builder. But it should work fine with its settings front-end.

Did this answer your question?