View Categories

Divi My Account Page – How to use Divi layouts inside account sections

Overview #

Divi My Account Page allows you to insert custom Divi layouts directly inside WooCommerce account endpoints.

This gives you the ability to create highly customized account experiences using normal Divi sections, rows, and modules.

You can add custom content:

• Before endpoint content
• After endpoint content

For example:

• Custom dashboard sections
• Welcome banners
• Support blocks
• Promotional offers
• Account statistics
• Dynamic WooCommerce endpoint content

How to Add Divi Layouts to Account Endpoints #

Step 1 — Create Your Layout #

Create a normal Divi layout using:

• Sections
• Rows
• Modules

You can build this on any page.

Step 2 — Save It to Divi Library #

Save the layout to the Divi Library.

You can save:
• A section
• A row
• A module
• A full layout

Tip: Saving it as a Global Item can make editing easier later.

Step 3 — Go to the Endpoint Settings #

Navigate to:

Divi My Account Page → Choose an Endpoint

For example:

• Dashboard
• Orders
• Downloads
• Edit Account
• Custom endpoints

Step 4 — Load the Layout #

Inside the endpoint settings, choose where to display the layout:

• Before Content
• After Content

Then select your saved Divi Library item.

Step 5 — Save Changes #

Save the endpoint settings and view the account page on the front-end.

Your custom Divi layout will now appear inside that WooCommerce account section.

Important About the Visual Builder #

The imported “Before” and “After” layouts are not fully rendered inside the Visual Builder preview of the My Account Classic module.

Instead, placeholders are shown for performance reasons.

The real layouts are displayed correctly on the front-end account page.

Using the My Account Endpoint Content Module #

The plugin also includes another module called:

My Account Endpoint Content #

This module allows you to display the content of a specific WooCommerce endpoint anywhere inside your Divi layouts.

For example:

• Orders table
• Downloads table
• Account details form
• Dashboard welcome text

This makes it possible to build fully custom account dashboards and layouts.

Example Use Case #

You can create a custom dashboard layout containing:

• Welcome section
• Account statistics
• Orders table
• Downloads section
• Support area

All inside one custom Divi design.

Example of a custom Dashboard. The layout is created with Divi Modules + Endpoint Content modules:

Recommended Workflow #

This is the recommended way to use the module:

1. Create a Divi Layout
Create a section, row, or layout using normal Divi modules.

2. Add the “My Account Endpoint Content” Module
Inside the layout, insert the My Account Endpoint Content module.

Choose which endpoint content to display.

For example:
• Orders
• Downloads
• Dashboard
• Account Details

3. Style the Layout
Customize the design however you want using Divi.

4. Save the Layout to Divi Library
Save the section, row, or layout.

5. Insert It Into an Endpoint
Go to: Divi My Account Page → Choose Endpoint

Then load the saved Divi Library item into:
• Before Content
• After Content

My Account Endpoint Content Module Settings #

Content Tab #

You can:
• Choose which endpoint content to display
• Preview different endpoints
• Add module backgrounds

Design Tab #

You can customize:

Module Styling
• Borders
• Paddings
• Margins
• Box shadows

Endpoint Content Styling
• Text
• Backgrounds
• Padding
• Content containers
Table Styling
Customize WooCommerce tables such as:
• Orders
• Downloads

Including:
• Borders
• Header styles
• Row styles
• Alternating row colors
• Buttons

Notification Styling
Style empty-state notices such as:
• “No orders yet”
• “No downloads available”
Form Styling
Customize WooCommerce forms including:
• Labels
• Input fields
• Buttons
• Backgrounds
• Borders

Additional Divi Options #

The module also supports standard Divi options such as:
• Sizing
• Transform
• Animation
• Spacing

Pin It on Pinterest