7.1 Hide category at top of each store page

Site URL: https://gregmaroney.com/songbooks

I asked this back in march and got an answer that seemed to work. 
The following code was added at Home->Design->custom css

.category-filter-container {
    display: none;
}

It turns out that it only works on one store page (albums) but not several others. 
I don't have a store page that has all products, I set up a separate page for each category, so I don't need/want that single category name taking up room at the top of each page.

I tried adding it to each store page, in header code but that didn't work.

Any help would be appreciated, thanks

Add to Home > Design > Custom CSS

h3.nested-category-title {
    display: none !important;
}

thank you for the reply, but the categories are still there. I have 5 "store collection" pages and 4 have the unwanted category.
I can't see a difference anywhere between those 4 and the 5th one, Albums ~ Physical,  that doesn't display it. Is it because they aren't h3?

Also, is there a way to have add to cart buttons on a store collection page?

Thank you

Taunphan, I found where to hide that category title

store settings/ categories/edit/filter visibility/off

thank you though for your time

I would still like to know if it is possible to have add to cart buttons on a store collection page. 

Linda

On 9/25/2020 at 7:58 PM, lamaroney said:

Taunphan, I found where to hide that category title

store settings/ categories/edit/filter visibility/off

thank you though for your time

I would still like to know if it is possible to have add to cart buttons on a store collection page. 

Linda

 

Hi.

I see you solved with this code

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
<style>
  .products .grid-item {
    padding-bottom: 60px;
    width: 100% !important;
  }
  .products .grid-item .sqs-add-to-cart-button {
    position: absolute;
    z-index: 9999;
    bottom: 0;
    left: 0;
    right: 0;
    width: 200px;
    min-width: 200px;
    margin: auto;
  }
</style>
<script>
  $(".products .grid-item").each(function(e){
    $(this).append('<div class="sqs-add-to-cart-button sqs-suppress-edit-mode sqs-editable-button" role="button" tabindex="0" data-product-type="1" data-original-label="Add To Cart"><div class="sqs-add-to-cart-button-inner">Add To Cart</div></div>');
  });
  $(function() {
    $(".products .grid-item").each(function(e){
      var dataItemId = $(this).attr('data-item-id');
      $(this).find('.sqs-add-to-cart-button').attr('data-item-id', dataItemId);
    });
  });
</script>

I was wondering if it's possible to determine the "Add To Cart" button color within the code?

Im trying to change the color of the add to cart buttons to orange (same color as the add to cart button on the home page) on this page:

https://www.spacetripsounds.com/freedownloads

On 4/6/2022 at 9:30 PM, spacetripsounds said:

I was wondering if it's possible to determine the "Add To Cart" button color within the code?

Im trying to change the color of the add to cart buttons to orange (same color as the add to cart button on the home page) on this page:

https://www.spacetripsounds.com/freedownloads

Use this CSS

div.sqs-add-to-cart-button div {
    background-color: #e95113;
    padding: 5px;
}