Useful Snippets

Add WooCommerce support for Genesis layouts – Proper Way

Pinterest LinkedIn Tumblr

This is very trusted AlphaBlossom’s way of handling WooCommerce on Genesis Framework. There is a plugin for this but if you want to keep lightweight your theme, I really suggest this method. You only paste the code below.

If you want to add WooCommerce support for Genesis layouts, you should add this code to your functions.php

/**********************************
*
* Integrate WooCommerce with Genesis.
*
* Unhook WooCommerce wrappers and
* Replace with Genesis wrappers.
*
* Reference Genesis file:
* genesis/lib/framework.php
*
* @author AlphaBlossom / Tony Eppright
* @link http://www.alphablossom.com
*
**********************************/

// Add WooCommerce support for Genesis layouts (sidebar, full-width, etc) - Thank you Kelly Murray/David Wang
add_post_type_support( 'product', array( 'genesis-layouts', 'genesis-seo' ) );

// Unhook WooCommerce Sidebar - use Genesis Sidebars instead
remove_action( 'woocommerce_sidebar', 'woocommerce_get_sidebar', 10 );

// Unhook WooCommerce wrappers
remove_action( 'woocommerce_before_main_content', 'woocommerce_output_content_wrapper', 10 );
remove_action( 'woocommerce_after_main_content', 'woocommerce_output_content_wrapper_end', 10 );

// Hook new functions with Genesis wrappers
add_action( 'woocommerce_before_main_content', 'genesischild_theme_wrapper_start', 10 );
add_action( 'woocommerce_after_main_content', 'genesischild_theme_wrapper_end', 10 );

// Add opening wrapper before WooCommerce loop
function genesischild_theme_wrapper_start() {

    do_action( 'genesis_before_content_sidebar_wrap' );
    genesis_markup( array(
        'html5' => '<div %s>',
        'xhtml' => '<div id="content-sidebar-wrap">',
        'context' => 'content-sidebar-wrap',
    ) );
    
    do_action( 'genesis_before_content' );
    genesis_markup( array(
        'html5' => '<main %s>',
        'xhtml' => '<div id="content" class="hfeed">',
        'context' => 'content',
    ) );
    do_action( 'genesis_before_loop' );
    
}
    
/* Add closing wrapper after WooCommerce loop */
function genesischild_theme_wrapper_end() {
    
    do_action( 'genesis_after_loop' );
    genesis_markup( array(
        'html5' => '</main>', //* end .content
        'xhtml' => '</div>', //* end #content
    ) );
    do_action( 'genesis_after_content' );
    
    echo '</div>'; //* end .content-sidebar-wrap or #content-sidebar-wrap
    do_action( 'genesis_after_content_sidebar_wrap' );

}
// Remove WooCommerce breadcrumbs, using Genesis crumbs instead.
add_action( 'get_header', 'genesischild_remove_wc_breadcrumbs' );
function genesischild_remove_wc_breadcrumbs() {

    remove_action( 'woocommerce_before_main_content', 'woocommerce_breadcrumb', 20, 0 );

}

add_action( 'after_setup_theme', 'genesischild_woo_gallery_setup' );
 
function genesischild_woo_gallery_setup() {
add_theme_support( 'wc-product-gallery-zoom' );
add_theme_support( 'wc-product-gallery-lightbox' );
add_theme_support( 'wc-product-gallery-slider' );
}

Thanks to this library we’re declaring WooCommerce support.

Write A Comment