Divi is a wonderful theme to construct on-line retail outlets. It integrates completely with WooCommerce and the store module may also be styled similar to any Divi module. There are many on-line retail outlets constructed with Divi to encourage you in your subsequent Divi design. On this article we’ll take a look at 14 Divi internet sites that experience wonderful retailer designs.
I’m having a look on the design of the store module throughout the structure, person product pages, overlays, use of pictures, colours, fonts, and so on. I’ll display a picture of the store or product web page and talk about what I favored about it. The internet sites are in no explicit order. Hang out till the tip for a couple of hyperlinks that can assist you design your personal wonderful retailer designs.
1. Divi Keys
This one makes use of the Divi Builder to taste the product pages, which position the goods over a styled background with a boxed shadow. The entire product parts are styled with Divi together with the textual content, buttons, gross sales badge, and critiques. Clicking at the featured symbol zooms the picture within its field whilst clicking the magnifier opens a full-screen gallery.
2. Throne Liquids
This store module presentations merchandise over a black background. The product photographs additionally use a black background and mix completely. The goods show the identify in white and use a depressing inexperienced button that fits the site’s styling. This website online has one of the crucial distinctive product pages that I’ve noticed. It presentations a picture of the product’s field, however then on scroll it finds the product in parallax. As you still scroll the product’s description scrolls over the background with an overlay so you’ll be able to nonetheless see the product beneath the textual content.
I would like one. Ok, now that that’s out of the way in which… This store web page presentations merchandise in 4 columns that take the overall width of the site. They come with a purple overlay icon that fits the fonts and highlights of the site. The product pages additionally show in full-width. I really like the usage of huge photographs and blank product images. I’m pondering perhaps a Move Max 20D+.
4. Tarte and Berry
This one kinds the fonts and overlays to check the site’s branding. The font styling even continues into the sale badge, which makes use of a darker background and a lighter colour of the similar font. The overlay presentations a styled icon. The product web page contains an enchanting purchase it now button with an animated icon and gradient hover results.
This store module suits properly with the web page structure. It makes use of a faint blue overlay and opens the product inside of a popup on click on, permitting you to peer the product main points, make alternatives, and upload it on your cart with out leaving the store web page.
6. Superior Industry Store
This one puts the store module over the parallax background. Many pieces have a featured symbol that fits the artwork taste of the site. It additionally contains styled fonts and an identical overlay icon. The product pages additionally come with the parallax background and styled fonts.
7. The Bro Basket
This store web page contains hyperlinks to a number of classes the use of huge icons and textual content. It additionally has a seek function. The product class pages come with a styled sidebar that presentations classes and seek. The goods come with styled borders, a hover icon, textual content that adjustments colour on hover, and a celebrity rankings device. The product pages show in full-width.
8. Coco Cuscino
This structure contains a variety of styled parts as hyperlinks to buy classes. They come with photographs, textual content, dividers, and buttons. The goods come with styled border and buttons. The person pages show in complete width and come with field shadow for the product photographs, a styled divider, and a styled button.
9. Diamonds and Muffins
This web page makes use of photographs with styled backgrounds and textual content as hyperlinks to the particular classes. The store web page presentations every product inside of a styled phase which incorporates 3 photographs, product knowledge, and a button. The product pages are in full-width and come with 3 columns with textual content and two columns with a multi-column structure that features a video, textual content, and symbol. I really like the typography for this website online.
10. Maison Flora
This one presentations the store module inside of a styled row with a boxed shadow impact. The textual content and buttons are styled black to check the corporate’s branding. The goods use a quite darkish overlay with a singular rose icon. The product pages use grey styling for the highlights and in addition features a styled store module to show equivalent merchandise.
11. Wood Makings
This one presentations the goods at the homepage as photographs with a shadow impact and a value. Soaring over the picture zooms each the product and its shadow. Clicking on a product opens a product web page with photographs in a slider and an outline, and highlights the product’s icon within the menu to the left.
12. Aurora Suspended Fires
This one makes use of a blank design for the two-column store module, which presentations a big symbol over the name, textual content, and button for every merchandise. The product web page presentations a picture slider, the entire anticipated textual content, styled buttons, toggles for the pricing knowledge through nation, embedded video, and any other spherical of toggles for the entire details about the product.
13. Squatty Potty
This store module makes use of some fascinating gross sales badges. The product photographs give you the colour and come with titles and an overlay. The gross sales badges are rounded buttons with the fee and textual content. The product pages are full-width and come with value and button styling. The product description house features a slider powered through Pixlee.
14. Hipstyle Store
This one presentations merchandise and classes a number of other ways at the homepage beginning with the slider within the hero phase. Subsequent is an alternating structure with a big symbol and textual content on one facet for the class and a store module at the different facet exhibiting merchandise in two columns. Subsequent is a store module exhibiting in 4 columns with a shadow impact for every product with a buying groceries button within the overlay. The product pages are in complete width and come with some fascinating fonts.
That’s our take a look at 14 Divi internet sites with wonderful retailer designs to assist encourage you in your subsequent Divi site. For much more assist along with your Divi retailer designs there are many articles right here on the ET weblog. Listed here are simply some of the many articles within the weblog:
- How to Add Vehicle Parts Search to Divi’s Auto Repair Layout Pack Shop Page
- How to Add Wholesale Options to Your Divi & WooCommerce Powered Shop
- How to Add Product Wishlists to Divi’s Cosmetics Shop Layout Pack
- How to Turn Your Shop into a Multi-Vendor Marketplace using the Divi Photo Marketplace Layout Pack
- How to Set up In-Store Pickups for Online Orders with Divi’s Free Coffee Shop Layout Pack & WooCommerce
- How to Integrate Your Etsy Shop into Your Divi Website
- 5 Beautiful Ways to Style Divi’s Shop Module
- How to Design Custom Account Pages for WooCommerce, EDD, Memberpress, and more with the Divi Builder
- How to Style a WooCommerce Product to Show Text Instead of an Icon on Hover in Divi
- Getting Started with Divi and WooCommerce
We wish to pay attention from you. Which of those retailer designs are your favorites? Tell us within the feedback.WordPress Web Design