Divi 5 Layout Pack Documentation

DIVI 5 LAYOUT PACK DOCUMENTATION

Welcome to the official documentation for the Divi 5 Layout Pack. Follow the steps below to successfully download, install, and utilize your newly purchased layout pack.

STEP 1: DOWNLOADING YOUR PURCHASE

  1. Complete Your Purchase: After completing your purchase, click the “Download Product” button.
  2. Alternative Access: You can also log into your account on our website at any time to download the product from there.

Important Reminder: Ensure you are using Divi Theme version 5. This theme is currently in the alpha phase. Note that this layout pack will not work on Divi 4 or older versions.

STEP 2: PREPARING THE FILES

  1. Extract the Zip File: Once downloaded, locate the .zip file on your computer and extract it.
  2. Locate the Folders: Inside, you’ll find multiple folders, each containing the .json layout files.

Each folder represents a group of layouts, with individual .json files for each layout and often a combined .json file for all layouts in that group.
Example: A folder named “Hero Sections 1 to 10” includes files like hero-section-01.json, hero-section-02.json, up to 10, and possibly a combined file.

STEP 3: IMPORTING A LAYOUT (New v1.1 Method)

To ensure all styles, presets, and fluid settings import correctly, we must use Divi’s page-level import feature. This method bypasses a bug in the Divi Library and guarantees a perfect import.

  1. Create a New Page: In your WordPress dashboard, navigate to Pages > Add New. Give your page a title and click “Use Divi Builder”.
  2. Open Portability Options: In the Divi Builder, locate the purple button with three dots at the bottom of the screen to open the menu. In the toolbar that appears, click the portability icon (up and down arrows).
  3. Select Import: In the pop-up window, select the “Import” tab at the top.
  4. CRUCIAL STEP: CHECK THE BOXES

    Before importing, you MUST check both of these boxes. Failing to do so will result in an incomplete import where styles and presets are missing.

    • Replace The Existing Content
    • Import Presets
  5. Choose Your File: Click the “Choose File” button and navigate to the .json layout file you extracted in Step 2.
  6. Import the Layout: Click the blue “Import Divi Builder Layout” button and wait for the process to complete.

STEP 4: USING & SAVING THE IMPORTED LAYOUT

  1. Access the Imported Layout: Once the import is finished, the layout will appear directly on your page, fully styled and ready to go. You can now edit the text, images, and other content as you wish.
  2. Save to Library (Optional): If you want to reuse a specific section from the imported layout later, you can save it to your Divi Library. Simply hover over the section (the blue controls), click the three-dot icon, and select “Save to Library”.
  3. Customize Your Layout: Adjust colors, fonts, and styles to perfectly match your brand’s preferences.

By following these detailed steps, you’ll be able to seamlessly integrate and utilize your Divi 5 layout pack. Enjoy enhancing your web design projects!

Divi Elathi Cards Documentation

DIVI ELATHI CARDS DOCUMENTATION

Welcome! Thank you for purchasing the Divi Elathi Cards pack. This guide will walk you through the simple steps to import and use your 12 new card layouts.

Compatibility: Please ensure you are using Divi Theme version 5 or higher. These layouts are not compatible with Divi 4 or older versions.

STEP 1: DOWNLOADING & PREPARING THE FILE

  1. Download Your Purchase: After completing your purchase, click the “Download Product” button to get the .zip file.
  2. Extract the File: Once downloaded, extract the .zip file. Inside, you will find the main layout file named divi-elathi-cards.json. This single file contains all 12 card layouts.

STEP 2: IMPORTING TO YOUR DIVI LIBRARY

This product is designed for a quick and easy import directly into your Divi Library, making all layouts readily available for any page.

  1. Navigate to Divi Library: In your WordPress dashboard, go to Divi > Divi Library.
  2. Open Portability Options: At the top of the Divi Library page, click the “Import & Export” button.
  3. Select Import: A modal window will appear. Choose the “Import” tab.
  4. Choose Your File: Click the “Choose File” button and select the divi-elathi-cards.json file you extracted in the previous step.
  5. IMPORTANT: CHECK THIS BOX!

    Before importing, you must check the box for ✅ Import Presets. This ensures all the custom styles, colors, and fonts are imported correctly.

  6. Import the Layouts: Click the blue “Import Divi Builder Layouts” button. Once the process is complete, all 12 card layouts will be in your library.

STEP 3: USING YOUR NEW CARD LAYOUTS

  1. Edit a Page with Divi: Go to any page where you want to add a card and enable the Divi Builder.
  2. Add a New Section: Click the gray plus icon (+) to add a new section.
  3. Add From Library: In the “Insert Section” modal, click on the “Add From Library” tab.
  4. Select Your Card: You will now see all 12 “Divi Elathi Card” layouts listed. Simply click on the one you wish to use.
  5. Customize: The card layout will be added to your page, ready for you to edit the text, images, and other content to fit your needs.

That’s it! You can now effortlessly add professional and stylish cards anywhere on your site. Enjoy building!