Enable Divi Builder For Custom Post Type

Here I will be showing How to Enable the Divi 3.0 Builder for the Custom Post Type

How to Add Divi Builder for Custom Post Type

First of all, Divi builder is one of the most popular visual page builder for the WordPress. Recently Divi 3.0 was released with great features like Add New content with Divi 40+ Modules, Easily Customize Everything,Inline Editing and fast page building and much more.

Don’t want to make bored here by going describing all details of Divi Builder.

Here I have Created the Custom Post Type using Pods plugin and even you can write your own code in your theme functions.php or another method that you are following.

Here it looks like before enabling the DIVI builder

Before the start, please make sure you have your own child theme. If you don’t have a child theme and you write all code to Theme itself (Parent Theme) then as you update the theme all your edits will be gone. So Please create your child theme first.

STEP 1 : Add Divi Builder and Divi Meta box to Custom post type.

In your Divi theme or Divi Child theme open the functions.php file and in bottom add the below code. Which will add the Divi Builder and Divi Meta Box to the Custom Post Type.

In Above code, you can see I have added the Custom Post Type Slug “news” to add Divi Builder. Similar way you can add another Custom Post Type as needed.

From Line number 23 to 49, Shows how to add the Divi Meta box to your Custom Post Type.

STEP 2 : Add Custom CSS for template

Add the below CSS code In Divi -> Theme Options -> Custom CSS for front-end template.

.et_pb_pagebuilder_layout.single-POST_TYPE #page-container .et_pb_row {
width: 100%;
}
.et_pb_pagebuilder_layout.single-POST_TYPE #page-container .et_pb_with_background .et_pb_row {
width: 80%;
}

Replace “POST_TYPE” with the slug for your new custom post type ( CPT ).

After Enable Divi Builder It looks like below image