Divi WooCommerce Prolonged is a third-party plugin for Divi with the serve as of being the only instrument you’ll want to assemble eCommerce web websites with Divi. It accommodates 5 modules with plenty of choices and possible choices. In this publish, we’ll check out Divi WooCommerce Extended to lend a hand making a decision if it’s the fitting product to design your WooCommerce retailer.
Divi WooCommerce Extended Modules
Divi WooCommerce Extended supplies 5 modules to the Divi Builder. The modules can be used together, independently, on product pages, retailer pages, and commonplace pages.
- Mini Cart
- Speedy View
- Product Carousel
- Ajax Search
- Tab Manager
- Checkout Manager and
- Divi Library Shortcode Extension
We’ll take a better check out each module, all through the eyes of our Perfumery Format Pack.
Divi WooCommerce Extended Mini Cart
The Mini Cart Module provides plenty of display possible choices for the cart icon. For the icon type, choose between Divi’s native icons or a custom designed icon. The native icons include an icon picker.
The custom designed selection signifies that you’ll make a selection an icon or image from your Media Library.
The mini cart can display as a dropdown, overlay, off canvas, or modal. Reason possible choices include click on on or hover. Placement possible choices include the absolute best or bottom and at the correct or left. You’ll have the ability to moreover add a reputation and make a selection the elements that display from a listing.
Text possible choices include the view cart button, checkout button, and empty cart text. It moreover includes a separate selection for the cart background.
The Design settings permit you to customize the icon color, dimension, line top, text shadow, fonts, and so forth. It accommodates possible choices for the entire text along with the product rely, mini cart title, product name, quantity, and price, subtotal. It moreover accommodates settings for the view cart button, checkout button, empty cart, cart sizing, and standard settings. For this example, I’ve changed the icon color and dimension and added a text shadow. The text possible choices don’t show throughout the Visual Builder, in order that you’ll have to look them on the front end.
Mini Cart Examples
This example shows Dropdown. I’ve added a DWE Products Module and added a few products to my purchasing groceries cart. The number of items throughout the cart turns out above the cart icon. After I click on on on the cart, a dropdown opens to show the contents of my cart. The entire elements may also be styled. I’ve changed the color and dimension of the cart, added a shadow, changed the font and larger the size of the fonts. I’ve moreover styled the buttons to test the buttons within the construction pack.
This example shows Overlay. You’ll have the ability to place it in any of the 4 corners of the show.
This example shows Off Canvas. The show is pushed to a minimum of one facet for the reason that contents are locked into place. Clicking any place on the show closes the window. It can be situated at the correct or left facet of the show.
This example shows Modal. It presentations the cart content material subject material over the show and accommodates adjustments to show the close button, the close button position, decided on close or esc, and close on background click on on.
Divi WooCommerce Extended Product Ajax Search
Divi WooCommerce Extended Product Ajax Search supplies an absolutely customizable product search. The Configuration customizations include the search field placeholder, number of search results, order by the use of, order, and the text for no results.
For the search space, you’ll make a selection where the module will perform the search. You’ll have the ability to use the ones settings to make the search as huge or as narrow as you wish to have.
The display possible choices permit you to make a choice what to show. You’ll have the ability to show the search icon, make a selection the fields, make a selection the number of columns, and make a selection the column spacing. You’ll have the ability to moreover show or duvet the scrollbar.
It accommodates plenty of background possible choices that include the search end result box background, search end result products background, and commonplace background settings.
The Design settings include the entire font adjustments, borders, backgrounds, and so forth. Regulate the fields, search icon, loader, and further. In this example, I’ve changed the fonts and styled the search icon. I’ve moreover rounded the corners and altered the colors.
Product Ajax Search Examples
Proper right here’s how the search results look with the default settings of 1 column using my design settings from the example above.
This example shows 2 columns.
Divi WooCommerce Extended Products
Divi WooCommerce Extended Products presentations the WooCommerce products as taking part in playing cards inside of a grid. It’s completely adjustable with plenty of view varieties and layouts. This example uses the default view type and construction 1. You’ll be in a position to make a choice the number of products to turn, add an offset amount in case a product is already being displayed in another module and set the order possible choices.
For the view type, make a selection the default selection or make a selection to show featured products, sale products, best-selling products, or top-rated products.
It accommodates 3 construction possible choices. They place the elements in a lot of puts within the taking part in playing cards. Structure 1 places the price above the add-to-cart button. This example shows construction 2, which places them side-by-side.
Structure 3 places the add to cart button above the title.
You’ll have the ability to show or duvet the out-of-stock products. Whilst you duvet them, you’ll label them as out-of-stock if you wish to have or add any label you wish to have to use. You’ll have the ability to moreover make a selection the types and tags to include and make a selection the taxonomy relation for some commonplace sense control.
The display possible choices permit you to make a choice the number of columns, the gap between the columns, show masonry, show a sorting dropdown, display a quick view link, add speedy view text and an icon, make a selection which elements to show, add zoom effects, make a selection the thumbnail dimension, and a lot additional. You’ll have the ability to permit any of the elements in my opinion, so that you’ll disable the images, sale badge, and so forth. I’ve changed this example to 2 columns, styled the Sale label and customized the button.
Pagination supplies internet web page numbers. You’ll have the ability to moreover permit the previous and next links and add the text you wish to have them to turn.
The product background settings control the background for the text space of the card.
The Design settings permit you to keep an eye on every phase independently. You’ve got entire control over the sizes, colors, fonts, backgrounds, borders, and so forth. I’ve adjusted quite a lot of the settings in this example.
Divi WooCommerce Extended Products Carousel
Divi WooCommerce Extended Products Carousel items the WooCommerce products inside of a slider. It accommodates the equivalent settings for the reason that WCE Products Module and gives those for the carousel. You’ll be in a position to select the product type, construction, amount to turn, the sorting order, duvet products out of stock, make a selection categories, and so forth.
The entire display possible choices are also the equivalent. Show a quick view button, make a selection the elements to show or duvet, add text, and show the sale badge.
It doesn’t include pagination. Instead, it has slider possible choices. Select the slide have an effect on between Slide, Cube, Coverflow, and Flip. Each and every of the selections has different settings. Select the number of products to turn inside of a slide, keep an eye on the gap between the slides, equalize the heights, permit loop, permit autoplay, keep an eye on the speed, and so forth. This example shows Coverflow.
The slider moreover accommodates the standard kinds of navigation. You’ll have the ability to show them or disable them. You’ll have the ability to moreover make a selection the arrows from the tick list of icons, show them splendid on hover, and make a selection their position from 8 possible choices. This shows the default selection throughout the slider. This example shows Arrows in their default position.
This example shows the arrows throughout the top center.
It moreover accommodates dot pagination with 6 types to choose from. This example shows Cast Dot.
This example shows Rounded Line.
It moreover has an selection referred to as Dynamic Dots. This changes the sizes of the dots to show those closest to the current slide are higher than those which can be further away.
The Design settings include possible choices for every a part of the slider. I’ve adjusted font colors, background colors, borders, arrows, and dots in this example.
Divi WooCommerce Extended Products Categories
Divi WooCommerce Extended Products Categories creates taking part in playing cards that represent each of the types in your WooCommerce retailer. It accommodates 2 layouts, and also you’ll make a selection the types you wish to have to turn. This is construction 1. It places the title and number of items in that elegance underneath the featured image for the category.
This is construction 2. It places the title and number of items over the image and presentations the card as an outlined sq..
The display possible choices include the number of columns, column spacing, masonry, thumbnail, zoom have an effect on, thumbnail dimension, and product rely.
The background settings place a background color behind the title and product counts.
Proper right here’s how the background seems to be like with construction 2.
The design settings include possible choices for the entire elements. In this example, I’ve adjusted the text colors, sizes, weights, spacing to test the styling we’ve used across the internet web page template and from the Perfumery Structure Pack.
Where to Gain Divi WooCommerce Extended
Divi WooCommerce Extended is available throughout the Divi Market for $59. It accommodates infinite usage, 1 12 months of beef up and updates, and a 20-day money-back ensure that.
That’s our speedy check out Divi WooCommerce Extended. The ones 5 modules add a lot of choices to Divi for building retailer pages to your WooCommerce products. I’ve splendid touched on the main choices and it’s easy to look how difficult it’s. Whilst you’re hooked in to together with new choices to your WooCommerce retailer, Divi WooCommerce Extended is price a look.
We want to listen from you. Have you ever ever tried Divi WooCommerce Extended? Let us know what you imagine it throughout the comments.