Select Page

Looking For Something Specific...

View Categories

How To Use Car Repair Layout?

You can add the Car Repair layout to your Divi website using one of two methods:

In this doc, we will walk you through both methods step by step to help you set up the Car Repair layout on your website easily.

Method 1: Using DiviFlash Layout Importer

Step 1: Install and activate the Divi theme. 

Step 2: Install and activate the DiviFlash plugin.

Step 3: In the WordPress Dashboard, go to DiviFlash > Layouts and search for “Car Repair.”

Step 4: Hover over the Car Repair layout and select “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.”
  • Wait for the process to complete.

Note: Car Repair layout has a mega menu in the menu’s “Services” item that you have to activate manually. For that, follow these steps:

  • Go to Appearance > Menus and enable DiviFlash menu settings.
  • Select Service > Edit Menu, and under “Layout Settings” make these changes:
  • Submenu Type: Divi Layout
  • Library Item: Mega Menu
  • Content Width Type: Custom width
  • Custom Width (px): 700
  • Click Save & Exit.

Step 5: Set your homepage and blog page. 

  • Go to WordPress Dashboard > Settings > Reading.
  • Below “Your homepage displays,” select “A static page.”
  • Choose “Home” from the homepage dropdown menu. 
  • Choose “Blog” from the post page dropdown menu.
  • Click on “Save Changes” to save it.

Step 6: Set Popups

The Car Repair layout includes several popups for different sections. To display these popups on your website, you need to manually update the popup ID in the location where each popup is triggered.

Here is how to do it:

  • From the WordPress dashboard, navigate to DF Popups > All Popups.
  • Copy the Popup Target ID from the list.
  • Go to WordPress Dashboard > Divi > Theme Builder.
  • Click on the edit icon of the “Global Header.”
  • Hover over the menu and click on the module’s settings icon.
  • From the settings panel, click on the button’s edit icon.
  • Scroll down and paste the copied popup ID into the “Button URL” field.
  • Click the Save button to apply the changes and you are done.

Note: The Car Repair layout also includes a video popup on the Single Service page. To update it, copy the Popup Target ID, then open any Single Service page with the Visual Builder enabled. Hover over the Hero Section’s Image Module, open the Module Settings, and update the Popup ID in the Link settings.

The Car Repair layout has been successfully imported and is now live on your website.

Method 2: Manually Import the Layout

To manually import the Car Repair layout into your website, follow these detailed steps:

Step 1: Install and activate the Divi theme. 

Step 2: Install and activate the DiviFlash plugin. 

Step 3: Download the Car Repair layout file from the DiviFlash website and unzip it.

Step 4: Import the “DiviFlash’s Dashboard” settings file into DiviFlash’s dashboard panel:

  • Navigate to WordPress Dashboard > DiviFlash > Settings > Import/Export.
  • Click on “Choose File” and select “DiviFlash Dashboard – Car Repair Layout Packs – DiviFlash.json”
  • Finally, click on the “Import Settings” button

Step 5: Import the “Divi Theme Options” settings file into the Divi 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 – Car Repair Layout Packs – DiviFlash.json”
  • Finally, click on “Import Divi Theme Options”

Step 6: 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 -Car Repair Layout Packs-DiviFlash.json”
  • Finally, click on “Import Divi Theme Builder Templates”.

Step 7: Import layout pages file into Divi Library:

  • Navigate to your WordPress Dashboard and go to Divi > Divi Library
  • Click on the “Import & Export” button on the upper left
  • Select the “Import” tab and choose “All In One – Car Repair Layout Packs – DiviFlash.json” (You can also import individual layout pages one by one by using their respective JSON files.)

Step 8: 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 “Divi Theme Customizer Settings – Car Repair Layout Packs – DiviFlash.json”
  • Finally, click on “Import Divi Customizer Settings”.

Step 9: Import the Media file for the layout

  • Navigate to WordPress Dashboard > Tool > Import
  • Click on Run Importer under the WordPress 
  • Click on “Choose File” and import the “Media – Car Repair Layout Packs – 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 > Tool > Import > Run Importer under the WordPress), you have to import Posts .xml files.

Step 10: Import the popup file into popup import and export panel

To use the popup settings, first enable the Popup feature by going to WordPress Dashboard > DiviFlash > Settings > Popup Enable.

  • Navigate to WordPress Dashboard > DF Popups > Import & Export
  • Under the Import section, click on “Choose File” and select “Df-Popup – Car Repair Layout Packs – DiviFlash.json” JSON file.
  • Click the “Import” button.

Step 11: Publish the Imported Popup

  • Go to WordPress Dashboard > DF Popups > All Popups
  • Click Edit below the popup name.
  • Click the Publish button.
  • Repeat these steps to publish the second popup.

Step 12: Setup the Popup (Updating ID)

  • Go to WordPress Dashboard > DF Popups > All Popups, and copy the “Popup Target ID” by clicking on it.
  • Go to WordPress Dashboard > Divi > Theme Builder.
  • Click on the edit icon of the “Global Header.”
  • Hover over the menu and click on the module’s settings icon.
  • From the settings panel, click on the button’s edit icon.
  • Click the Save button to apply the changes and you are done.

Note: The Car Repair layout also includes a video popup on the Single Service page. To update it, copy the Popup Target ID, then open any Single Service page with the Visual Builder enabled. Hover over the Hero Section’s Image Module, open the Module Settings, and update the Popup ID in the Link settings.

Step 13: Set your site’s homepage by following these steps:

  • Go to WordPress Dashboard > Settings > Reading.
  • Below “Your homepage displays,” select “A static page.”
  • Choose “Home” from the homepage dropdown menu. 
  • Choose “Blog” from the post page dropdown menu.
  • Click on “Save Changes” to save the changes.

Step 14: Create a menu for the imported layout. You can follow Divi Layout Menu Customization guide.

Note: Car Repair layout has a mega menu in the menu’s “Services” item that you have to activate manually. For that, follow these steps:

  • Go to Appearance > Menus and enable DiviFlash menu settings.
  • Select Service > Edit Menu, and under “Layout Settings” make these changes:
  • Submenu Type: Divi Layout
  • Library Item: Mega Menu
  • Content Width Type: Custom width
  • Custom Width (px): 700
  • Click Save & Exit.

Now your website should look exactly the same as the Car Repair layout!

Any Questions?

If you have any questions, please feel free to contact our support team at [email protected]

Help us improve! Let us know if this article was helpful.

Introducing DiviFlash 5.0 — Fully Rebuilt for Divi 5 & Backward Compatible with Divi 4

Learn More →