Divi LayoutsGeneral Directions:

To use a layout pack you’ll need to first download its zipped file by clicking the download button

on the webpage indicated in the left column of the table below.

Then, locate it in your downloads folder and unzip it.

Next, navigate in your WordPress admin to Divi > Divi Library and click the “Import & Export”

button at the top of the page.

When the portability modal pops up, select the import tab. Then, click the “choose file” button

and go back to the folder you unzipped in your downloads folder. You can select the All.json file

to import all of the layouts at once, or choose any of the individual layouts to import them one

at a time.

After your selection is made click the blue “Import Divi Builder Layouts” button and wait for the

upload to complete. Once completed, you will now find new page layouts available to you in

your Divi Library.

Importing & Exporting Tutorial Link: http://www.elegantthemes.com/gallery/divi/documentation/library-import/

Divi Layout Packs

Name/Filename/Description & Webpage

Visual Description

Homepage Layout Pack

Filename:(Original Filename: divi-100-pack-1.zip)

Renamed to:Divi-100-pack-homepage-layout-pack-1.zip

http://www.elegantthemes.com/blog/divi-resources/download-our-free-divi-layout-pack-for-modern-homepages-and-single-page-websites

1. Enterprise Business- Clients, features,

video, testimonials2. Design Agencies

-3. Local/Lifestyle Business

Photo Gallery Layout Pack

Filename:(Original filename from ET website: divi-100-pack-3.zip)

Renamed to:divi-100-photo-gallery-layout-pack-3.zip

http://www.elegantthemes.com/blog/divi-resources/free-divi-photo-gallery-layout-pack-5-stunning-gallery-page-layouts-in-one-convenient-download

1. 2 column, alternating images with text, open spaces

2. Full screen collage3. Horizontal width layout

featuring image followed by text block

4. Grid layout with images on left hand side and text on white background on the right hand side

5. 2-column layout with images and short description below.

Testimonial Layout Pack

Filename:(Original filename:Divi-100-pack-4.zip)

Renamed file:divi-100-testimonial-layout-pack-4.zip

http://www.elegantthemes.com/blog/divi-resources/free-divi-testimonials-layout-kit

11 different testimonial layouts

Blog Post Layout Pack

Filename:(Original filename from ET website: Divi-100-layout-pack-5.zip)

Renamed file:divi-100-blog-post-layout-pack-5.zip

http://www.elegantthemes.com/blog/divi-resources/free-divi-blog-post-layout-pack-will-take-your-builder-powered-articles-to-the-next-level

3 layouts1. full-width custom header,

over-hanging images, a clean image grid, and bold block quotes

2. custom header including article title, author image, and metadata.

3. Collage like overlapping images

List Layout Pack

Filename:divi-100-pack-6-layout.zip

Renamed file:divi-100-list-layout-pack-6.zip

http://www.elegantthemes.com/blog/divi-resources/free-divi-feature-list-layout-pack-will-help-you-showcase-what-you-have-to-offer-in-style

To showcase features and benefits of your products and services

10 different layouts

Footer: Layout Pack

Filename:Divi-100-footer-layout-pack.zip

http://www.elegantthemes.com/blog/divi-resources/free-divi-footer-layout-pack-10-unique-footer-designs-to-give-your-site-a-leg-up

10 unique designs

Page: FAQ Layout Pack

Filename: divi-100-faq-layout-pack.zip

http://www.elegantthemes.com/blog/divi-resources/free-divi-faq-layout-pack

3 modern, clean layouts that you can use as is or for inspiration

Split Screen Layout

Filename:divi-100-split-screen-layout-kit

http://www.elegantthemes.com/blog/divi-resources/free-divi-split-screen-layout-kit

4 different split screen layouts

Buttons: Custom Buttons Layout Kit

Filename:divi-100-buttons-kit.zip

http://www.elegantthemes.com/blog/divi-resources/download-the-free-divi-custom-button-module-design-kit

50 different button styles Save as module once

you’ve decided which ones you want to use on your site.

3 main styles in a variety of colors

Page or Post: Simple Layout Article Kit

Filename:Divi-100-simple-article-layout-kit.zip

http://www.elegantthemes.com/blog/divi-resources/free-divi-article-layout-customizer-settings-dont-just-improve-one-page-or-post-improve-them-all

Layout for page or post with bolded font and white space. Clean and modern.

Other: Customizer Settings Layout Pack

Filename:Divi-100-customizer-settings-pack.zip

http://www.elegantthemes.com/blog/divi-resources/free-divi-article-layout-customizer-settings-dont-just-improve-one-page-or-

Image n/a

post-improve-them-all

Allows you to import customizer settings that go across your entire site.

Should save your customizer settings first so you can revert if you don’t like the new settings

Header: Divi UI Header Layout Pack

Filename:Divi-100-header-ui-kit.zip

http://www.elegantthemes.com/blog/divi-resources/free-divi-download-the-divi-header-ui-kit

Customize headers (menus) to be used with blank template page

For pages on which you want header to be different

25 different layouts

Pages: Contact Us Page Layout Kit

Filename:divi-100-contact-page-layout-pack.zip

http://www.elegantthemes.com/blog/divi-resources/download-the-free-divi-contact-pages-layout-pack

5 different contact us page layouts

Pages: Profile Pages Layout Kit

Filename:Divi-100-profile-pages-layout-kit.zip

http://www.elegantthemes.com/blog/divi-resources/free-divi-download-the-profile-pages-layout-pack

For personal landing pages within a larger site or even for micro “about me” websites

8 different layouts

Page: Landing Page

http://www.elegantthemes.com/blog/resources/free-divi-landing-page-layout-kit

Filename:Divi-landing-page-kit.zip

Available in two forms. pre-made Divi section OR you can access all 23

components at once using the master layout

Page: About

(https://creativechildthemes.com/freesbie/)

Overlapping sectionsCustomer TestimonialsTeamCustomer Profiles (grid)

Landing Pagehttps://creativechildthemes.com/divi-lab/

VideoBenefits of Product (circle icons)Testimonials (Staggered)Your ResumeFAQCTAContact Formhttps://creativechildthemes.com/freesbie/

Gradiant formOpt-in

Contact Form (section)https://creativechildthemes.com/freesbie/

Blurb on leftContact form on right

Split Sectionhttps://creativechildthemes.com/freesbie/

Diagonal split

Split Sectionhttps://creativechildthemes.com/freesbie/

Background row with image and text

Pricing Tables Packhttps://creativechildthemes.com/freesbie/

3 new designs

Opt-in Form

https://creativechildthemes.com/freesbie/

2 designs

Opt-in Formhttps://creativechildthemes.com/freesbie/

2 additional designsCustom Service Blurbhttps://creativechildthemes.com/freesbie/

Transparent background

Section: Diagonal Overlayhttps://creativechildthemes.com/freesbie/

transparent diagonal overlay

Grid

https://creativechildthemes.com/freesbie

For services, team or portfolio

Header: Blog Magazine

https://creativechildthemes.com/freesbie