Time stamps
| 00:00 | Intro |
| 01:52 | Create a free membership account |
| 02:21 | Download free layout pack |
| 02:44 | Requirements |
| 03:40 | Installing layout pack |
| 05:10 | Creating the pages |
| 06:19 | Creating the menu |
| 07:25 | Installing and configuring the search plugin |
| 08:28 | Check if the menus are assigned |
| 09:09 | Creating attributes |
| 09:55 | Create a product |
| 11:41 | Variation image swapping |
| 13:06 | Adjusting shop image dimensions |
| 13:56 | Creating shop filters |
| 16:09 | Fix some issues on the home page |
| 17:27 | Create a blog post |
| 18:17 | Testing shop |
| 19:00 | Explaining the CSS |
| 20:51 | Outro |
Quick Setup Guide
While the video goes into detail, here’s a short written overview to help you get started quickly:
How to Download the Free DiviCart Layout Pack
You can create a free account with the link below “Join the Free Membership”, or if you already have a free account, then you can log in here.
Create a free account
Get Access to All of My Free Resources
Join the free membership and start downloading my layout packs
Join the Free Membership
From your membership area, you can download DiviCart. Once downloaded, unzip the folder. Inside, you’ll find 4 JSON files that you’ll import into different parts of your Divi site.
How to Install DiviCart in WordPress
To install the layout pack, follow these key steps:
Go to Divi > Theme Options. Click on the import/export options (up/down arrow).
Click on Import and upload DiviCart Theme Options.json.
Go to Divi > Theme Builder. Click on the import/export options.
Click on Import and upload DiviCart Theme Builder Templates.json.
Go to Divi > Theme Customizer. Click on the import/export options (up/down arrow).
Click on Import and upload DiviCart Customizer Settings.json.
Go to Divi > Divi Library. Click on the import/export options.
Click on Import and upload DiviCart Builder Layouts.json.
Set Up Pages & Menu
- Create and publish pages for Home, About, Blog, and Contact using saved layouts
- Create a main menu and assign your pages
- Add a second menu for the cart icon
Configure Shop Settings
- Adjust WooCommerce pages under WooCommerce > Settings
- Set image sizes in Theme Customizer
- Create product attributes (Size, Color), and add your first product
- Use variations and assign images to each color option
Add Filters and Customize Layout
- Create a custom sidebar with product filters
- Tweak custom CSS in Theme Options if needed (colors, borders, mobile icons, etc.)
This is great Mark! Thank you so much! Do you think this works on Divi5 already?
Unfortunately, not yet the WooCommerce modules in Divi haven’t been converted for Divi 5.