WP SITES

Log in

Add WooCommerce Cart Count & Total Price To Genesis Nav Menu

—

by

Brad Dalton

This code adds the cart count & total price to the nav menu in Lifestyle Pro.

The solution uses Dashicons which modern HTML 5 Genesis child themes load by default.

Enables dynamic updating of item count & total price using Ajax when the Add To Cart button is clicked without the need to refresh the page.

Tested using the Genesis Sample & Lifestyle Pro child themes by StudioPress. Should work in any HTML 5 child theme without modification.

Demo Video #

Shows the cart icon added before the cart count & price total linked to the cart page updating dynamically using Ajax in the Primary and secondary nav menu of the Lifestyle Pro child theme for Genesis.

Installation #

There’s 2 steps relating to usage of the code in the download folder :

Step 1 : Copy & paste the PHP code from the functions file to the end of your child themes functions file.

Step 2 : Copy & paste the CSS from the style.css file to the end of your child themes style sheet and clear caching.

Register or login to access the download folder :

Download Folder

Note : Requires the activation of both the WooCommerce & Genesis Connect for WooCommerce plugins.

Related Tutorials

Comments

8 responses to “Add WooCommerce Cart Count & Total Price To Genesis Nav Menu”

  1. Chris Martin Avatar
    Chris Martin

    Kind of bummed I can’t add this to the genesis sample theme. There are no widget options for the nav. I added a secondary menu to the header, I saw a way of doing it without a widget, but couldn’t get it to work.

    1. Brad Dalton Avatar
      Brad Dalton

      Hi Chris. Works perfectly. Did you see this? https://i0.wp.com/wpsites.net/wp-content/uploads/2018/08/genesis-sample-theme.png

      What version of Genesis Sample are you using and which nav menu did you want to add it to?

      Note : Requires the activation of both the WooCommerce & Genesis Connect for WooCommerce plugins.

      Also note, this code snippet adds the cart to the nav menu not the widget menu.

      Code emailed installed in genesis sample.

  2. James Hahn II Avatar
    James Hahn II

    Excellent. Requesting now!

  3. James Hahn II Avatar
    James Hahn II

    Morning, Brad! Can you tell me how to hook into Carrie Dils’ Utility Bar right area?

    1. James Hahn II Avatar
      James Hahn II

      Sorry, forgot the link.

      https://carriedils.com/widget-area-above-header-genesis/

      1. Brad Dalton Avatar
        Brad Dalton

        Hi James. What do you want to hook in? It uses genesis_before_header. I assume you want to hook in the WC cart?

        1. James Hahn II Avatar
          James Hahn II

          Right. Looking to place the cart next to the “Buy Now” button in the utility-bar-right before the header here.

          https://deathintexasmovie.com/

          There’s already way too much going on in this nav for a movie website, so trying to fit the login & shop links up there. Tried a few solutions, but my PHP ain’t on your level. haha

          1. Brad Dalton Avatar
            Brad Dalton

            James. This type of modification requires at least an hours work. You can request a custom tutorial. The price is $75.

Leave a Reply

Join 5000+ Followers

Get The Latest Free & Premium Tutorials Delivered The Second They’re Published.