You can add the Logistics Layout to your Divi website by following either of these two methods:
- Method 1: Using the DiviFlash layout importer (recommended).
- Method 2: Manually importing the layout.
In this doc, we will walk through each method step by step.
Method 1: Using DiviFlash Layout Importer
Step 1: Install and activate the Divi theme.
Step 2: Install and activate the DiviFlash plugin.
Step 3: Install and activate the Monarch Plugin.
Step 4: In the WordPress Dashboard, go to DiviFlash > Layouts and search for the “Logistics” layout.
Step 5: Hover over the Logistics layout, then click “Import Layout.”
- A popup will appear showing the layout settings and server requirements. Make sure all items show green checkmarks. If you see any red crosses, update your server settings and refresh the page. Once everything turns green, click “Start Importing.”
- The process may take a few minutes.
- Once done, select Menu Customize to adjust the menu for the imported layout. You can follow Divi Layout Menu Customization doc.
Step 6: After customizing the menu, set your site’s homepage by following these steps:
- Go to the WordPress dashboard > Settings > Reading.
- Under “Your homepage display,” select “A static page.”
- Select “Home” from the homepage dropdown.
- Click on “Save Changes” to save the changes.
The Logistics layout has been successfully imported and is now live on your website.
Method 2: Manually Import the Layout
If you prefer to manually import the Logistics layout, here is a step-by-step doc to help you through the process:
Step 1: Install and activate the Divi theme.
Step 2: Install and activate the DiviFlash plugin.
Step 3: Download the Logistics Layout file from the DiviFlash website and unzip it.
Step 4: Activate all required DiviFlash modules before proceeding with the import. Follow how active DiviFlash modules.
- Advanced Blurb
- Advanced Person
- Advanced Tabs
- Post Grid
- Advanced Carousel
- Dual Button
- Logo Carousel
- Testimonial Carousel
- WPForms Styler
- Filterable CPT
- Advanced List
- Breadcrumbs
Step 5: Now, install and Activate the WPForms Plugin.
Step 6: After that proceed with the following steps:
- Navigate to WordPress Dashboard > WPForms > Tools > Import
- In the “WPForms Import” field, select “WPForms – Logistics Layout – DiviFlash.json”
- Click the “Import” button.
Step 7: Next, install and Activate the Monarch Plugin.
Step 8: Import the “Monarch Settings” file following the instructions:
- Navigate to WordPress Dashboard > Tools > Monarch Settings
- Click on the “Import & Export” icon in the top right corner
- Under “IMPORT MONARCH SETTINGS”, click on “Choose File” and choose JSON file named “Monarch Settings Logistics Layout – DiviFlash.json”
Step 9: Import the “Divi Theme Options” file into the Theme Options panel:
- Navigate to WordPress Dashboard > Divi > Theme Options
- Click on the “Import & Export” icon in the right side corner
- Select the “Import” tab and choose the JSON file named “Divi Theme Options Settings – Logistics Layout – DiviFlash.json”
- Finally, click on “Import Divi Theme Options”
Step 10: Import the “Theme Builder” file into the Divi Theme Builder panel:
- Navigate to your WordPress dashboard and go to Divi > Theme Builder
- Click on the “Import & Export” icon in the right side corner
- Select the “Import” tab and choose the JSON file named “Divi Theme Builder Settings – Logistics Layout – DiviFlash.json”
- Finally, click on “Import Divi Theme Builder Templates”.
Step 11: Import Logistics layout’s Page File into Divi Library:
- Navigate to your WordPress dashboard and go to Divi > Divi Library
- Click on the “Import & Export” button on the top left
- Select the “Import” tab and choose the JSON file named “All In One – Logistics Layout – DiviFlash.json” (Or, import specific pages separately using their individual JSON files.)
- Click on the “Import Divi Builder Layouts” button.
Now, create new pages using the layout items you imported into the Divi Library. Follow our doc on how to create pages with items from the Divi Library.
Step 12: Import the “Theme Customizer Settings” file into the Theme Customizer
- Navigate to WordPress Dashboard > Divi > Theme Customizer
- Click on the “Import & Export” icon on the top left corner.
- Select the “Import” tab and choose the JSON file named “Divi Theme Customizer Settings – Logistics Layout – DiviFlash.json”
- Finally, click on “Import Divi Customizer Settings”.
Step 13: Import Media file into Your Site
- Navigate to WordPress Dashboard > Tools > Import
- Click on Run Importer under the WordPress (If you see, “Install Now” instead of “Run Importer,” click on install now. Then you will get the “Run Importer” option.)
- Click on “Choose File” and import the “Media – Logistics Layout – DiviFlash.xml” file and click “Upload file and import”.
- Assign the author (or skip this step), then check the “Import Attachment” option and click “Submit” to save your changes.
Note: By following the same steps (WordPress Dashboard > Tools > Import > Run Importer under the WordPress), you have to import Posts and Projects .xml files.
Step 14: Link the “Request Quote” Button
To connect the Request Quote button to the correct page, follow these steps:
- Navigate to the WordPress Dashboard > Divi > Theme Builder
- Click on the edit icon of the “Global Header” of Default Website Template
- Then click on “Request Quote” and its settings icon
- Click on “Page Link” under the URL field and select page link from the dropdown menu
- Again from the page dropdown menu, select “Request Quote” page and click on apply.
- Now click on the “Save” button to save the changes.
Note: If the form does not appear on the Request Quote page, hover over the Form Module and select the correct form from the module settings.
Step 15: Set your site’s homepage by following these steps:
- Navigate to the WordPress Dashboard > Settings > Reading.
- Under “Your homepage display,” select “A static page.”
- Choose “Home” from the homepage dropdown.
- Click on “Save Changes” to save the changes.
Step 16: Set up a menu for your imported layout. You can find more details in our doc on Divi layout menu customization.
Now your website should look exactly the same as the Logistics layout!
Any Questions?
If you have any questions, please feel free to contact our support team at [email protected]
