DiviCommerce is a third-party kid theme for Divi that’s designed for construction on-line retail outlets. It comprises quite a lot of pages and contours to create WooCommerce retail outlets that stick out from the group. On this publish, we’ll take a look at the pages and contours of DiviCommerce to lend a hand making a decision if it’s the precise Divi kid theme on your wishes.
Putting in DiviCommmerce
I discovered putting in DiviCommerce to be intuitive. Set up it like you can any WordPress theme however with Divi because the lively theme. Were given o Look > Topics > Upload New Theme.
Choose Add Theme, click on Make a choice Report, choose the DiviCommerce zipped report in your pc, and click on Set up Now.
Subsequent, click on Turn on.
In spite of everything, choose DC Demo Import > Simple Demo Import.
Make a choice the recordsdata to import and click on Import Demo Content material. I like to recommend the use of the default settings.
As soon as the demo content material imports, click on Take away Demo Content material & Import Purposes. Your web site now looks as if the demo with dummy pictures to turn the sizes wanted. Upload your content material and your web site is able to use.
DiviCommerce Pages
DiviCommerce comes with 26 pages that come with 6 house pages designed to create more than one forms of on-line retail outlets. It additionally comprises 3 store pages, 2 product pages, 2 checkout pages, 5 headers, 2 footers, and quite a lot of extras. Options come with Ajax product filters, cart popups, product Ajax seek, popup bureaucracy, and WooCommerce variation swatches.
Let’s check out the layouts. I’ll spoil the bigger layouts into smaller teams in order that they’re more uncomplicated to control and display pictures from the downloaded kid theme and the product demo.
DiviCommerce House One
The hero segment displays a full-screen symbol with a CTA.
Following it is a segment for brand new arrivals. This comprises hover results for the product playing cards. A two-column segment shows pictures that hyperlink to the store. The photographs come with the Ken Burns impact. Subsequent, is any other store segment with hover results. Right here’s the highest portion of the product demo.
The ground part of the primary house structure displays any other full-screen CTA, featured merchandise, a singular deal countdown, a weblog, and photographs.
DiviCommerce House Two
The second one house web page displays a full-screen slider with CTAs.
The highest part of the web page comprises CTAs to buy classes, a singular store segment with two merchandise on one facet and a CTA at the different, a store segment, and a full-width electronic mail signup shape. All of the product playing cards and buttons come with hover results.
The second one part of House Two displays a store segment, a deal countdown timer in a card over a full-screen background symbol, a weblog, and photographs.
DiviCommerce House 3
The highest part of House 3 shows a full-width CTA, a store segment with new arrivals, a bit with 4 pictures in two columns for class CTAs, and a large electronic mail shape.
The second one part of the structure shows segment store sections, a weblog segment with a background symbol, and a bit with buyer pictures.
DiviCommerce House 4
The fourth house web page features a distinctive hero segment with two pictures. One is longer than the opposite and the textual content and CTA overlap each pictures. It additionally comprises class pictures with the name on the backside of the cardboard and a store segment.
The second one part of the structure shows two huge class CTAs, a store segment, a deal segment with a countdown timer, and a weblog with a background symbol.
DiviCommerce House 5
The 5th house web page shows a full-screen hero segment with the CTA at the proper. It has a big segment of class pictures with 5 smaller pictures and 3 better pictures. 3 store sections display what’s new, what’s on sale, and the most productive dealers. This structure additionally comprises the full-width electronic mail shape and buyer pictures.
DiviCommerce House Six
The 6th house web page is essentially the most distinctive. It shows a sale countdown timer within the hero segment. Every of the store sections puts the name in huge textual content to the left of the segment. That is adopted via two symbol CTAs that come with the name and button that overlap the picture and each and every different. Every other class segment puts comprises pictures with field shadows that disappear on hover. This structure additionally comprises the e-mail shape and buyer pictures.
DiviCommerce Store One
The primary store web page shows a full-width symbol with a web page name adopted via the goods in 4 columns with a sorting clear out and a sidebar to the left. The sidebar comprises the class, dimension, and colour choices. Merchandise show a field shadow on hover.
DiviCommerce Store Two
Store Two features a full-width symbol, puts the goods in one column, and provides a captivating product clear out the place customers can clear out via class, dimension, and colour above the store segment. It additionally comprises the sorting clear out and provides pagination on the backside of the web page. The filters open on hover.
DiviCommerce Store 3
Store 3 doesn’t come with a full-width symbol. It puts the store classes on the best of the web page with pictures. The store segment comprises the sidebar, clear out, hover results, and pagination.
Product Web page One
The primary product web page shows a big, featured symbol at the left and the product choices at the proper. The product choices stay in position as you scroll. Breadcrumbs on the best of the web page display the purchasers the place they’re within the navigation construction.
Following the featured symbol is a suite of thumbnail pictures and any other huge symbol. As soon as the huge symbol reaches the world of the product choices, the choices scroll with the web page.
Subsequent is the outline and transport data and a bit for evaluations.
Finally, there’s a segment the place shoppers can upload their very own evaluations.
Product Web page Two
The second one product web page follows the design of the primary however provides the outline and transport data to the product choices space within the toggles.
The ground of the web page provides a bit of goods the buyer could be fascinated with. The product playing cards upload field shadows on hover.
Cart Popup
The cart popup seems when a product is added to the cart. It features a box so as to add a discount code, a slider with an identical merchandise, and a checkout button.
Cart Web page
DiviCommerce features a styled cart web page. The cart data features a field shadow. The buttons are pink to check the kid theme’s design.
Checkout Web page One
It has two checkout pages. That is the primary checkout web page. It puts the order and cost data at the proper of the checkout shape. The second one checkout web page puts this data below the shape and puts corporate data at the proper of the shape.
About Us
The About Us web page shows angled pictures that stand out. The web page additionally features a full-width symbol, a number of spaces for textual content, and a few better pictures.
Touch Us
The Touch Us web page shows the touch data with blurbs, shows a touch shape, toggles for the FAQs, and features a full-width map.
DiviCommerce Headers
DiviCommerce comprises 5 headers. They come with more than one sections that can be utilized, deleted, or swapped to any other header.
Header One
The primary header provides a sale bar on the best and features a seek, account login, and a hyperlink for the popup buying groceries cart at the proper. The brand and menu are at the left.
Header Two
Header two puts the quest field within the best bar. The buying groceries cart and menu switch aspects.
Header 3
The 0.33 header puts the menu in a brand new bar within the heart and on the backside and strikes the quest to the middle.
Header 4
The fourth header facilities the emblem and the menu, puts the quest at the left, and the cart at the proper.
Header 5
In spite of everything, the 5th header puts the quest field within the best bar, strikes the emblem and menu to the left, and puts the cart at the proper.
DiviCommerce comprises two footers. Each paintings neatly for eCommerce.
Footer primary comprises two sections. The primary segment comprises blurbs for info equipped as textual content. The second one segment comprises an Symbol Module for the emblem, a Social Media Observe Module, and quite a lot of Textual content Modules for info and hyperlinks.
The second one footer replaces the highest segment with an electronic mail shape. The second one segment strikes the Social Media Observe buttons to the precise in its personal column.
DiviCommerce Popup
DiviCommerce features a popup made with the Divi Builder and a plugin referred to as Popup Maker. The popup itself shows an electronic mail shape with a sign-up CTA on one facet and a picture at the different facet. It comprises an overlay and a detailed button.
DiviCommerce Seek
The Ajax seek lists the kinds and merchandise as you kind. The quest is rapid and the consequences keep open, permitting the buyer to click on anything else within the effects.
The place to Acquire DiviCommerce
DiviCommerce is to be had within the Divi Marketplace for $25. It comprises 365 days of toughen and updates, limitless site utilization, and a 30-day money-back ensure.
Finishing Ideas on DiviCommerce
That’s our take a look at the DiviCommerce kid theme for Divi. This kid theme comprises quite a lot of pages and layouts to construct any form of WooCommerce store. The 5 further plugins with the kid theme upload many attention-grabbing options, such because the cart, popups, and filters. The Ajax options are rapid They offer the site many sublime and helpful gear and stick out from the group.
We wish to pay attention from you. Have you ever attempted the DiviCommerce kid theme? Tell us what you take into accounts it within the feedback.
The publish Divi Product Highlight: DiviCommerce seemed first on Elegant Themes Blog.
Contents
- 1 Putting in DiviCommmerce
- 2 DiviCommerce Pages
- 2.1 DiviCommerce House One
- 2.2 DiviCommerce House Two
- 2.3 DiviCommerce House 3
- 2.4 DiviCommerce House 4
- 2.5 DiviCommerce House 5
- 2.6 DiviCommerce House Six
- 2.7 DiviCommerce Store One
- 2.8 DiviCommerce Store Two
- 2.9 DiviCommerce Store 3
- 2.10 Product Web page One
- 2.11 Product Web page Two
- 2.12 Cart Popup
- 2.13 Cart Web page
- 2.14 Checkout Web page One
- 2.15 About Us
- 2.16 Touch Us
- 3 DiviCommerce Headers
- 4 DiviCommerce Footers
- 5 DiviCommerce Popup
- 6 DiviCommerce Seek
- 7 The place to Acquire DiviCommerce
- 8 Finishing Ideas on DiviCommerce
- 9 Divi Product Spotlight: Header Format Pack
- 10 The usage of the Divi Name to Motion Module vs Separate Modules
- 11 Get a Unfastened Match Coordinator Structure Pack for Divi
0 Comments