Jump to content

remove line on shop page and reduce category type size

Recommended Posts

Posted

Hi there,

Looking for help with some custom CSS for an ecommerce site. 

I’m looking to remove the grey horizontal line and reduce the font size of the category titles.

 

🙃

 

 

Screen Shot 2020-11-05 at 18.20.05.png

Posted

Please post the URL to the page with the grey horizontal lines.

If your site is not public please set up a site-wide password, if you've not already done so. Post the password here.

We can then take a look at your issue.

Find my contributions useful? Please like, upvote, mark my answer as the best ( solution ), and see my profile. Thanks for your support! I am a Squarespace ( and other technological things ) consultant open for new projects.

Posted
On 11/5/2020 at 10:26 AM, CASKATE said:

I’m looking to remove the grey horizontal line

Please add the following Design > Custom CSS.

@media screen and ( min-width: 576px ) {

  .products.collection-content-wrapper .nested-category-children::after {
  
    all: unset;
    
    }
  }

 

On 11/5/2020 at 10:26 AM, CASKATE said:

reduce the font size of the category titles

I was unable to find the page with category titles on it. The URL posted is for the backend and we need access to the front end. To post the front end URL please take your site into Full Preview when you are on the page with categories. Then copy that URL from the address bar and post it here.

Find my contributions useful? Please like, upvote, mark my answer as the best ( solution ), and see my profile. Thanks for your support! I am a Squarespace ( and other technological things ) consultant open for new projects.

Posted (edited)

Worked perfectly!! ☺️   Thank you!

One final question, is it possible to change the colour of the vertical bar between categories or even remove it entirely? Ideally remove entirely.

Thank you so much for your help!

Edited by CASKATE
Posted (edited)

@creedon

 

I have another question in relation to the categories titles, currently they are just visible on the general shop page is there a way to have them appear at the top of each category page also?

 

Thanks for all of your help to date!! Really appreciate it.

Edited by CASKATE
Posted
16 hours ago, CASKATE said:

Just wondering if the spacing between categories and the shop can be reduced on desktop only?

Please post your site-wide password and we can take a look at your issues.

Find my contributions useful? Please like, upvote, mark my answer as the best ( solution ), and see my profile. Thanks for your support! I am a Squarespace ( and other technological things ) consultant open for new projects.

Posted
On 11/20/2020 at 9:47 AM, CASKATE said:

I have another question in relation to the categories titles, currently they are just visible on the general shop page is there a way to have them appear at the top of each category page also?

I think you would need custom Javascript code to basically replicate the category titles down to the category pages. Not impossible but not an insignificant task. Every time you made a change to categories you would need to update the custom code with new categories.

Find my contributions useful? Please like, upvote, mark my answer as the best ( solution ), and see my profile. Thanks for your support! I am a Squarespace ( and other technological things ) consultant open for new projects.

  • 4 weeks later...
Posted
25 minutes ago, BANKRUPTLOVE said:

Hello ! I tried the code above and didn't work.

Please post the URL to your shop page.

If your site is not public please set up a site-wide password, if you've not already done so. Post the password here.

We can then take a look at your issue.

Find my contributions useful? Please like, upvote, mark my answer as the best ( solution ), and see my profile. Thanks for your support! I am a Squarespace ( and other technological things ) consultant open for new projects.

Posted

I actually got it figured out! But thank you for responding.

I do have another question but unrelated to this issue. (Matching navigation with the text blocks Im using as a "footer navigation")

Posted
1 minute ago, BANKRUPTLOVE said:

I do have another question but unrelated to this issue. (Matching navigation with the text blocks Im using as a "footer navigation")

I suggest starting a new thread with your question.

Find my contributions useful? Please like, upvote, mark my answer as the best ( solution ), and see my profile. Thanks for your support! I am a Squarespace ( and other technological things ) consultant open for new projects.

  • 5 months later...
Posted
On 11/6/2020 at 6:44 PM, creedon said:

Please add the following Design > Custom CSS.


@media screen and ( min-width: 576px ) {

  .products.collection-content-wrapper .nested-category-children::after {
  
    all: unset;
    
    }
  }

 

I was unable to find the page with category titles on it. The URL posted is for the backend and we need access to the front end. To post the front end URL please take your site into Full Preview when you are on the page with categories. Then copy that URL from the address bar and post it here.

Great, thanks!

  • 10 months later...
  • 2 weeks later...
  • 2 years later...
Posted

Thank you for this code below to remove the horizontal line on the store page provided above which worked great for me, my question is can I remove the same line from store category pages like this one?: https://chriscoombes.cc/collect/park (Interestingly the line doesn't show on category pages when I have subcategories like here: https://chriscoombes.cc/collect/barbican )

@media screen and ( min-width: 576px ) {

  .products.collection-content-wrapper .nested-category-children::after {
  
    all: unset;
    
    }
  }

 

Posted
On 7/8/2024 at 11:18 PM, Anon7856874 said:

Thank you for this code below to remove the horizontal line on the store page provided above which worked great for me, my question is can I remove the same line from store category pages like this one?: https://chriscoombes.cc/collect/park (Interestingly the line doesn't show on category pages when I have subcategories like here: https://chriscoombes.cc/collect/barbican )

@media screen and ( min-width: 576px ) {

  .products.collection-content-wrapper .nested-category-children::after {
  
    all: unset;
    
    }
  }

 

You can use this CSS code to remove line

.products.collection-content-wrapper .nested-category-title-padding::after {
    display: none;
}

 

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!)

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.