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

Mobile Menu SS7.1 -burger +keeping menu

Question

Posted (edited)

Site URL: https://anythingtrial.squarespace.com/

password: anything

Hello! 

I am customizing the menu to learn how to hide various menu items per page. 

I am adding this (.header-nav-item:nth-child(n+2){display:none!important}) to hide the items after the first one but it only works on desktop view. On Mobile it shows all the items. Also, prefer not to have the Burger and just leave the menu as the one item displayed on the page. I think this is useful for everyone but especially so for multilanguage sites...

Thank you so much

In total>

  • How to in mobile get rid of Burger and keep regular menu in 7.1
  • How to hide all items after n+2. Currently, if i try to do that with , it hides the info inside the folders as well.... 
    (for desktop view in header code injection it is this: 
    .header-nav-item:nth-child(n+2){display:none!important}

I've searched and searched...

 

 

 

Screen Shot 2020-04-23 at 2.46.50 AM.jpg

Edited by mishmush

Share this post


Link to post

5 answers to this question

Recommended Posts

  • 0

How to in mobile get rid of Burger and keep regular menu in 7.1

@media screen and (max-width:991px) {
.burger-box {
    display: none;
}
.header .header-title-nav-wrapper .header-nav {
    display: block;
}
}

How to hide all items after n+2. Currently, if i try to do that with , it hides the info inside the folders as well.... 
(for desktop view in header code injection it is this: 
.header-nav-item:nth-child(n+2){display:none!important}

You mean items in Dropdown Menu (anything, event schedule,...) or? 


You can send your question to my email to get faster answer.

How to Setup Password & Share URL  Armadillo - Free portfolio template

Share this post


Link to post
  • 0

This was fast. Code looks so nice. This is a tricky one. I updated.

The burger box is still there so when i click on mobile it still displays both. the box menu and the burger menu.

Also there is something funny with spacing of the whole box its going outside of the mobile area... getting lost on the right. Interesting problem with 7.1. Thank you for answering so many questions. 

 

3.jpg

Share this post


Link to post
  • 0

Hm. The first one works better!

aside form clicking on the burger? You notice how the cat face and words in menu are getting cut off on the right on mobile? It does this in vertical view on the phone but not horizontal which is interesting.  

Maybe there is a way to move the burger way over off screen whle also no displaying it and that could get rid of it? like a padding or margin. Yeah, I am still learning this,  and will be taking an actual class soon so i learn how to talk to computers better. Cause conceptually I get it but my language skill are... abominable 🙂

Thank you so much for this, its inspiring 🙂

Share this post


Link to post
  • 0
1 minute ago, mishmush said:

Hm. The first one works better!

aside form clicking on the burger? You notice how the cat face and words in menu are getting cut off on the right on mobile? It does this in vertical view on the phone but not horizontal which is interesting.  

Maybe there is a way to move the burger way over off screen whle also no displaying it and that could get rid of it? like a padding or margin. Yeah, I am still learning this,  and will be taking an actual class soon so i learn how to talk to computers better. Cause conceptually I get it but my language skill are... abominable 🙂

Thank you so much for this, its inspiring 🙂

@media screen and (max-width:991px) {
.header-nav {
    position: relative;
    left: -20px;
}
}

 


You can send your question to my email to get faster answer.

How to Setup Password & Share URL  Armadillo - Free portfolio template

Share this post


Link to post

Create an account or sign in to comment

You need to be a member in order to leave a comment


×
×
  • Create New...