eBook layout, designed by the DiviFlash team, is a free, single-page layout. You can set up this layout on your Divi website using one of the following import methods:
- Method 1: Using DiviFlash layout importer (Quick and Easy Import)
- Method 2: Manually importing the layout
In this guide, we will walk you through both methods. Let’s begin.
Method 1: Using DiviFlash Layout Importer
With DiviFlash, you can easily import any DiviFlash’s layout with just a single click. Here is how to do it:
Step 1: Install and activate the Divi Theme.
Step 2: Install and activate the DiviFlash Plugin.
Step 3: In your WordPress dashboard, go to DiviFlash > Layouts and search for eBook.
Step 4: Hover over “eBook” and click on “Import Layout” to start the import process.
- Now you will see a popup that outlines a list of layout settings and server requirements.
Note: Check that all requirements show green checkmarks to ensure a smooth import. If there are red crosses, adjust the server settings and refresh the page.
- Once all requirements are verified, click “Start Importing” to begin the layout import process.
- The import process may take a few minutes.
- When it’s finished, you will see options for “Back to Layouts” and “Menu Customize.” (As this is a single-page layout, you’ll need to assign CSS IDs to each section and then build a menu using those IDs.)
Step 5: Now modify the imported layout’s manu by following these steps:
- Go to WordPress dashboard > Pages (Front) and click “Edit With Divi.”
- Click on the Settings icon of the section you wish to add to the menu (e.g., Features).
- Navigate to the Advanced tab > CSS ID & Classes > CSS ID and enter your desired ID (e.g., features). Copy the CSS ID for later use.
- Repeat this process for each section you want to include in the menu (e.g., Chapters, About Author, Testimonial, Contact).
- Go to Dashboard > Appearance > Menus, and create a new menu.
- From the Pages section, select the “Front” page and click “Add to Menu.”
- Next, select Custom Links and fill in the following details:
- URL: Add a hashtag and paste the copied ID (e.g., #features).
- Link Text: Enter your desired menu name (e.g., “Features”).
- Repeat the same steps to add custom links for Chapters, About Author, Testimonial, and Contact.
Once all custom links are added, click the “Save Menu” button to apply your changes.
Step 6: After modifying the menu, set your website’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.
Now that your eBook layout is successfully imported, it’s live on your website. Visit your website to see it in action.
Method 2: Manually Import the Layout
You can also import the eBook Layout manually. Here is a step-by-step guide:
Step 1: Install and activate the Divi Theme.
Step 2: Download the eBook layout file from the DiviFlash website and unzip it.
Step 3: 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 – Ebook Layout – DiviFlash.json”
- Finally, click on “Import Divi Theme Options”
Step 4: Import the “Theme Customizer Settings” file into the Theme Customizer panel
- 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 Customizer Settings – Ebook Layout – DiviFlash.json”
- Finally, click on “Import Divi Customizer Settings”.
Step 5: Import the Home Page file into Divi Library panel
- Navigate to WordPress Dashboard > Divi > Divi Library
- Click on the “Import & Export” button on the upper left
- Select the “Import” tab and choose the JSON file named “Home page – Ebook Layout – DiviFlash.json”
- Click on the “Import Divi Builder Layouts” button.
- Next, create a new page and set the imported layout as its template. You can follow this guide on how to create pages with Divi Library’s layout.
Step 6: It’s time to create a menu for the imported layout. Follow the below instructions:
- Go to Pages and click “Edit With Divi” on the page you created in step 5.
- Next, click on the Settings icon of the section you wish to add to the menu (e.g., Features).
- Navigate to the Advanced tab > CSS ID & Classes > CSS ID and enter your desired ID (e.g., features). Copy the CSS ID for later use.
- Repeat this process for each section you want to include in the menu (e.g., Chapters, About Author, Testimonial, Contact).
- Go to Appearance > Menus, and create a new menu.
- Select Custom Links and fill in the following details:
- URL: Add a hashtag and paste the copied ID (e.g., #features).
- Link Text: Enter your desired menu name (e.g., “Features”).
- Repeat the same steps to add custom links for Chapters, About Author, Testimonial, and Contact.
- After creating a menu, assign the ‘df – menu -active’ class to the “Home” menu button. You can follow this guide: Divi layout menu customization.
Once all custom links are added, click the “Save Menu” button to apply your changes.
Step 7: Finally set the homepage for the layout.
- Navigate to the WordPress dashboard > Settings > Reading.
- Under “Your homepage display,” select “A static page.”
- Choose “Home” from the homepage dropdown.
- Click “Save Changes” to set the new homepage.
Now your website should look exactly the same as the eBook layout! Need help getting the most out of your eBook layout? Our super responsive support team is just an email away at support@diviflash.com.
