How to import/export a Divi layout?

Import/export a Divi layout? Nothing simpler with the import/export functionality made available by the theme Divi and the Divi Builder. It's probably the one I like best!

The possibility of importing or exporting a layout – a layout – Will save you some crazy time. And if you don't use it yet, you should read this article carefully because this function will change your way of using Divi!

If you wish Import/export theme templates, this way! This feature is available from Divi 4.0.

Here is the program:

1. Why import/export a Divi layout?
2. How to import a premade layout available in the Divi Builder?
3. How to import a premade layout via the Visual Builder?
4. How to export a Divi layout?
5. How to import an external layout to its site?
6. How to save a Divi layout in the library?
7. What if you get the message "this file should not be imported in this context"?
8. Conclusion...

1 – Why import-export a Divi layout?

The import/export functionality Divi allows you to save a lot of time.

If you regularly create websites, you are certainly looking for productivity...

The idea is power create a layout and reuse it later, whether in the same site or in another.

We're talking about a layout (a layout – a canvas), not a design, that means you can import and export the succession of Divi modules present in your page then change images and texts.

This is different from import/export theme templates proposed by Divi 4.0.x.

I think the biggest advantage import-export a Divi layout resident in its simplicity of use but especially in the idea that user, even without any WebDesign knowledge, will quickly get a "magnificent" and consistent site.

Want to move to higher speed? Get the Divi theme now!

2 - How to import a premade layout available in the Divi Builder?

We had already talked about these "premade layout" you find in the Divi Builder during a last article...

In short, it is layouts designed by developers/designers of ElegantThemes and are at your disposal – completely free – via the Divi Builder.

As I write these lines, there is 139 packs offering 1029 layouts to download and the range grows every week!!!

Important note: to be able to use these layouts, you must use a theme Divi "not cracked" (read this article to know how much the Divi theme costs) and you must not forget enter your license key ( API key) to Update tab.

Also read: how to update its Divi theme?

Now let's see how import-export works...

1. When you are in a page, activate the Divi Builder then click "Download Model".
2. Choose tab "Premade Layout".
3. View the various Layout packs and select the one that suits your project.
4. Each pack consists of several layouts. Generally, you can import a different layout per page (one for home, one for blog, one for contact page etc...). Select the layout to import to your page.
5. You can view it in its entirety on the left side of the window.
6. If it suits you, you will only need to click on "Use this layout".

Wait a moment, save your draft (or publish your page) and then check the result. Finally, you will only have to Edit each module to change your texts, images, typos, colors etc...

Here is the video procedure:

3 – How to import a premade layout via the Visual Builder?

Divi users are often shared, some prefer to use the Divi Builder (backend) and others prefer to use Visual Builder (front-end).

Even if Since version 5.x of WordPress, Visual Builder is predominant…

Here are two more videos to show you how to import a pre-made layoutBut this time, via the visual builder of Divi :

In this first version, you enable the visual builder and you choose the option "choose a premade layout" (the middle one).

In this case it's easy, the layout screen appears and you only have to make your choice.

However, if for one reason or another, you did not choose the option to import a layout from the beginning, you can still do it thanks to the icons located at the bottom of the screen as you could see in the video above.

By clicking on the "+" icon, you will access the layout import window.

4 - How to export a Divi layout?

In some cases, you may need export a layout that you would have conceived, that it be to keep it or to use at another site…

With the Divi Builder, it is also possible and it is as simple as importing.

Here's how:

1. See you in the page whose layout must be exported. At the top of the Divi generator, you will click on the discreet icon with a double arrow,
2. A popup opens. Enter the name of your layout to export. For example « contact page »,
3. Click « Export Builder Layout Divi »,
4. Wait during export,
5. Save this layout to your computer. For the record, the exported layouts are in .JSON format

Here is the video version:

5 - How to import an external layout to its site?

If you have exported a layout - as described in previous subsection (4) - and that you wish import to another site made with Divi, the operation will be very simple...

There is also another case where you could import an external layout to your site: if you have downloaded free layouts offered by specialized sites.

My Resources for Divi is precisely made to give you good plans about it, do not hesitate to consult it from time to time to see if I have not added links to free resources for Divi to download...

1. See you in the page where you want to import the layout. At the top of the Divi generator, you will click on the discreet icon with a double arrow,
2. A popup opens. Select tab Import,
3. Click "Choose a file",
4. A window opens to choose the layout to import. This must be present in your computer and must be imported in a .JSON format (not zipped, i.e. decompressed).
5. Note: an option allows you to save the current layout because import of a layout replaces your current content with the imported one.
6. Click « Import Construction layout Divi » to launch import
7. Wait until the end of the import.

At this point, your page has loaded the various modules that make up the imported layout. You only need to modify your texts, images, colors etc...

Here is the video import procedure:

6 - How to save a Divi layout in the library?

All layouts that you save or import will be stored in the Divi library (available at Divi tab > Divi library).

Backing up a layout can have a definite advantage: you can save a layout before making many changes on one of your pages. This way, you can quickly return to a previous layout with just one click.

To save a layout in your library, here's how:

1. Go to the page that contains the layout to save and click "Save in Library"
2. Name your layout
3. Click "Save"
4. In Divi tab > Divi library
5. You will find all your saved layouts

Here is the video backup procedure:

7 - What if you get the message "this file should not be imported in this context"?

When you want to import a layout external to your site Divi, it is possible that you would encounter an error message "This file should not be imported in this context".

If this is your case, don't panic, there's another solution: import the layout from the library rather than from the manufacturer Divi of the page in question…

Here's what you need to do:

1. Go to the tab Bibliothèque Divi
2. Top, select Import & Export
3. In the popup that opens, choose the tab Import
4. Choose your layout that is available on your computer (in .JSON format)
5. Validate by clicking "Import Divi Builder Layouts"
6. Then you can go back to the page where you want to import the layout
7. Click download the model > your saved layouts

8- Conclusion...

If you didn't know this feature, or at least, if you hadn't taken the time to exploit it yet, I guess you've understood its added value...

Importing and exporting a Divi layout will save you a lot of time!

There is still a lot to be said about this, particularly the fact that we can do the same kind of import/export with Divi modulesthen imagine the power of these uses!

Discover all you can do with the theme Divi