Disable Shop by Price Feature (Stencil)

Here are the steps to disable the “Shop by Price” feature on a BigCommerce Stencil theme. We will use the default Cornerstone theme in the examples.

Step 1: Remove Code Snippet

You need to locate the category.html file, which is located in:

templates/components/category/sidebar.html

There you need to locate the code for the sidebar and comment it out as shown below:

<!– 
{{> components/category/shop-by-price shop_by_price=category.shop_by_price category_url=category.url}}
–>

Step 2: Expand the Product Listing Grid

Even tough we removed the sidebar, the product listing grid is set to take 75% of the width of the page container. What we want to do here is change that to 100% width so that it doesn’t leave blank space where the sidebar was.

We can easily do this by adding the following code to the Scripts tab under Storefront Design › Design Options:

<style>
@media (min-width: 801px) {
.page-sidebar+.page-content .productGrid .product {
width: 25%;
}
.page-sidebar+.page-content {
width: 100%;
}
.card-body .card-text {text-align: center;}
.card-title {text-align: center;}
}
</style>

And here is the final result: