Hide primary or secondary navigation

Site URL: http://labastilla.org

Hello everyone. 

I have a webpage www.labastilla.org that have several buttons, one of them will send you to a not linked page. There, I want to hide the primary or secondary navigation since it is a multilingual site, however I haven't found the CCS. 

Thank you. 

To hide primary on one page, add this to Page Settings > Advanced > Header (If you use Personal Plan > Add Code Block)

<style>
  nav.Header-nav.Header-nav--primary {
    display: none;
}
</style>

To hide secondary, use this code

<style>
  nav.Header-nav.Header-nav--secondary {
    display: none;
}
</style>

You can also use these guides to create multi language sites

• bradgood.net/articles/multi-language-content-on-any-squarespace-template
• https://beaverhero.com/squarespace-2-languages/

Thank you very much

@tuanphan Is there a way to make the above code also work on mobile displays? Thanks!

18 hours ago, Burchard said:

@tuanphan Is there a way to make the above code also work on mobile displays? Thanks!

What is your site url? We can check mobile code easier

I'm working this out on maartenrots.nl

On 4/29/2023 at 4:17 PM, Burchard said:

I'm working this out on maartenrots.nl

To hide Mobile Primary, use this code

<style>
  nav.Mobile-overlay-nav.Mobile-overlay-nav--primary {
    display: none;
}
</style>

To hide Mobile Secondary, use this code

<style>
  nav.Mobile-overlay-nav.Mobile-overlay-nav--secondary {
    display: none;
}
</style>

Works like a charm, thank you!

On 8/20/2020 at 3:39 AM, tuanphan said:

To hide primary on one page, add this to Page Settings > Advanced > Header (If you use Personal Plan > Add Code Block)

<style>
  nav.Header-nav.Header-nav--primary {
    display: none;
}
</style>

To hide secondary, use this code

<style>
  nav.Header-nav.Header-nav--secondary {
    display: none;
}
</style>

Hi! I used this code and it didn't work for me :(.

This is the code I used in the code injection footer to create my secondary menu. (my secondary menu folder is titled (/secondary-nav)

<script src="https://code.jquery.com/jquery-3.5.1.min.js"></script>
<script src="https://assets.codepen.io/3198845/WMSecondNavFREEv1-4.js"></script>
<div data-wm-plugin="subnav"
     data-position="top-right">
</div>

On 7/11/2024 at 6:02 AM, crisherrera said:

Hi! I used this code and it didn't work for me :(.

This is the code I used in the code injection footer to create my secondary menu. (my secondary menu folder is titled (/secondary-nav)

<script src="https://code.jquery.com/jquery-3.5.1.min.js"></script>
<script src="https://assets.codepen.io/3198845/WMSecondNavFREEv1-4.js"></script>
<div data-wm-plugin="subnav"
     data-position="top-right">
</div>

 

Use this code, if it doesn't work, please share site url, we can check easier

<style>
  [data-wm-plugin="subnav"] {
  	display: none !important;
  }
</style>

15 hours ago, tuanphan said:

Use this code, if it doesn't work, please share site url, we can check easier

<style>
  [data-wm-plugin="subnav"] {
  	display: none !important;
  }
</style>

 

It didn't work. When I put it in header code injection it hides it on mobile but it's still visible on site. 

When I put the code in the individual page header code it does nothing 😞

here's my site: crisherreras.com 

it's currently under construction so it's password protected. do you need the password?

What I'm trying to do is hide secondary nav on pages: home (/home), my new book and events and have the secondary nav visible on home (/fashion), custom, shop and care + repairs. I currently have the primary nav hidden on (/fashion), custom, shop and care + repairs but the secondary nav doesn't blend with the header the way it should. 

On 7/14/2024 at 6:39 AM, crisherrera said:

It didn't work. When I put it in header code injection it hides it on mobile but it's still visible on site. 

When I put the code in the individual page header code it does nothing 😞

here's my site: crisherreras.com 

it's currently under construction so it's password protected. do you need the password?

What I'm trying to do is hide secondary nav on pages: home (/home), my new book and events and have the secondary nav visible on home (/fashion), custom, shop and care + repairs. I currently have the primary nav hidden on (/fashion), custom, shop and care + repairs but the secondary nav doesn't blend with the header the way it should. 

What is password?

yellow

13 hours ago, tuanphan said:

What is password?

On 7/14/2024 at 6:39 AM, crisherrera said:

It didn't work. When I put it in header code injection it hides it on mobile but it's still visible on site. 

When I put the code in the individual page header code it does nothing 😞

here's my site: crisherreras.com 

it's currently under construction so it's password protected. do you need the password?

What I'm trying to do is hide secondary nav on pages: home (/home), my new book and events and have the secondary nav visible on home (/fashion), custom, shop and care + repairs. I currently have the primary nav hidden on (/fashion), custom, shop and care + repairs but the secondary nav doesn't blend with the header the way it should. 

To hide secondary nav on home, my new book, events, you can use this code to Custom CSS box

#collection-64b5b11a460d3e031bd7cb2d, #collection-667a499d6c85c439e299361d, #collection-668dda842d48ea0e38a240cc {
div#wm-subnav {
    display: none !important;
}}

On 7/19/2024 at 3:00 AM, tuanphan said:

To hide secondary nav on home, my new book, events, you can use this code to Custom CSS box

OMG thank you that worked!! The only problem I'm having now though is the primary menu is still visible on mobile, and the secondary menu is above the site logo/title. Any way I can fix that?

On 7/21/2024 at 1:58 AM, crisherrera said:

OMG thank you that worked!! The only problem I'm having now though is the primary menu is still visible on mobile, and the secondary menu is above the site logo/title. Any way I can fix that?

Screenshot 1: I see you solved?

Screenshot 2. Use this new CSS code

#collection-64b5b11a460d3e031bd7cb2d, #collection-667a499d6c85c439e299361d, #collection-668dda842d48ea0e38a240cc {
.cloned-subnav.mobile-subnav {
    display: none !important;
}
div#wm-subnav {
    display: none !important;
}}