How to Build a Divi WooCommerce Store

5/5 - (1 vote)

The short version

A Divi WooCommerce store is two products doing two jobs. WooCommerce owns the data and the transaction — products, stock, tax, shipping, payment, order emails. Divi owns the appearance of four page types, through the Theme Builder: the shop archive, the single product page, the cart and the checkout. Everything else on the store either belongs to WooCommerce or is not templated at all.

Build in that order. Install and configure WooCommerce first, add one real product, then template the four pages in Divi. Doing it the other way round means designing pages before you know what data they have to display.

This guide covers how to build a Divi WooCommerce store using Divi’s Theme Builder rather than a one-off shop page. It is written against WooCommerce 11.0.1 and the Divi 5 release line, both read on 1 September 2026, and it says where the split between the two products leaves gaps you have to fill yourself.

Diagram showing which pages of a Divi WooCommerce store are built in Divi and which stay in WooCommerce
Divi controls four page types. My Account and order emails stay with WooCommerce. Built from the WooCommerce plugin directory listing and Elegant Themes documentation, read 1 September 2026.

What a Divi WooCommerce store actually needs

Two things, and one of them is free. WooCommerce is the store engine: it adds the product post type, the cart and checkout flow, tax and shipping rules, and the transactional emails. As listed on its WordPress.org plugin page on 1 September 2026, WooCommerce is at version 11.0.1, has 7+ million active installations, requires PHP 7.4 or higher, is tested up to WordPress 7.0.4, and holds a 4.5-star rating across 4,820 reviews. It is the default answer for WordPress commerce not because it is the most elegant but because it is the one everything else integrates with.

Divi is the design layer. It does not process a single order. What it gives you is the Theme Builder, which lets you replace WooCommerce’s default templates with layouts you design, and a set of WooCommerce modules that pull live product data into those layouts. Divi is a paid theme with unlimited-site licensing — the plans and current prices are in our Divi theme review, and the discount question is answered honestly on our Elegant Themes coupon page.

If Divi is not on the site yet and the upload is refusing, the cause is almost certainly one of six things — we list them all in why a Divi theme installation fails and how to fix each cause.

The versions this guide is written against

Component Version read 1 September 2026 Source Cost
WooCommerce 11.0.1 — 7+ million active installs, PHP 7.4+, 4.5 stars / 4,820 reviews WordPress.org plugin directory Free (extensions are not)
Divi 5.11.1, released 19 August 2026. Divi 5 shipped 26 February 2026 Elegant Themes changelog and release announcement $89/year or $249 lifetime, unlimited sites
Divi 4 Still on its own update channel Elegant Themes migration guide Supported “at least 12 months” from 26 Feb 2026

One version detail matters more than it looks: Divi 5.11, released 15 August 2026, specifically lists a WooCommerce 11.0 compatibility fix in its release notes. If you are running a Divi store on an older Divi 5 build against current WooCommerce, that is the first thing to update.

Step 1: install WooCommerce and run the setup wizard

Install WooCommerce from Plugins → Add New and let the setup wizard run. It asks for four things, and all four are worth getting right the first time because two of them are painful to change later.

  1. Store address and currency. These drive tax calculation and the currency symbol everywhere. Changing currency after you have taken orders leaves historic orders in the old currency and reporting in the new one.
  2. What you sell — physical products, digital products, or both. This decides whether shipping fields appear at checkout.
  3. Shipping. You can skip it in the wizard and configure zones later, and for anything beyond one flat rate you will.
  4. Payments. The wizard offers a short list; the full range is much wider, and which gateways are actually available to you depends on your country. We cover the field, including which plugins have been closed by WordPress.org, in our review of WordPress payment gateway plugins.

The wizard creates four pages automatically: Shop, Cart, Checkout and My Account. Do not delete or rebuild these from scratch. WooCommerce identifies them by ID in its settings, and a “new” checkout page that is not the one WooCommerce has registered will render as an empty page with no explanation. If you need the longer version of this setup, we have a dedicated walkthrough in how to set up a WordPress eCommerce site with WooCommerce.

Step 2: add your first product before you design anything

Go to Products → Add New and create one complete, realistic product: title, long description, short description, a featured image, at least two gallery images, a price, stock status, and a category. Not a placeholder — a real one.

The reason is practical rather than pedantic. Every Divi module you are about to place pulls its content from these fields. Design a product template against an empty product and you will build a layout that assumes a two-line description and a single square image, then discover it collapses on the product that has eight paragraphs and a portrait photograph. Building against one real product surfaces those problems in ten minutes instead of after launch.

Assign a category while you are there. The Shop module and the Theme Builder’s loop both filter by category, and a store where everything sits in “Uncategorized” cannot be arranged at all.

Step 3: build the shop page with Divi’s WooCommerce modules

There are two routes, and they are not equivalent.

The quick route is a normal Divi page with the Shop module dropped into it. Create a page, build it with Divi, insert the Shop module, and set which products it shows — recent, featured, best selling, on sale, or a specific category — along with the number of products and columns. It is fast, it is fine for a landing page or a “featured products” strip on the homepage, and it is the wrong tool for your actual shop page, because it produces a static selection rather than a proper product archive with pagination and filtering.

The route that scales is the Theme Builder. Go to Divi → Theme Builder, add a new template, and assign it to All Product Category Pages and the shop archive. Now you are designing the template WooCommerce uses for every product listing, and the products flow into it automatically as you add them. This is what “using the Theme Builder” means, and it is the difference between a store you can add fifty products to and a page you have to re-edit every time the catalogue changes.

If customers need to narrow a large catalogue, neither route gives you faceted filtering on its own — that is an extension question, and we looked at one option in our WooCommerce Product Filter review.

Step 4: template the product, cart and checkout pages

Still in the Theme Builder, add a template assigned to All Products and edit its body. Divi’s WooCommerce modules map one-to-one onto the parts of a product page: Product Title, Product Images, Product Price, Add to Cart, Product Description, Product Tabs, Additional Information, Product Rating, Breadcrumb, Related Products, Stock, Meta and Upsells. Place the ones you want, in the order you want, styled how you want. Anything you leave out simply does not appear. A product template you have refined on one store can be exported from the Divi Library and loaded into another; our guide to importing and exporting Divi layouts covers the JSON round-trip and which settings do not travel with it.

Two constraints are worth knowing before you start rather than after.

First, Add to Cart is not optional in any meaningful sense. Omit it and the product page is a brochure. It is easy to leave out by accident when you are designing a visually led template and working from the top down.

Second, the cart and checkout templates carry more risk than the product template. A product page that looks wrong costs you a sale; a checkout that behaves wrong costs you every sale. Build the checkout template last, test a complete purchase end to end with a real payment method in test mode, and confirm the order appears in WooCommerce → Orders and the customer email arrives before you consider it finished.

That email is the boundary worth naming plainly, because it surprises people: Divi does not touch WooCommerce’s transactional emails. Order confirmations, shipping notifications and password resets are styled in WooCommerce → Settings → Emails, or by overriding WooCommerce’s email templates in a child theme. No amount of Theme Builder work changes what lands in the customer’s inbox. The My Account pages are in the same position unless you template them explicitly.

What changed for a Divi WooCommerce store in Divi 5

Divi 5 shipped as the official release on 26 February 2026, according to Elegant Themes’ own release announcement, and the WooCommerce side of it has moved steadily since. The Theme Builder survives the transition and works the same way conceptually. Three things are genuinely different.

The Loop Builder replaces a lot of module-wrangling. Divi 5’s loop system lets you design one card and repeat it across a query, which is a better fit for a product archive than the fixed Shop module ever was. Elegant Themes added Loop Filter modules, including a Post Filter module, on 25 August 2026.

There are more commerce-adjacent modules. The 13 August 2026 release added four, including a native Gravity Forms module and a Payment Button module.

Third-party WooCommerce modules are the migration risk. Divi 5 keeps unsupported third-party modules working by wrapping them in a Divi 4 compatibility layer — but any page containing one loads the entire Divi 4 framework alongside Divi 5. On a store, those pages tend to be the product and checkout templates, which are exactly the pages where speed converts to revenue. Elegant Themes’ own migration documentation also carries a step that is not reversible: after installing Divi 5 and before running the Divi 5 Migrator, opening a page in the builder converts it permanently, with no rollback. On a live store, run the Migrator on a staging copy first. The full decision is in whether you should update to Divi 5 yet.

Where this setup loses

Speed. A page builder plus WooCommerce is a heavy combination, and a Divi store is not going to beat a purpose-built lightweight theme on raw load time. If the store is already slow, the causes are usually specific and fixable rather than inherent — why a Divi site runs slowly covers them. Do that work before you add extensions, not after.

Lock-in. Divi stores layouts in its own format. Theme Builder templates are Divi objects, not WordPress templates, so leaving Divi means rebuilding every one of them. That is a larger commitment on a store than on a brochure site, because there are more templates and they are load-bearing. We compare the trade-off directly in Beaver Builder versus Divi on cost, speed and lock-in.

Costs that are not the theme. Divi’s $89 a year covers unlimited sites, which is genuinely good value. WooCommerce is free. The bill arrives in extensions: subscriptions, bookings, advanced shipping, faceted search and most serious payment integrations are separately priced, usually per site per year. Budget for the extensions rather than the platform. Our roundup of must-have WooCommerce plugins is the place to start, and if you are still choosing a platform at all, the WordPress eCommerce plugins compared is the wider view.

The design ceiling is real but far away. Divi will not give you a bespoke checkout flow or a configurator. What it gives you is control over the presentation of a standard WooCommerce store, which is what most stores need.

See current Divi pricing at Elegant Themes
Affiliate link — WPNeon earns a commission if you buy through it, at no extra cost to you.

Frequently asked questions

Do I need the Divi theme, or is the Divi Builder plugin enough?

For a Divi WooCommerce store you want the theme. The Theme Builder, which is what templates the shop, product, cart and checkout pages, ships with the Divi theme. The standalone builder plugin edits page content inside another theme and does not give you template control over WooCommerce’s own pages.

Does Divi replace the WooCommerce shop page?

Only if you tell it to. Assign a Theme Builder template to the shop archive and product category pages and Divi’s layout replaces WooCommerce’s default. Without that assignment, WooCommerce renders its own templates and your Divi work never appears, which is the most common reason a store looks unchanged.

Can I style WooCommerce order emails in Divi?

No. Transactional emails are generated by WooCommerce and Divi has no involvement in them at all. Change the logo, colours and footer text under WooCommerce → Settings → Emails, or override WooCommerce’s email templates in a child theme for anything more substantial.

Will migrating my store to Divi 5 break it?

Native Divi content migrates cleanly. The risk is third-party WooCommerce modules, which keep working but force the whole Divi 4 framework to load on any page using them. Run the Divi 5 Migrator on a staging copy first, and do not open pages in the builder before running it.

How many products can a Divi WooCommerce store handle?

The limit is your hosting and your catalogue structure, not Divi. Templates built with the Theme Builder scale to any number of products because the content flows in from WooCommerce. Static Shop modules with hand-picked products do not, which is why the Theme Builder route matters past a dozen items.

Do I still need WooCommerce extensions?

For a simple catalogue with one payment method and flat-rate shipping, no. Subscriptions, bookings, product configurators, faceted filtering and most region-specific payment gateways are all separately purchased. That is where a WooCommerce budget actually goes.

Versions, prices and release dates on this page were read from the WordPress.org plugin directory and Elegant Themes’ pricing page, changelog and support documentation on 1 September 2026. If you administer several WordPress stores, our write-ups of which WordPress MCP servers are maintained and seven WordPress MCP plugins compared cover managing them through an AI assistant. Our method is set out at how WPNeon reviews WordPress products.