Jump to content

Displaying both categories and subcategories

Recommended Posts

Posted
4 hours ago, nonnodacciaio said:

Site URL: https://octopus-bamboo-jgnm.squarespace.com/

Hi, I searched the forum, but couldn't find an answer. I have a site with lots of categories, so I organized them in 3 subcategories. I want the user to be able to click the "all categories" button, but it only shows the 3 subcategories, not all of them

Hey there!

What is the password to your site so that we can investigate the issue?

Feel free to email me with any customization inquiries or questions you may have!

Free Squarespace Resources: DevTools Minicourse,  11-Step Guide to Improve Custom CSS, Free Product/Pricing Comparison Table Generator

Posted
On 2/21/2022 at 5:04 PM, Caroline_Smith said:

So if I understand your question, you want to add an "All" option here (see attached picture)?image.thumb.png.50b972be07be5eae90068bb935aa51fa.png

Again, sorry for the late reply. I would want it so that when I press the button "Categorie", all sub-categories show up, not the 3 macro-categories.

 

For example, if I press "Agricoltura" only the categories related to agricultural products show up, but if I press "categorie" I want that all sub-categories of "agricoltura" "boschivo" and "giardino" to show up.

Posted
On 3/1/2022 at 8:42 PM, nonnodacciaio said:

Again, sorry for the late reply. I would want it so that when I press the button "Categorie", all sub-categories show up, not the 3 macro-categories.

 

For example, if I press "Agricoltura" only the categories related to agricultural products show up, but if I press "categorie" I want that all sub-categories of "agricoltura" "boschivo" and "giardino" to show up.

Try adding this to Design > Custom CSS

/* Show category nav links */
div.nested-category-tree-wrapper {
    display: flex !important;
    float: none !important;
    min-width: 100% !important;
    max-width: 100% !important;
    margin-right: 0 !important;
}
section.products.collection-content-wrapper.products-list {
    flex-direction: column !important;
    display: flex;
}
.nested-category-tree-wrapper>ul {
    width: 100% !important;
    display: flex;
    justify-content: center;
    align-items: center;
}
.nested-category-tree-wrapper>ul li {
    margin-left: 2vw;
}
nav.nested-category-breadcrumb {
    display: none !important;
}
ul.nested-category-children {
    display: none !important;
}
a.category-link.root {
    padding-top: 17px !important;
}

 

Email me if you have need any help (free, of course.). Answer within 24 hours. 
Or send to forum message

Contact Customer Care - Learn CSS - Buy me a coffee (thank you!)

Posted

Hi, thanks for your help, but this didn't do what I needed it to do.

I'd for all the subcategories to show when I click "Tutte le categorie" or "Categorie" (at the top). There are around 20 sub-categories.

So that a customer can have a clear view of all the stuff that's present while still being able to see the 3 main categories in the home page

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.