No sidebar in shop?

Hi,

I have created a shop products sidebar:

In sidebars I have set this sidebar to appear on various shop pages:

And I have this code in functions.php to define my page layouts:

// =============================================================================
// Force page layout across the site
// =============================================================================
function x_get_content_layout() {

    $content_layout = x_get_option( 'x_layout_content' );

    if ( $content_layout != 'full-width' ) {
      if ( is_home() ) {
        $opt    = x_get_option( 'x_blog_layout' );
        $layout = ( $opt == 'sidebar' ) ? $content_layout : $opt;
      } elseif ( is_singular( 'post' ) ) {
        $meta   = get_post_meta( get_the_ID(), '_x_post_layout', true );
        $layout = ( $meta == 'on' ) ? 'full-width' : $content_layout;
      } elseif ( x_is_portfolio_item() ) {
        $layout = 'full-width';
      } elseif ( x_is_portfolio() ) {
        $meta   = get_post_meta( get_the_ID(), '_x_portfolio_layout', true );
        $layout = ( $meta == 'sidebar' ) ? $content_layout : $meta;
      } elseif ( is_page_template( 'template-layout-content-sidebar.php' ) ) {
        $layout = 'content-sidebar';
      } elseif ( is_page_template( 'template-layout-sidebar-content.php' ) ) {
        $layout = 'sidebar-content';
      } elseif ( is_page_template( 'template-layout-full-width.php' ) ) {
        $layout = 'full-width';
      } elseif ( is_archive() ) {
        if ( x_is_shop() || x_is_product_category() || x_is_product_tag() ) {
          $opt    = x_get_option( 'x_woocommerce_shop_layout_content' );
          $layout = ( $opt == 'sidebar' ) ? $content_layout : $opt;
        } else {
          $opt    = x_get_option( 'x_archive_layout' );
          $layout = ( $opt == 'sidebar' ) ? $content_layout : $opt;
        }
      } elseif ( x_is_product() ) {
        $layout = 'full-width';
      } elseif ( x_is_bbpress() ) {
        $opt    = x_get_option( 'x_bbpress_layout_content' );
        $layout = ( $opt == 'sidebar' ) ? $content_layout : $opt;
      } elseif ( x_is_buddypress() ) {
        $opt    = x_get_option( 'x_buddypress_layout_content' );
        $layout = ( $opt == 'sidebar' ) ? $content_layout : $opt;
      } elseif ( is_404() ) {
        $layout = 'full-width';
      
      } else {
        $layout = $content_layout;
      }
    } else {
      $layout = $content_layout;
    }



    return $layout;

  }

function add_sidebars_singleposts($contents) {
  if ( is_single('') ) {
    $contents = 'content-sidebar';
  }
  
  return $contents;
}

I have completely purged my cache and deactivated W3 Total Cache.

Any reasons why the sidebar is not appearing in my shop here?

Hello @demonboy,

Thanks for writing in!

The sidebar did not display because you have removed the <?php get_sidebar(); ?> line in the woocommerce.php file in the child theme. I have added it back and the sidebar is now displaying.

Please check your site.

Doh! Schoolboy error!

Thanks, @RueNel.

Hi, further to this I am not able to change the shop sidebar.

I’ve created a shop side bar:

Added some widgets to the sidebar

But my shop pages are still showing the standard sidebar:

Hi @demonboy,

Please go to Appearance > Sidebar then set it up properly to show on that specific taxonomy pages you where you want it to show.

Hope this helps.

1 Like

Aha, I did not know that! Thanks for that, @Lely. One question, how do I make it appear on the product page:

https://followtheboat.com/product/drawstring-bag/

Do I need to add x_is_product() or something similar to the code I posted in my OP?

Hi @demonboy,

For that, you’ll have to change the product layout to content-sidebar, from the above code, please change this area

} elseif ( x_is_product() ) {
        $layout = 'full-width';
      }

to this

} elseif ( x_is_product() ) {
        $layout = 'content-sidebar';
      }

Then you can assign the sidebar through Appearance > Sidebars as well.

Thanks!

That’s great, @Rad, thank you.

One other thing, the sidebar on the product page is displaying correctly with the grey background extended across the page. https://followtheboat.com/product/ftb-checker-bag/

However the sidebar for product- category has a white background.

https://followtheboat.com/product-category/bags/

How to extend the grey across the full page width?

Hello @demonboy,

The grey color is because of this custom css:

.single .site>.x-container {
    background-color: #f8f8f8;
    padding: 30px;
    position: relative;
    z-index: 999;
}

This can only be applied to single post, single custom post types and single product page. If you want to use this in the category archive, you’ll need to update the code and use this instead:

.single .site>.x-container,
.archive .site>.x-container {
    background-color: #f8f8f8;
    padding: 30px;
    position: relative;
    z-index: 999;
}

We would love to know if this has worked for you. Thank you.

Of course, your solutions always work @RueNel :slight_smile:

Couple more pages to sort out:

https://followtheboat.com/cart/ needs the sidebar, which is currently missing.

And https://followtheboat.com/checkout/ needs the grey extended, as will the cart.

So I need to change my functions file for the cart missing sidebar, and then both pages need the CSS, as per above.

Hello @demonboy,

Please edit your cart and checkout page. You will need to change the page template to Layout - Content Left, Sidebar Right. For more details about the different page templates in the theme, please check this out:

And then, you will have to update the css using this code:

.single .site>.x-container,
.archive .site>.x-container,
.page-template-template-layout-content-sidebar .site>.x-container {
    background-color: #f8f8f8;
    padding: 30px;
    position: relative;
    z-index: 999;
}

We would love to know if this has worked for you. Thank you.

1 Like

Great, that’s all good, thank you.

You’re welcome.

This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.