I came across this problem with WooCommerce canvas theme when I changed the current theme of my website to canvas by WooThemes. The sidebar was not showing up on the shop page no matter what I did. Canvas seems to be a pretty fine framework for fast deploying your WordPress websites. But the shop page was doing nasty things.
This problem can be fixed by creating a custom page template for the shop page.
Here is the fix
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 |
<?php /** * The Template for displaying product archives, including the main shop page which is a post type archive. * * Override this template by copying it to yourtheme/woocommerce/archive-product.php * * @author WooThemes * @package WooCommerce/Templates * @version 2.0.0 */ if ( ! defined( 'ABSPATH' ) ) exit; // Exit if accessed directly get_header( 'shop' ); ?> <div id="content" class="col-full"> <?php /** * woocommerce_before_main_content hook * * @hooked woocommerce_output_content_wrapper - 10 (outputs opening divs for the content) * @hooked woocommerce_breadcrumb - 20 */ do_action( 'woocommerce_before_main_content' ); ?> <?php if ( apply_filters( 'woocommerce_show_page_title', true ) ) : ?> <h1 class="page-title"><?php woocommerce_page_title(); ?></h1> <?php endif; ?> <?php do_action( 'woocommerce_archive_description' ); ?> <?php if ( have_posts() ) : ?> <?php /** * woocommerce_before_shop_loop hook * * @hooked woocommerce_result_count - 20 * @hooked woocommerce_catalog_ordering - 30 */ do_action( 'woocommerce_before_shop_loop' ); ?> <?php woocommerce_product_loop_start(); ?> <?php woocommerce_product_subcategories(); ?> <?php while ( have_posts() ) : the_post(); ?> <?php wc_get_template_part( 'content', 'product' ); ?> <?php endwhile; // end of the loop. ?> <?php woocommerce_product_loop_end(); ?> <?php /** * woocommerce_after_shop_loop hook * * @hooked woocommerce_pagination - 10 */ do_action( 'woocommerce_after_shop_loop' ); ?> <?php elseif ( ! woocommerce_product_subcategories( array( 'before' => woocommerce_product_loop_start( false ), 'after' => woocommerce_product_loop_end( false ) ) ) ) : ?> <?php wc_get_template( 'loop/no-products-found.php' ); ?> <?php endif; ?> <?php /** * woocommerce_after_main_content hook * * @hooked woocommerce_output_content_wrapper_end - 10 (outputs closing divs for the content) */ do_action( 'woocommerce_after_main_content' ); ?> <div id="widgets-container"> <?php dynamic_sidebar( 'widgets-page-template' ); ?> </div> </div> <?php get_footer( 'shop' ); ?> |
Add the following CSS to your custom CSS file through canvas theme settings.
|
1 2 3 4 5 |
div#widgets-container { width: 30%; top: 0px; position: absolute; } |
Go to the Shop page and activate the page template that you created before for the shop page and add the widgets in the widget page template area.
The problem with the woocommerce shop page sidebar is fixed now and you can customize the widgets by adding any desired element to it.
Hope you like this quick solution.
Hi,
I used your solution for my issue, and it works.
But the widget in the sidebar come above the footer, how can i fix it?
Sorry for my bad english,
Michele.
Please use the css provided above to style the sidebar. You can add it to your custom css in canvas theme’s general settings.
Dear Vikram,
Please help.
When you say the following, what do you mean and how to do it?
“Go to the Shop page and activate the page template that you created before for the shop page and add the widgets in the widget page template area”
Your help is highly regarded.
Thanks
Hey Ali,
You need to create a page template for the shop page using the php code above and use that template for the canvas shop page to show up the sidebar. And style the sidebar using the given css style. If you are not sure let me know. I will put up a new post for you.
Thanks for stopping by.
Workd!