• Skip to primary navigation
  • Skip to main content
  • Skip to footer

Hastimal Shah

Wordpress Developer & Consultant

  • Facebook
  • GitHub
  • Google+
  • LinkedIn
  • Twitter
  • Home
  • About
  • Contact

Enable Divi Builder For Custom Post Type

November 8, 2016 by Hastimal Shah 3 Comments

Divi Builder 3.0

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 Enable Builder For Custom Post Type

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

After Enable Builder For Custom Post Type

Filed Under: DIVI Tagged With: Custom Post Type, DIVI 3.0, Divi Meta Box, Page Builder

Reader Interactions

Comments

  1. Ostii says

    September 30, 2017 at 7:11 am

    This code in step 1 did not work for me. I tried pasting it into my child theme and go the error:

    Fatal error: Cannot redeclare hs_et_builder_post_types() (previously declared in /home/permac56/staging/12/wp-content/themes/retro-suburbia/functions.php:248) in /home/permac56/staging/12/wp-content/themes/retro-suburbia/functions.php on line 262

    I am not sure why the hs_ part is there and what to replace it with.

    Reply
    • Hastimal Shah says

      November 3, 2017 at 10:47 am

      have you define twice the functions mentioned in this articles., that’s why it’s showing you cannot re-declare.

      Reply
  2. shahrukh kham says

    December 26, 2019 at 8:27 pm

    i got the divi option but but i am unable to create post for that cpt. the divi option show is not clickable.

    Reply

Leave a Reply Cancel reply

Your email address will not be published. Required fields are marked *

Footer

Subscribe & Get Blog Updates via Email

Enter your email address to subscribe & get notifications of new tutorials by Email.

Recent Posts

  • Enable Divi Builder For Custom Post Type
  • What is Accelerated Mobile Page?
  • Genesis Framework Custom Search Template With Custom Post Type
  • Dreams come true of Writing / Sharing my knowledge

Pages

  • Request for Tutorials
  • Contact
  • About

© Copyright 2016 Genesis Sample Theme on Genesis Framework