Here is a way to add WooCommerce cart icon to a menu with the cart item count, it links to the cart page and displays the number of items that have been added to the cart.
The code uses three functions which need to be added to functions.php and some CSS in style.css.
(If you just want the icon only – the process is a lot easier)
Create a shortcode for the WooCommerce cart, this can be appended to a menu or just added anywhere in your theme templates or hooked in with actions in the theme.
Create Shortcode
The shortcode, in this case, would be [woo_cart_but]
Filter to enable Ajax on the Cart Count
Add a filter to get the cart count to update when it changes using the Ajax fragments.
Add Cart Icon to an existing menu
The third code snippet it to add to a menu using a variant of wp_nav_menu_items the variant being to specify an actual menu in the filter, in the example the menu has an id of ‘top-menu‘ – so the filter name can be adjusted like so wp_nav_menu_top-menu_items
If your menu had the ID of primary-menu – the filter name would be changed to wp_nav_menu_primary-menu_items etc
(Add Cart Icon by itself)
If you wanted the Cart Icon by itself (not in a menu) – you can use the shortcode or for PHP template files you can use do_shortcode
<?php echo do_shortcode("[woo_cart_but]");?>
Add CSS
Finally, add some CSS…
That’s it a working icon with cart count items displaying.
Display Icon Only
If you don’t care for the cart count functionality the process is a lot easier, you simply add the Cart page to the desired menu in WordPress menus and add the icon code in the Navigation label.
In the above, a Fontawesome 5 icon is being used as it is already loaded in the theme.
