In the meantime, if you’d like to install the demo content manually, please follow the steps below.
Step 1: Download the JSON Files #
Download the following two JSON files: My account.json and Divi Library Layouts.json
Step 2: Import the JSON Files #
Import the downloaded JSON files to your site.
1. Go to your WooCommerce My Account page and click Enable Visual Builder.
2. In the builder settings, open the Import/Export Layout option.
3. Click Import, then upload the My Account.json file.
4. Save your changes when the import is complete.
At the top of the page, click Import & Export, then choose the Import tab and upload the Divi Library Layouts.json file.
Step 3: Set Up the Dashboards #
The demo includes three dashboard variations. To set them up, go to your WordPress admin panel and navigate to Divi Account.
1. To set up Dashboard 1, open the Dashboard tab to access the endpoint settings.
– Under the Before Content option, click Select and choose the Global before dashboard layout from the popup with available Divi Library elements.
– Then, under the After Content option, repeat the same process — click Select and choose the Global after dashboard layout from the available Divi Library elements.
– Under the Before Content option, click Select, and from the popup with available Divi Library elements, choose the layout named Mixed Dash.
– Under the Before Content option, click Select, and from the popup with available Divi Library elements, choose the layout named Dashboard 3.
IMPORTANT: Then Save the changes from the button at the top left on the screen.
Step 4: Set Up the Icons #
To assign icons, open each individual endpoint and select the icon you want to display for it.
In the demo, the “Angle Right” icon is used for most endpoints, while the “Sign Out” icon is used for the Logout endpoint.
Once you’ve finished setting up the icons, don’t forget to click Save Changes.
How to customize the demo content #
If you’d like to customize the Before and After sections from the demo content, you can do so directly in the Divi Library.
Go to your WordPress admin panel and navigate to Divi → Divi Library, then click on the layout you want to edit.
After saving your changes, they will automatically be applied wherever that Divi Library element is used on the My Account page.
Please note that the Before and After elements cannot be edited directly from the account page. They appear as placeholder blocks only when the Divi Visual Builder is enabled.
However, there’s no need to worry — these sections will display correctly on the front end when the Divi Builder is not active.
What to do if you cannot edit elements in your Divi Library #
If you’re unable to edit the layouts in the Divi Library, or if you notice that a layout contains a section and row but no module inside the global sections, or if you’re unable to create new Divi Library items on your site, please try the following solution:
Go to Settings > Permalinks and re-save the settings there.
This should resolve the issue.