Jump to content

Hiding header button on one page

Recommended Posts

54 minutes ago, Katie_B said:

Site URL: https://flounder-star-7xs2.squarespace.com/

Hello,

I'd like to hide the ORDER NOW button in my header on the product detail page. 

Site password: kb

Many thanks! 

You can add below code in your Custom CSS editor. It will hide button on both desktop and mobile.

#item-60632671dc94e57b3a76bb27 .header-actions-action--cta,
#item-60632671dc94e57b3a76bb27 .header-menu-cta {
    display: none;
}

Link to comment
On 4/2/2021 at 3:42 AM, Katie_B said:

Site URL: https://flounder-star-7xs2.squarespace.com/

Hello,

I'd like to hide the ORDER NOW button in my header on the product detail page. 

Site password: kb

Many thanks! 

Hi. Add to Design > Custom CSS

/* hide order button on product detail */
body.collection-type-products.view-item header#header a.btn {
    visibility: hidden !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!)

Link to comment
  • 2 years later...
7 minutes ago, maxwel said:

looking to hide the button "Book Now" in the nav on this page only

Add the following to Design > Custom CSS.

#collection-63f83b263c54254b3c306a35 .header-actions--right .header-actions-action {

  display : none;
  
  }

Let us know how it goes.

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.

Link to comment
18 minutes ago, creedon said:

Add the following to Design > Custom CSS.

#collection-63f83b263c54254b3c306a35 .header-actions--right .header-actions-action {

  display : none;
  
  }

Let us know how it goes.

That worked perfectly, thanks so much for the fast response and awesome help!

Link to comment
  • 2 weeks later...
36 minutes ago, maxwel said:

If you have instructions as far as how to find the correct collection ID so I can do this in the future without having to ask, I'm all ears 🙂

Check out Heather Tovey's most excellent looking Squarespace ID Finder.

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.

Link to comment
2 hours ago, maxwel said:

Hi again! I'm now trying to hide the nav button "Book Now" on this specific landing page: https://www.sandandsaltescapes.com/final-room-flash-sale

Any help with the code to make this happen would be appreciated! If you have instructions as far as how to find the correct collection ID so I can do this in the future without having to ask, I'm all ears 🙂

Thank you!

Add to Design > Custom CSS

/* Final room flash sale hide buttons */
body#collection-64b82ef6f21edc30584c96bb header#header a.btn {
    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!)

Link to comment
2 hours ago, maxwel said:

Which ID should I grab?

The collection ID should be the first one that shows after you run the code. It should start with #collection...

image.png.8dca9198ab650f622a3c395e482a7def.png

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.

Link to comment
  • 8 months later...

HELLO!
I just tried adding this to my custom css, with my updated collection # but it doesnt seem to be working. Can someone help me out? I am trying to hide the donate button on this specific page. and my collection number is  #collection-6600b7bc68936763b8ce3316

Link to comment
On 4/8/2024 at 11:05 PM, adamkearney said:

HELLO!
I just tried adding this to my custom css, with my updated collection # but it doesnt seem to be working. Can someone help me out? I am trying to hide the donate button on this specific page. and my collection number is  #collection-6600b7bc68936763b8ce3316

You can use this code to Website > Website Tools > Custom CSS. If it doesn't work, you can share link to page, we can check easier.

#collection-6600b7bc68936763b8ce3316 a.btn {
	display: none !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!)

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.