Jump to content

How to have the main landing page of of a store show images of categories instead of all products within the categories.

Go to solution Solved by creedon,

Recommended Posts

Site URL: https://www.wingandwool.com/shop-the-farm

Hi,

When someone clicks on the "Shop" link from my homepage, I'd like that first store landing page to show pictures/links of the individual categories within the store which will take them to the individual category pages, rather than show pictures of all of the products within all of the categories in the entire store.  Is this possible?

Thank you so much!

Link to comment
  • Solution

I think it is possible.

Please see the following post and install the code cited there. The original poster also describes the difficulty in targeting CSS to the main store page vs category pages.

Add the following to Store Settings > Advanced > Page Header Code Injection for the store page.

<style>

  /* this ruleset is not active in SS Preview. to test it use private browsing
     < https://bit.ly/3f6lhq2 > */
  
  html:not( .squarespace-damask ) body:not( [data-store-category] ) .products.collection-content-wrapper .list-grid {
  
    display : none;
    
    }
  </style>

This is for v7.1.

Add a page section to your store page and use blocks to make the section look the way you want.

Let us know how it goes.

Edited by creedon
updated with better method

Find my contributions useful? Please like, upvote, mark my answer as best , and see my profile. Thanks for your support!

Link to comment
  • 9 months later...

Hi @creedon for some reason it didn't work for me? All ended up being hidden and i can't have any product show up. Ideally i would like to be able to create a box for each category and sub-category and for that to lead me to the list of product within those categories. Can you please assist?

lukewildart.com

psw: Test123

Edited by FMLK
Link to comment

@creedon I've followed the above again and the outcome is not there yet. In the main shop page I have my two boxes that are linked to the categories but i still see the categories below. I would like to remove those in the initial view. Also, when i click on the box to go to a specific category i still see the boxes on top is there a way to hide them and only show the category? So to summarise, there are two issues:

1. I still see the categories below my category boxes on the top, would like to hide that on the main shop page.

2. once i click on the box i go to the specific category but i still see all the boxes. Is there a way to hide those once you enter into a category?

 

Thank you for your help!

FM

Link to comment

Create an account or sign in to comment

You need to be a member in order to leave a comment

×
×
  • Create New...

Squarespace Webinars

Free online sessions where you’ll learn the basics and refine your Squarespace skills.

Hire a Designer

Stand out online with the help of an experienced designer or developer.