• Skip to primary navigation
  • Skip to main content
  • Skip to primary sidebar

WP SITES

2784

Original Genesis Tutorials & 6000+ Guaranteed Code

Snippets

  • Consultation
  • Full Access
  • Log in

Add WooCommerce Cart To Nav Menu Widget In Genesis

This code adds the WooCommerce cart icon with the total amount of items and price to a navigation widget in the before header utility bar.

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

Demo Video

Shows the WooCommerce Cart Total Added to the Navigation Menu widget in the before header utility bar.

Tested using the Parallax Pro child theme by StudioPress however will work in other Genesis child themes where some modification of the CSS might be needed.

Installation Steps

  1. # Copy & paste the PHP code ( without the opening PHP tag ) to the end of your child themes functions.php file.
  2.  

  3. # Copy & paste the CSS from the style.css file to the end of your child themes style sheet and clear caching.
  4.  

  5. # Create a new menu named before-header without the need to add any menu items like this:
  6.  

  7. # Add widgets to the Before Header widget area including the Navigation Menu widget selecting the before-header menu as seen in the following screenshot and demo video.
  8.  

Download Folder

Related Tutorials

  • Add WooCommerce Cart Count & Total Price To Genesis Nav Menu

CSS Grid Columns Nav Menu Parallax Pro Theme WooCommerce

Reader Interactions

Leave a Reply Cancel reply

You must be logged in to post a comment.

Primary Sidebar

Code written by Brad Dalton specialist for Genesis, WooCommerce & WordPress theme customization. Read More…

Advertise · WPEngine · Genesis · Log in

  • Access Problems
  • Account Details
  • Consulting
  • Tags
 

Loading Comments...
 

You must be logged in to post a comment.