When you go through the pages of an online store in order to select several purchases, it is convenient at any time to quickly see what you have already added to the cart. So that you can quickly change the quantity of each item in the cart or remove something unnecessary from it. And at the same time, stay on the same page – without going to the basket. You can add such convenience for visitors to your online store using the plugin “Mini-cart”. Therefore, today we will learn how to add and make a shopping cart design on our page.
How do I add a shopping cart to my website?
For the plugin to start working, in its settings, you need to move the “Enable hook (frontend_header)” slider to the “ON” value.
This will connect the plugin to the store design theme, and when you hover the cursor over the basket area, an additional block with information about the contents of the basket will begin to pop up on the storefront.
The information block will appear if there is at least one item in the cart. It makes sense: why show an empty “Your cart is empty” rectangle?
On tablets and smartphones, where there is no cursor, you need to click on the trash can indicator for a pop-up block to appear.
Pop-up block design
By default, the pop-up block has 2 well-visible buttons: “Open cart” and “Checkout”. Any of the buttons can be disabled in the settings. You can even turn off both buttons if it is more convenient for the customers of your store, in your opinion.
It is convenient to adjust the colors of the main elements of the pop-up block directly in the plugin settings.
The list of basket items in the pop-up block is shown in 3 lines. If there are more items in the cart, then the rest can be viewed using the scroll bar. The standard number of lines (3) that are initially visible can be increased to 5 in the plugin settings.
If you need to further reduce or increase the number of lines, then this can be manually adjusted in the HTML / CSS / JavaScript code – for this, the plugin settings have the ability to edit design templates.
You can choose to have the pop-up block appear only when you click on the trash area, rather than on hover – just like on mobile devices. Or you can choose the opposite, more aggressive behavior: so that the pop-up block always opens itself immediately. This setting will only work on desktop computers. There is an auxiliary setting for it: after how many seconds, automatically hide the automatically appeared pop-up block.
The plugin can be embedded on other pages of the site, not only on the storefront – those that are formed by the applications “Site”, “Photo”, “Blog” and others. To do this, just copy the code snippet from the plugin settings and paste it into the right place in the design template of the corresponding application. For help in finding this desired location, we turn to the plugin developer.
This is what the settings page for the current version of the plugin looks like, which we studied while writing this review.
Conclusion
A useful addition to the standard functionality of the design theme to increase the conversion of your online store. The plugin uses the well-known trading rule: the less effort (including mental) a customer has to make, the easier it is for him to make a purchase decision and the more money he will eventually spend.
The plugin does not yet have separate settings for different storefronts – all settings are applied the same for all storefronts if you have several of them. If you need different behavior or appearance for individual storefronts, this can almost certainly be done manually – in the source code of the templates, which can be edited in the plugin settings.
However, we all understand that the profit depends on how well the site is made. Therefore, it is best to contact Fireart professionals who will help you complete any task. And then you can definitely be sure of a good result.
-5.jpg?crop=entropy&cs=tinysrgb&fm=jpg&ixid=MnwyNjYzNTl8MHwxfGFsbHx8fHx8fHx8fDE2NTMxMDQ0Njc&ixlib=rb-1.2.1&q=85&raw_url=true&fit=crop&w=120&h=86)
