To use this layout, follow any of the below methods:
- Method 1: Using the DiviFlash layout importer (single click import)
- Method 2: Manually import the layout
In this guide, we will walk you through both of the methods step-by-step.
Method 1: Using DiviFlash Layout Importer
DiviFlash lets you import any layout with a click of your mouse. Here’s how to do it:
Step 1: Install and activate the Divi Theme.
Step 2: Install and activate the DiviFlash plugin.
Step 3: Go to WordPress Dashboard > DiviFlash > Layouts, and search for “events”.
Step 4: Hover your mouse over the Events layout and click “Import Layout”.
- A pop-up will appear, displaying layout settings and server requirements. If you see any red crosses, adjust before clicking “start Importing”.
- The process of importing may take a few minutes.
- When the import is done, click on the “Menu Customize” to customize the menu as per your choices. For better understanding, follow the Divi Layout Menu Customization guide.
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: The Events layout has pop-ups on the homepage. To show a popup to visitors, you need to manually update the popup ID in the location where it is triggered.
Here’s the step-by-step guide:
- Go to WordPress Dashboard > DF Popups > All Popups.
- Copy the “Popup Target ID” by clicking on it.
- Go to the “Homepage”, and enable the visual builder.
- Now hover your mouse on “Book Your Spot Now” and click on the “Settings” icon.
- Paste the “Target ID” under the “URL” section and click on the green tick.
- Select the “Three Dots” icon and then click on “Save”.
- By following the same process, you need to paste the ‘Target ID’ into all the “Buy Tickets” pop-ups in the layout to display it to your visitors.
Step 7: Show the “Sponsor” pop-up to your visitors.
Just like “Buy Tickets” pop-up, use the same process for the “sponsor” Pop-ups. Here’s how to do it:
- You will find the “Right Button” just below the “Left Button”. Paste the “Target ID” under the “URL” for showing the pop-up to the visitors. Then click on the green tick to save it.
- Click on the “Three Dots” to save it like the before pop-up.
Method 2: Manually Import the Layout
You can also import the layout manually. Here’s the step-by-step guide.
Step 1: Install and activate the Divi Theme.
Step 2: Install and activate the DiviFlash plugin.
Step 3: Download the Events layout from the DiviFlash website and unzip it.
Step 4: Import the “DiviFlash Dashboard” file into the DiviFlash Dashboard panel:
- Go to WordPress Dashboard > DiviFlash > Settings > Import/Export.
- Click on the “Choose File” and select “DiviFlash Dashboard – Events Layout – DiviFlash.json”.
- Now, click on the “Import Settings” button.
Step 5: Import the “Divi Theme Options” setting file into the Divi Theme Options panel:
- Got to WordPress Dashboard > Divi > Theme Options.
- Select the “Import & Export” icon on the right side of the screen.
- Select the “Import” tab and choose the JSON file named “Divi Theme Options – Events Layout – DiviFlash.json”.
- Now, Click on the “Import Divi Theme Options” and press the “Save Changes” to save it.
Step 6: Import the “Divi Theme Builder Settings” file into the Divi Theme Builder panel:
- Go to WordPress Dashboard > Divi > Theme Builder.
- Click on the “Import & Export” icon on the right side of the screen.
- Select the “Import” and choose the JSON file named “Divi Theme Builder Settings – Events Layout – DiviFlash.json”.
- Now, click on the “Import Divi Theme Builder Templates” and then press the “Save Changes” button.
Step 7: Import the “Theme Customizer Settings” file into the Theme Customizer panel:
- Go to the WordPress Dashboard > Divi > Theme Customizer.
- Click on the “Import & Export” on the left side of your screen.
- Select the “Import” and choose the JSON file named “Divi Theme Customizer Settings – Events Layout – DiviFlash.json”.
- Finally, click on the “Import Divi Customizer Settings” button.
Step 8: Import the “Divi Library” file into the Divi Library panel:
- Go to WordPress Dashboard > Divi > Divi Library.
- Click on the “Import & Export” icon on the right side of the corner.
- Choose the “Import” tab and select the JSON file named “All In One – Events Layout – DiviFlash.json”.
- Now, click on the “Import Divi Builder Layouts”.
- Your next step is to create new pages using the layouts you’ve saved in your Divi Library. (Follow our guide How to Create Pages with Divi layouts from the Library for better understanding.)
Step 9: Import the Media file for the layout
- Go to WordPress Dashboard > Tools > Import.
- Click on the “Run importer” under the “WordPress” (If you see “Install Now” instead of “Run Importer”, click install.). “Run Importer” will appear then.
- Click on the “Choose File” and import the file named “Media – Events Layout – DiviFlash.xml”, click on the “Upload file and import”.
- Assign the author (or you can skip the step). Next, check the “Download and Import File Attachments” and click “submit”.
- By following the same steps, import the xml file for the “Posts”.
Step 10: To create new projects with our layout’s design and its contents, Go to WordPress Dashboard > Projects > Add new project.
- Add your title and click on “Use Divi Builder”.
- Now choose the “Build From Scratch”, and click on “Start Building”.
- Then scroll down a little and click the “Three Dots”.
- Click on the “plus” icon as it will appear after clicking on the three dots, then choose “Premade Layout”.
- Choose “Your Saved Layouts” and click on the “Events Detail Content”.
- Now click on “Use This Layout”.
- Now, choose the “Three Dots” and click on “Publish”. Before exit from the “Visual Builder” save it.
- By following the same process, add all other posts to the “Event” page.
Step 11: 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 12: Import the Popup file
- Go to WordPress Dashboard > DF Popups > Import & Export.
- Under the “Import” section, click on “choose File” and select “Popup – Events Layout – DiviFlash.json” file.
- Click on the “Import” button.
Step 13: Publish the Popup
After importing the popup, you need to publish it. Here’s how to do it:
- Go to WordPress Dashboard > DF Popups > All Popups.
- Now, click on the “Edit”.
- Click “Publish” and then “Update” it.
- Apply the same procedure to show the ‘Buy Tickets’ pop-up to your visitors by pasting its Target ID into the settings of every ‘Buy Tickets’ button across the layout.”
Step 14: Set Pop-ups in your home page.
- Go to WordPress Dashboard > DF Popups > All Popups, and copy the “Product Target ID” by clicking on it.
- Go to the “Homepage”, and enable the visual builder.
- Now hover your mouse on “Book Your Spot Now”, and click on the “Settings” icon.
- Paste the “Target ID” under the “URL” section and click on the green tick to save it.
- Select the “Three Dots” icon and then click on “Save”.
- By following the same process, paste the “Target ID” for all the “Buy Tickets” pop-up in the layout to show it to your visitors.
Step 15: Show the “Sponsor” pop-up to your visitors.
Just like “Buy Tickets” pop-up, use the same process for the “sponsor” Pop-ups. Here’s how to do it:
- You will find the “Right Button” just below the “Left Button”. Paste the “Target ID” under the “URL” for showing the pop-up to the visitors. Then click on the green tick to save it.
- Click on the “Three Dots” to save it like the before pop-up.
Step 16: Create the menu for the imported layout. For a better understanding, follow the Divi Layout Menu Customization Guide
Any Questions?
If you have any questions, please feel free to contact our support team at [email protected]
