Divi Builder Plugin and OceanWP library integration

Apr 6, 2018Blog, Tutorials, Web design, WordPress

This write-down will help you understand how to connect the Divi Builder Plugin to OceanWP library and use it on your website if you need it for some reason like I was. Page Builder Everywhere plugin is not working well with OceanWP singular.php template on posts natively, I was looking for a solution and I found a simple way to do this clearly.

OceanWP > My Library

When you open OceanWP > My Library you can see it’s managed by CPT (Custom Post Type).
/wp-admin/edit.php?post_type=oceanwp_library

Add the Divi Builder AND Divi Library to ANY CPT

Sean Barton published last year very useful code snippet that allows Divi Builder to works on any CPT. Just copy to your functions.php file and it’s done.

//----- Add the Divi Builder AND Divi Library to ANY CPT
function sb_et_builder_post_types( $post_types ) {
    $post_types[] = 'oceanwp_library';
    return $post_types;
}
add_filter( 'et_builder_post_types', 'sb_et_builder_post_types' );
add_filter( 'et_pb_show_all_layouts_built_for_post_type', 'sb_et_pb_show_all_layouts_built_for_post_type' );
function sb_et_pb_show_all_layouts_built_for_post_type() {
    return 'page';
}

source: https://www.sean-barton.co.uk/2017/05/how-to-add-the-divi-builder-and-divi-library-to-any-cpt/

OceanWP > My Library > Donate

For this post as a example I create Library Template “Donate”. I allready have a page Donate created before with Divi Builder and saved to Divi Library. When I was creating OceanWP “Donate” I just use Divi Builder and I click Load from Divi library. See the screenshot bellow.
/?oceanwp_library=donate

Insert Pages

This plugin gives you a possibility to include pages, CPT anywhere on your site through the use of shortcodes.

Insert Pages

Output to singular.php

Now we can output shortcode to singular.php like obviously somewhere near the comments section. That’s all.

<?php if ( is_singular( 'post' ) ) {
     echo do_shortcode('[insert page="donate" display="content"]');
     } ?>

Final words:

This is a example how to connect Divi Builder Plugin to OceanWP Library and get this to work. This technique is generally applicable to other builders and CPT when you need it.

David

Graphic and website designer, currently maintaining web servers for existing clients and building websites for new clients. In my free time, I learn about Linux, SSH, and WP-CLI and I’m preparing this blog.

Related Posts

25+ Free Fonts for Your Next Design Project

25+ Free Fonts for Your Next Design Project

Looking for some fresh and creative fonts to spice up your design projects in 2023? You’re in luck! In this blog post, we’ve curated a list of 25 free fonts that you can download and use right away. These fonts are suitable for various purposes such as logos,...

Adobe Photoshop Shortcuts – Infographic

Adobe Photoshop Shortcuts – Infographic

Thanks to Amanda from the Consumer Base that she sent us an ultimate Adobe Photoshop shortcuts cheat sheet. If you are a beginner or want to brush up your knowledge on Adobe Photoshop shortcuts then you are at the right place. Have look at it and let us your thoughts...

20 WordPress Tutorial channels on Youtube

20 WordPress Tutorial channels on Youtube

This post will introduce you a useful list of the 20+ best currently active WordPress tutorial related channels on Youtube. These channels are mostly focused on Tutorials and Guides for Developers and Designers that want to learn all about WordPress. Check them out...

12 AI Tools for Graphic and Website Designers

12 AI Tools for Graphic and Website Designers

Artificial intelligence (AI) is transforming the way designers work, from ideation to execution. AI tools can help designers automate tedious tasks, generate new content, and enhance their creativity. In this blog post, I will introduce AI tools that you can use to...

How to Pair Fonts – Tips and Tools for Perfect Font Combinations

How to Pair Fonts – Tips and Tools for Perfect Font Combinations

Font pairing is the art of choosing two or more fonts that work well together and create a harmonious design. Font pairing can make or break your website, logo, poster, or any other project that involves typography. But how do you pair fonts like a pro? In this...

The Ultimate Guide to Color Palettes

The Ultimate Guide to Color Palettes

Color palettes are collections of colors that work well together and create a harmonious visual effect. They are essential for any design and art project, as they help to convey the mood, message, and style of your work. But how do you choose the right color palette...

Show/Hide Comments (0 comments)
L

0 Comments

Submit a Comment

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

This site uses Akismet to reduce spam. Learn how your comment data is processed.

Social followers

Articles

Visits

Pin It on Pinterest

Shares