Install & Edit A BodyCommerce Layout Pack
Written by the Divi Engine Documentation Team
Follow this information to learn how to install and edit a BodyCommerce Layout Pack.
Watch This Video
Step 1: Select A Layout Pack
Head over to our BLOG, filter by Layouts and select a BodyCommerce Layout Pack.
Step 2: Download Layout Pack
Find the Download button and click to download.
Step 3: Read READ_FIRST file.
Drag the folder inside the ZIPPED folder into your Desktop and read the READ_FIRST or READ_ME file.
Step 4: Install Divi & WooCommerce
First, you will need to install Divi, WooCommerce (and Divi BodyCommerce) using the appropriate method. Please click HERE to install BodyCommerce.
Step 5: Get Your Website Ready
- Disable all other plugins (apart from WooCommerce) while developing.
- Please go to Divi > Theme Options > Builder > Advanced and turn off the Divi Static CSS File Generation.
- Flush permalink structure by saving the permalink structure twice. Go to Settings > Permalinks > Save.
- Remove extra custom CSS that might conflict with Divi BodyCommerce.
Step 6: Create Default WooCommerce Pages
Go to WooCommerce > Status > Tools and create default WooCommerce pages. These pages must NOT have the Divi Builder installed on them. They must be the default WooCommerce pages.
Step 7: Import Divi Library Layouts
Most of your DiviBodycommerce website is built in the Divi Library. You will need to import the layouts from the Layout Pack folder that you have downloaded. To do this head over to Divi > Divi Library > Import & Export > Import and select the Library Layouts JSON file from the Layout Pack (now on your Desktop).
Step 8: Import BodyCommerce Settings
Your next step is to import BodyCommerce settings by heading over to Divi Engine > BodyCommerce > Settings > BodyCommerce Tools and select the BodyCommerce Settings CSV file from the Layout Pack (now on your Desktop) and click the Save Settings button. Then scroll down and Save Changes. This will arrange your BodyCommerce settings.
Step 9: Select Layouts & Settings Manually
On some WordPress Divi websites, the settings CSV file does not upload correctly. We are not sure of exactly why some websites do not import the settings correctly. If this happens to you then you will need to work through our documentation to arrange BodyCommerce settings yourself and assign layouts. The good news is that you now have the layouts and so half the work has been done for you.
Step 10: Import Theme Builder Layouts
Step 11: Add Products & Categories
Step 12: View Pages
To view your pages click on the link to view from the front. For example, to view your product page go to WooCommerce > Products and find a product and open it up to view the front. The same applies to categories, the account page, the checkout and shop page - among others.
Step 13: Edit Divi Library Layouts
To edit a Divi Library Layout for the shop page, product page or more visit the Divi Library and select the layout. Or, visit BodyCommerce and click on the Edit This Layout button.
Step 14: Continue Building Your Website
Please email us at [email protected] if you are unable to get Divi BodyCommerce working.