Users like to be able to view both the number of items and the total value that they have in their cart. If you can display this information on every page, then users won't have to constantly check the cart page. They should have to spend less time double-checking their numbers and get through your site quicker. This should improve your conversion rates.
Before we begin, you should have a menu already created in WordPress. We'll be adding the cart icon to that menu.
The following steps demonstrate a plugin that allows you to add a cart icon to the menu and provides several options that you can customize:
- In the WordPress admin, click on the Plugins menu and then on Add New.
- Run a search for the
WooCommerce Menu Cartplugin. - Install and activate the plugin.
This plugin works for WooCommerce and other WordPress e-commerce platforms. That's great, but it does mean that the settings are a bit harder to find.
- Go to Settings | Menu Cart Setup.
- Leave the Select which e-commerce plugin you would like Menu Cart to work with setting set to WooCommerce.
- Enter the menu you wish to add this cart to in the Select the menu(s) in which you want to display the Menu Cart field.
- You can optionally display the cart when it's empty by checking the Always display cart, even if it's empty field.
- Enable the cart icon by checking the Display shopping cart icon field.
- You can optionally change the alignment of the cart by choosing one of the options for the Select the alignment that looks best with your menu setting.
- Click on Save Changes.
If you go to the frontend of your site and add a product to your cart, you should see the new cart icon in the menu.
If you want to make the cart icon even more noticeable, you can use CSS to style that menu item. You can apply CSS to the
wpmenucartli class.
There is a pro version of this plugin available (as if you didn't see all of the annoying promotions in the settings page). I haven't personally felt the need for it, but there are more options if you need them.