Article du fil d'actualités de CreaWeb2B

N'hésitez pas à commenter et partager

DIVI Module inside module v2

by | DIVI, Plugins, Tutorials, WORDPRESS

In a previous tutorial, i explained how to add a DIVI “section” or “module” inside another module.

Some code had to be added to functions.php file and when you fear/don’t know how to code in php, it can sound hard.

So i made a little plugin to help those who don’t want to touch php code, the plugin is nammed Simple Divi Shortcode and more details can be found inside the plugins section. In the last version, a column showing the shortcode and a clic to copy function were added.

You can download it for free on wordpress repository : Simple Divi Shortcode.

Last version of this tool will display a Shortcode for each existing (or future) item inside the DIVI library, not only on the DIVI library listing page, but also inside a metabox on the building page of the library item :

All you have to do is to copy the shortcode displayed and paste it where you want to use the given element.

Now you can insert any template from DIVI library inside the content field of a DIVI module (like a map or a contact form inside a tab module or an accordion…)

The following tab module was built inside DIVI library, so to call it i just use a showmodule statment with my tab module id

Hi all, here you see that you can insert existing modules inside a tab module. Possibilities are numerous. There are also limitations, accordion in accordion doesn't work, and global modules may not work properly. But it's a great tool to achieve some new kind of designs.

Fabrice ESQUIROL

Freelance, Creaweb2b

The following screen capture shows the content of this post, where the showmodule corresponding to my tab module appears :

Now let’s see how to build such a tab module. Here we have a map in first tab, and a testimonial in second tab.

A map module and a testimonial module have been built inside the DIVI library.

Once you know what you want to add inside each tab, let’s create a tab module :

Add a new tab

Inside the content field, just add the shortcode by using copy/paste (here for the map) :

Next just save and add the testimonial shortcode inside the second tab.

Once our two tabs created, our tab module looks like that :

Remember that i used a DIVI library shortcode for my tab module, so i’ll grab his shortcode to insert it in this post.

I can find the shortcode inside the SHORTCODE metabox shown inside the builder (lower right of the builder screen), or inside the DIVI Library template listing page.

Hope you’ll find this tool useful, i’ll answer any question if i can help.

If you want to support me, you can buy me a coffee 🙂