Why Your Custom Template Won't Let You Use Divi Builder
You've painstakingly crafted a custom template for your WordPress website, only to discover that the Divi Builder feature you love is missing. Frustrating, right? This is a common issue, but one that can be easily resolved with a few simple steps.
Scenario:
Imagine you're creating a unique landing page for your product launch. You decide to create a custom template for this specific page, allowing for complete design freedom. However, when you try to use the Divi Builder within this custom template, you find it's not available.
Original Code (Custom Template):
<?php
/**
* Template Name: My Custom Landing Page
*/
get_header(); ?>
<div id="primary" class="content-area">
<main id="main" class="site-main">
<!-- Content goes here -->
</main>
</div>
<?php get_footer(); ?>
The Problem Explained:
The Divi Builder relies on specific WordPress hooks and functionalities to integrate seamlessly. When you create a custom template, it bypasses some of these default hooks, resulting in the Divi Builder being unavailable.
Solution:
The solution is to manually include the necessary hooks within your custom template code. This will allow the Divi Builder to function correctly.
Here's what you need to do:
-
Include the Divi Builder hook:
<?php echo et_get_builder_content(); ?>Place this code snippet within the
<main>section of your custom template. -
Wrap your content with the Divi Builder container:
<div id="et-boc" class="et-boc"> <?php echo et_get_builder_content(); ?> </div>This ensures the Divi Builder's content is appropriately displayed within your custom template.
Additional Tips:
- Use the Divi Builder "Use Existing Content" Option: If you've already created content using the Divi Builder within your custom template, you can use this option to easily migrate it into the appropriate structure.
- Ensure Proper File Naming: While not directly related to the Divi Builder, make sure your custom template filename ends in
.phpto avoid conflicts.
Conclusion:
By incorporating these simple code adjustments, you can easily enable Divi Builder functionality within your custom templates. This allows you to leverage the powerful features of the Divi Builder while maintaining the unique design aesthetic of your custom template.
Remember: Always back up your site before making any changes to your theme files.
Resources:
- Divi Theme Documentation: https://www.elegantthemes.com/blog/resources/divi-theme-documentation/
- Divi Support Forum: https://www.elegantthemes.com/forum/
By following these guidelines, you can ensure that your custom templates are fully compatible with the Divi Builder, allowing you to create stunning and unique pages for your website.
