Jump to content

How do I hide one link with CSS?

Recommended Posts

  • Replies 29
  • Views 34.6k
  • Created
  • Last Reply
  • 1 year later...

I want to hide “ABOUT” folder or any other page link from the navbar in my site too http://www.inwhirlofinspiration.com/ Can you help me? The template is Montauk.

I tried this but it hides the all the drop down folders:

#topNav nav ul li.folder-collection

I want to hide just one, this has the


How to add this info in the code?

If I want to hide the second drop down menu, the CATEGORIES, for example, I will change the code, to:

topNav nav ul li.folder-collection ul>: second-child { display: none }

Link to comment

@penia – So we’re clear, you only want to hide the “About” nav li? If so, add this:

#topNav nav ul> :nth-child(2) {
 display: none;

Otherwise, if you are trying to hide folder within the nav li then you may need something like:

#topNav nav ul li.folder-collection ul> :nth-child(2) {
  display: none;

I hope this helps! If not, let me know and I’ll search some more.

Link to comment

Dear rwilson,You seem the only one who can help... I am a bit like Penia... and even worse as I am french ;-). I am working with the aviator template (previously on marquee)... and I am trying to set up a bi-lingual site (French and English) on Marquee Nick Scolas tutorial was working with a bit of code injection + CSS... that does not seem to work either anymore or on aviator template...

l tried to find my way through your tutorial, but either don't get it (I tried several things that I found here) but my nav bar always displays completely in both languages...

Link to comment

I have 10 french pages (of which one folder + blog page) and the same in english...

So i I understood right you take the ID collection of page let's say "ABOUT" and then you repeat the none display thing for all french (10) navigation titles (related to pages), is that right ? If yes then i can only say I did it and nothing happened...

Please help ! I need this website and we have no budget to make a real complete site by someone.

thanks so much

Link to comment

Hi rwilsonThe idea is to have a french version and english version of the site. So at the moment on my top nav bar, I have all together... all the french pages L-EST - A PROPOS - Appel à bourses - ARTISTES (folder) - News - Liens - Agenda - Contactand all english pages L-EST - ABOUT - Call for grants - Artists (folder) - News - Links - Events - Contact

Link to comment

I created on top page the two Languages linked for "français" to the french homepage and for "english" linked ti the english hompeage... but I am not sure I am right there... well anyway. the idea would be that whenever I am on french version, or better on a french page, all english pages are hidden and when I am on an english page all french pages are hidden and then the ideal would be to have the choice of language by clicking on my top language choice links

Link to comment
  • 4 weeks later...
  • 1 month later...

Hi! I'm using the Adirondack template:


and want to hide top nav items 1-5 for English version, and items 6-7 for Chinese version. I've tried the suggested code above but nothing changes.

.collection-537c8011e4b0785074d40dc6 #TopNav nav ul li.folder-collection ul>:nth-child (5) {display: none;}
.collection-537c8011e4b0785074d40dc6 #TopNav nav ul li.folder-collection ul>:nth-child (6) {display: none;}
.collection-537c8011e4b0785074d40dc6 #TopNav nav ul li.folder-collection ul>:nth-child (7) {display: none;}
.collection-537c8011e4b0785074d40dc6 #TopNav nav ul li.folder-collection ul>:nth-child (8) {display: none;}
.collection-537c8011e4b0785074d40dc6 #TopNav nav ul li.folder-collection ul>:nth-child (9) {display: none;}

Should my #topNav be replaced something else? #header-wrapper? #folder-collection? #main-navigation? I've tried all but none worked.

Note some of my top nav items are single pages and some of them are folders.

Thanks so much in advance!!!

Link to comment
  • 3 months later...

rwilson, you are a life saver, thanks so much for your code!

I have it working now, but the menu items are still visible on the mobil site. Does anyone know how to fix this? I’ve tried the solution listed here: Hiding specific items in main navigation bar?

But it’s not working for me, and makes the code appear on my page as text.

I am admittedly rather inexperienced with coding, if anyone out there can help I’d be super grateful.

Thanks in advance!

Link to comment
  • 1 month later...
  • 1 month later...
  • 2 months later...

does anyone know how to hide links using the "Five" template? i have a client who wants a multilingual site and it seems hiding links is the best workaround approach, but i haven't been able to get it to work with his site, which uses "Five."

thanks much,


Link to comment


This topic is now archived and is closed to further replies.

This topic is now closed to further replies.

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