WooCommerce Tutorials

The tutorials in this archive relate to the modification of WooCommerce via your Genesis child theme. The code is guaranteed to work as shown in the demo images and videos. Installation of all code as well as support for PHP code is provided for members. Note : Usage of WooCommerce in Genesis and the code/templates in these tutorials requires the activation of the Genesis Connect for WooCommerce plugin.

2 Ways To Show Custom Header Images On Each WooCommerce Product Category Page

These solutions let you add a custom image for your logo to any WooCommerce product category page. If none added, a default named

Add Image After WooCommerce Product Category Page Title In Genesis Child Themes

This code enables you to add a linkable image after the WooCommerce products header on any product category page. There's 2 snippets

Genesis Layout Settings On WooCommerce Pages

There's 3 ways to change the layout settings in Genesis child themes. 1. You can use the Layout Settings on any Edit Page screen to

Change Number of Product Columns On WooCommerce Archive Pages In Genesis

The code snippets in this tutorial enable you to change the number of columns WooCommerce products are displayed in for specific archive

Add Woo Shopping Cart Basket To Nav Menu In Genesis

This tutorial provides a slightly different method to this tutorial which enables you to add a shopping cart icon and item number to your

Outfitter Pro Shop Page Like Front Page 2 Products Widget

The solution in this download enables you to display your shop page ( product archive page ) the same as the front page 2 widget area which

Replace Masonry With CSS Grid In Outfitter Pro

Outfitter Pro is the latest StudioPress child theme for WooCommerce which uses a masonry layout on the front page. This tutorial shows

Remove Sidebar on WooCommerce Pages

This tutorial provides 2 ways to remove the sidebar from any type of WooCommerce page in Genesis child themes. 1. You can change the

WooCommerce Conditional Tag Checks All Pages

The code in this tutorial creates a custom made conditional tag which you can use with any custom function to check for all types of

Add WooCommerce Cart Quantity & Total Price To Nav Menu

This code enables you to add both the cart quantity ( count ) and the cart total ( price ), to any WordPress nav menu. The price is also

Link Site Title On WooCommerce Pages To Shop

This code for HTML 5 Genesis child theme users, links your site title ( in your header ) to your shop page on WooCommerce pages

Add Next & Previous Product Navigation Links To WooCommerce Single Products

This code enables you to link all single products together in any theme. No need to edit any Woocommerce files using this

WooCommerce Single Product Page Hooks

These hooks enable you to add content to WooCommerce single product pages. You can see the hooks included in the woocommerce >

Change Width of Content & Sidebar on WooCommerce Shop Page Using Genesis

This code enables you to control the width of both the content area and primary sidebar on the WooCommerce shop page. How it works If

2 Ways To Move The Sidebar To The Left in WooCommerce Pages Using Genesis

This tutorial shows you 2 ways to move the primary sidebar to the left and the content to the right. By default, the content displays on

Add Custom Genesis Sidebar To WooCommerce Archive Product Page Template

This PHP code enables you to add a hand coded custom sidebar to a custom WooCommerce archive product page template in any Genesis child

WooCommerce Full Width Single Product Summary Page Elements

By default, WooCommerce displays all the single product summary elements in a separate column to the product image and gallery images which

40+ Code Snippets To Modify WooCommerce Single Product Page Elements

This post provides single lines of code you can use to add, remove and reposition different elements on any single product page. You can