Jump to content
Search In
  • More options...
Find results that contain...
Find results in...
Advanced Search
  • 0

Hide Navigation Bar on only one Page Brine family Template


JuBalas

Question

Hey hi, 

i have seen on the forum the exact same question i'm posting right now but none of the answers work for me so here i am.

I’m trying to remove the navigation bar from a specific page on my maple inn template (brine family). I'v read that i should insert this code :

body#collection-5d58db8548099500014d80bb nav.Header-nav.Header-nav--primary {
   display: none;
}

But it doesn't work. Is there another way to do it or should i modify something in the code ?

Thx in advance for your help ! 

 

Link to comment

20 answers to this question

Recommended Posts

  • 1

Replace body#collection-5d58db8548099500014d80bb with Your Page ID. See how to find Page ID.

Email me if you have need any help (free, of course.). Answer within 24 hours.

How to: Setup password & share url - Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care - Learn CSS - Custom Popup - Testimonial Slider

I'm Tuan, blogger/owner of a free library for children in Vietnam. Helping the community is a hobby. Contact me via email.

Link to comment
  • 0

The code you have should work, but if you want me to take a look please share a link (and pwd if needed) to your website.

/* HIDE THE PRIMARY NAVS */
#collection-5d58db8548099500014d80bb .Header-nav--primary {
   display: none!important;
}

/* HIDE THE PRIMARY AND SECONDARY NAVS */
#collection-5d58db8548099500014d80bb .Header-nav {
   display: none!important;
}

 

Link to comment
  • 0

Thank you so much to both of you !

Here are some more precisions about the way to do it :

1/ Each page has a specific collection number, so if you want to hide the navigation bar on a specific page, go on this page and find the page's collection number

2/ Replace the collection number in the following code by yours

#collection-5dcedd5eb702913cebc23c32 .Header-nav {
   display: none!important;
}

3/ Insert the code in DESIGN > CUSTOM CSS

4/ If you need to hide your navigation bar on several pages, follow the first 3 steps for each page. Your custom CSS window will look like this 

#collection-5dcd70869ea30043a7d107f7 .Header-nav {
   display: none!important;
}
#collection-5dcd7c15efe0ea08ad8167ac .Header-nav {
   display: none!important;
}
#collection-5dcedd5eb702913cebc23c32 .Header-nav {
   display: none!important;
}

 

👋🏻

Link to comment
  • 0
On 8/8/2020 at 7:51 AM, lu.diehl said:

@luisgonzalez- were you able to fix it? because I don't see any logo when viewing the site on desktop or mobile.

@lu.diehl hey! It wasn't the logo it was the mobile nav. On desktop for the Spanish site I want just the Spanish nav, and likewise for English. I was able to achieve this for the desktop version but not mobile. Any way to target that for the mobile nav?

Link to comment
  • 0
On 8/10/2020 at 9:54 PM, luisgonzalez said:

@lu.diehl hey! It wasn't the logo it was the mobile nav. On desktop for the Spanish site I want just the Spanish nav, and likewise for English. I was able to achieve this for the desktop version but not mobile. Any way to target that for the mobile nav?

Can you share site url?

Email me if you have need any help (free, of course.). Answer within 24 hours.

How to: Setup password & share url - Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care - Learn CSS - Custom Popup - Testimonial Slider

I'm Tuan, blogger/owner of a free library for children in Vietnam. Helping the community is a hobby. Contact me via email.

Link to comment
  • 0
On 8/12/2020 at 11:07 PM, luisgonzalez said:

@tuanphan 

Here is the site as it is. Trying to do a multilingual site for this documentary. 

blurringman.org 

main issue is wanting to separate the navs on mobile for each language, I was able to do that on desktop.

Try these guides

Email me if you have need any help (free, of course.). Answer within 24 hours.

How to: Setup password & share url - Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care - Learn CSS - Custom Popup - Testimonial Slider

I'm Tuan, blogger/owner of a free library for children in Vietnam. Helping the community is a hobby. Contact me via email.

Link to comment
  • 0
19 hours ago, dovely said:

@tuanphan You've helped us so much with previous sites. I am also in the brine template and using the code below but it's not working for some reason. Can you take a look for us please? Thank you so much. 

The link for this page is below as well. 🙂

body#collection-609d2c7ba07aef53b13b14fa nav.Header-nav.Header-nav--primary {
   display: none;
}

https://pineapple-chartreuse-es5k.squarespace.com/linktree-page

Add to Design > Custom CSS

/* LinkTreePage - Hide nav */
body#collection-609d2c7ba07aef53b13b14fa nav.Header-nav {
    visibility: hidden;
}

 

Email me if you have need any help (free, of course.). Answer within 24 hours.

How to: Setup password & share url - Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care - Learn CSS - Custom Popup - Testimonial Slider

I'm Tuan, blogger/owner of a free library for children in Vietnam. Helping the community is a hobby. Contact me via email.

Link to comment
  • 0

@tuanphanThank you for your help. I tried the code you mentioned above and it hides the navigation on desktop but not the site logo and I see both the navigation and the logo on mobile. Is there a way to make it hidden there as well? Appreciate your time and help! 

Link to comment
  • 0
13 hours ago, dovely said:

@tuanphanThank you for your help. I tried the code you mentioned above and it hides the navigation on desktop but not the site logo and I see both the navigation and the logo on mobile. Is there a way to make it hidden there as well? Appreciate your time and help! 

You want to hide header, or hide navigation?

To hide header, use this new code

/* LinkTreePage - Hide nav */
body#collection-609d2c7ba07aef53b13b14fa {
header.Header, .Mobile.loaded {
    display: none !important;
}
}

Then save & reload the site

Email me if you have need any help (free, of course.). Answer within 24 hours.

How to: Setup password & share url - Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care - Learn CSS - Custom Popup - Testimonial Slider

I'm Tuan, blogger/owner of a free library for children in Vietnam. Helping the community is a hobby. Contact me via email.

Link to comment
  • 0
On 5/20/2021 at 3:58 AM, dovely said:

@tuanphan You nailed it (sorry for the confusion on my part). LOOKS GREAT! Thank you 🙂

Do you need to help with these issues?

Site URL – https://pineapple-chartreuse-es5k.squarespace.com/

1. (Mobile-Homepage) Reduce this white space?

pineapple-chartreuse-es5k.squarespace.co

2. (Mobile) remove black bar at the bottom of screen?

pineapple-chartreuse-es5k.squarespace.co

3. (Tablet-Homepage) Change to 2 items/row?

pineapple-chartreuse-es5k.squarespace.co

4. (Tablet-About) text looks long. Want to stacked text/image?

pineapple-chartreuse-es5k.squarespace.co

5. (Mobile-About) Move image to top of text?

pineapple-chartreuse-es5k.squarespace.co

6. (Mobile-About) Similar above

pineapple-chartreuse-es5k.squarespace.co

7. (Mobile-Services) Similar above

pineapple-chartreuse-es5k.squarespace.co

Email me if you have need any help (free, of course.). Answer within 24 hours.

How to: Setup password & share url - Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care - Learn CSS - Custom Popup - Testimonial Slider

I'm Tuan, blogger/owner of a free library for children in Vietnam. Helping the community is a hobby. Contact me via email.

Link to comment
  • 0
12 hours ago, SouthernSunEvents said:

How could I go about hiding the logo on the home page on mobile/tablet views?

http://www.southernsunevents.com

PW:sse2020

Add to Design > Custom CSS

/* hide logo mobile homepage */
@media screen and (max-width:640px) {
body.homepage img.Mobile-bar-branding-logo {
    visibility: hidden;
}
}

 

Email me if you have need any help (free, of course.). Answer within 24 hours.

How to: Setup password & share url - Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care - Learn CSS - Custom Popup - Testimonial Slider

I'm Tuan, blogger/owner of a free library for children in Vietnam. Helping the community is a hobby. Contact me via email.

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...