• Skip to main content
  • Skip to forum navigation

StudioPress

  • Shop for Themes
  • My StudioPress

Forum navigation

  • Home
  • General Genesis Discussions
  • StudioPress Themes
  • Genesis Blocks
    • Genesis Blocks
    • Genesis Custom Blocks
  • Retired Themes
  • FAQs
  • Forum Rules
  • Internationalization and Translations
  • Forum Bugs and Suggestions
  • Forum Log In

Are You Using The WordPress Block Editor?

Genesis now offers plugins that help you build better sites faster with the WordPress block editor (Gutenberg). Try the feature-rich free versions of each plugin for yourself!

Genesis Blocks Genesis Custom Blocks

Changing sidebar code hook on WooCommerce product single pages

Welcome!

These forums are for general discussion on WordPress and Genesis. Official support for StudioPress themes is offered exclusively at My StudioPress. Responses in this forum are not guaranteed. Please note that this forum will require a new username, separate from the one used for My.StudioPress.

Log In
Register Lost Password

Community Forums › Forums › StudioPress Themes › Genesis Sample › Changing sidebar code hook on WooCommerce product single pages

This topic is: not resolved

Tagged: Genesis Connect for WooCommerce, single product, WooCommerce

  • This topic has 8 replies, 2 voices, and was last updated 3 years ago by Brad Dalton.
Viewing 9 posts - 1 through 9 (of 9 total)
  • Author
    Posts
  • April 25, 2022 at 9:23 pm #505104
    [email protected]
    Participant

    Hi there,

    I want to change the current WooCommerce product single code structure from:

    <div class="content-sidebar-wrap">
    <main class="content"></div>
    <aside class="sidebar"></aside>
    </div>

    To:

    <div class="content-sidebar-wrap">
    <main class="content">
    <aside class="sidebar"></aside>
    </div>
    </div>

    So basically putting the sidebar wrapper inside of the main content class. How can I achieve this?

    April 25, 2022 at 10:44 pm #505106
    Brad Dalton
    Participant

    Link to your site please.


    Tutorials for StudioPress Themes.

    April 25, 2022 at 11:14 pm #505108
    [email protected]
    Participant

    Sorry, the site is on on localhost only.

    I'm using the genesis sample theme as the base for a custom child theme if that helps.

    April 26, 2022 at 12:41 am #505109
    Brad Dalton
    Participant

    You could try the Genesis Connect for Woocommerce plugin which includes templates you can use in your child theme to modify the default markup and HTML output.


    Tutorials for StudioPress Themes.

    April 27, 2022 at 12:32 am #505120
    [email protected]
    Participant

    Thanks for the help Brad. I had a dig around in Genesis Connect but couldn't find what I was looking for. I think I need to unhook the sidebar from where it is being loaded in archive-product.php then rehook it back into the main content div.

    Unfortunately my knowledge on hooks and PHP is very limited so I am unsure how to go about this.

    April 27, 2022 at 12:39 am #505121
    Brad Dalton
    Participant

    What a coincidence. I was just looking it again wondering why you want to do this?

    You want this on desktops and mobile screens or just mobile?


    Tutorials for StudioPress Themes.

    April 27, 2022 at 12:54 am #505122
    Brad Dalton
    Participant

    Maybe this :

    remove_action( 'genesis_sidebar', 'genesis_do_sidebar' );
    add_action( 'genesis_after_loop', 'genesis_do_sidebar' );
    

    Tutorials for StudioPress Themes.

    April 27, 2022 at 7:51 pm #505134
    [email protected]
    Participant

    Thank you so much Brad!

    I am 99% of the way there now.

    I am running a custom sidebar that only loads on WooCommerce category pages.

    Here is the code from the functions.php:

    // Register WooCommerce sidebar
    genesis_register_sidebar( array(
        'id'            => 'woo_primary_sidebar',
        'name'          => __( 'WooCommerce Sidebar', 'themename' ),
        'description' => __( 'This is the WooCommerce webshop sidebar', 'themename' ),
    ) );
    
    // Remove default sidebar, add shop sidebar
    add_action( 'genesis_before', 'pp_add_woo_sidebar', 20 );
    function pp_add_woo_sidebar() {
    
        if ( in_array( 'woocommerce/woocommerce.php', apply_filters( 'active_plugins', get_option( 'active_plugins' ) ) ) ) {
            if( is_woocommerce() ) {
                remove_action( 'genesis_sidebar', 'genesis_do_sidebar' );
                remove_action( 'genesis_sidebar_alt', 'genesis_do_sidebar_alt' );
                add_action( 'woocommerce_before_shop_loop', 'pp_woo_sidebar' );
            }
        }
        
    }
    
    // Display the WooCommerce sidebar
    function pp_woo_sidebar() {
        if ( ! dynamic_sidebar( 'woo_primary_sidebar' ) && current_user_can( 'edit_theme_options' )  ) {
            genesis_after_entry( __( 'WooCommerce Primary Sidebar', 'genesis' ) );
        }
    }

    All that I need for it to work on the front end is to wrap all the widgets that are loaded in this sidebar inside of a div so I can control the placement via CSS.

    However, I am unsure how to modify this code snippet to wrap all of the sidebar widgets inside of a div 🙁

    April 28, 2022 at 6:39 am #505136
    Brad Dalton
    Participant

    You can add

    echo '<div class="your-wrap">';
    
    // Your Code
    
    echo '</div>';
    

    Tutorials for StudioPress Themes.

  • Author
    Posts
Viewing 9 posts - 1 through 9 (of 9 total)
  • You must be logged in to reply to this topic.
Log In

CTA

Ready to get started? Create a site or shop for themes.

Create a site with WP EngineShop for Themes

Footer

StudioPress

© 2025 WPEngine, Inc.

Products
  • Create a Site with WP Engine
  • Shop for Themes
  • Theme Features
  • Get Started
  • Showcase
Company
  • Brand Assets
  • Terms of Service
  • Accptable Usse Policy
  • Privacy Policy
  • Refund Policy
  • Contact Us
Community
  • Find Developers
  • Forums
  • Facebook Group
  • #GenesisWP
  • Showcase
Resources
  • StudioPress Blog
  • Help & Documentation
  • FAQs
  • Code Snippets
  • Affiliates
Connect
  • StudioPress Live
  • StudioPress FM
  • Facebook
  • Twitter
  • Dribbble