Mar 12, 2021 | Divi Resources

Divi Plus Modules for WooCommerce

Divi Plus adds lots of modules, extensions, and layouts to Divi. Three of those modules were designed specifically for WooCommerce. In this article, we’ll look at these three WooCommerce modules and see what they can do.

Divi Plus WooCommerce Woo Products

Woo Products

The Woo Products module Displays WooCommerce products in several different layouts. It provides adjustments for the content, how it displays, backgrounds, and more. This example shows Content options. Choose the view type (featured, sale, bestselling, or best rated), the number of products to show, their order, categories, etc.

Display options let you choose the number of columns, spacing, show masonry, thumbnails, price, add to cart, sale badge, and show amount or percentage off. I’m displaying 2 columns and showing the cart and sale badge. I’m hovering over the second item to show the add to cart button.

Background adjustments control the color behind the text and the product cards.

Styling options make it easy to match the module to your website. Style the text, badge, cart button, and more.

Here’s the design within the Divi Online Store layout. I’ve styled it to match the layout.

Divi Plus WooCommerce Woo Products Carousel

Woo Products Carousel displays the products within a slider. It includes the same settings as the Woo Products Module except for the layout options. Instead, it provides slider options.  

Slider effects include:

  • Slide – slides the products as a regular slider.
  • Cube – rotates the product as if it were the side of a cube.
  • Coverflow – tilts the products on the sides toward the center product.
  • Flip – spins the product around to show the next product.

Select the number of slides that display and enable loop, autoplay, adjust the speed, transition, show arrows, show dots, and more.

Adjust colors and styles for each element in the Design tab. In this example, I’ve changed the colors for the title background and the add to cart button. I’ve also added arrows and dot navigation.

This example shows the Woo Product Carousel in the Divi Leather Company layout. I’ve added arrows and dots for navigation and increased the size of the arrows. The colors are from the layout. I’ve changed the sale badge to display the percentage off. The button includes a background image from the layout.

Woo Products Categories

Woo Products Categories displays the categories with featured images, a title, and the number of items. It has two layouts. Choose the number of columns, spacing, enable masonry, show thumbnails, and show the product count. This is Layout 1 with 4 columns. You can disable the image and product counts.

Layout 2 adds a border. This example displays 2 columns.

This example shows layout 1 with 4 columns in the Stationary layout. I’ve styled it to match and added a box shadow to make it stand out.

Purchase Divi Plus

We’ve looked at only three of the many modules and extensions available in Divi Plus. For access to these WooCommerce modules and many more features, purchase Divi Plus today. There are several purchase options to choose from:

  • Single Site Bundle – $59
  • Extended Bundle – $149
  • Agency Bundle – $199

Have you tried the WooCommerce modules in Divi Plus? Let us know what you think about them in the comments.

Posted By:
Randy A. Brown
Randy A. Brown is a freelance writer from east TN specializing in WordPress and eCommerce. He's a longtime WordPress enthusiast and loves learning new things and sharing information with others. If he's not writing or reading, he's probably playing guitar.


Submit a Comment

Your email address will not be published. Required fields are marked *


Submit a Comment

Your email address will not be published. Required fields are marked *

How to Edit Images with Divi AI Image Editor

How to Edit Images with Divi AI Image Editor

AI revolutionizes image editing with automated enhancements, object recognition, and style transfer. If you want to minimize the hassles of using image editors, Divi AI offers an advanced AI image editor integrated with its builder to transform the images and make...

Divi WooCommerce Extended

Popular on Divi Extended

Divi Plus WooCommerce Extended Divi Layouts Extended Divi Header Layouts