Jump to content

Mobile Nav / Header Edit

Recommended Posts

Site URL: https://www.kaizenmarketplace.com

Hey guy, how would I edit the mobile menu so it functions differently. I'd prefer it to open out with a transparent background rather then going full screen with larger text. I have attached screen grabs of the current site (see the soft green colour) and I'm hoping to get something similar to the alldey.com mobile nav bar, also attached a screen grab! Thank you :)

Screenshot 2020-04-06 at 11.12.17.png

Screenshot 2020-04-06 at 11.12.23.png

Screenshot 2020-04-06 at 11.36.40.png

Screenshot 2020-04-06 at 11.36.47.png

Link to comment
  • Replies 9
  • Created
  • Last Reply

Add to Home > design > Custom CSS

.header-menu-bg.theme-bg--primary {
    background: transparent !important;
}
.header-menu-nav-folder-content {
    justify-content: flex-start;
}

 

Email me if you have need any help (free, of course.). Answer within 24 hours. 
Or send to forum message

How to: Setup Password & Share url Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care

Link to comment

Amazing, thank you.

Is it possible to have all text sit under the menu button in a much smaller font size? As well as changing the font size to Acumin small header?

I have added an example website image for visual reference.

Thank you for your help

Screenshot 2020-04-07 at 17.04.36.png

Screenshot 2020-04-06 at 11.36.47.png

Link to comment

tell me one thing that if i want to edit my nav bar same as above in my website ninja store, then what i have to edit in my website code. also i don't know much about coding i.e. help me with your suggestions.

Link to comment
On 4/9/2020 at 2:57 PM, SSchroder said:

That looks really great, thank you.

 

One last thing, when we now x out of the menu, there's a slight glitch and we see the larger fonted previous menu flash before the menu is closed.

I can't access your site. Can you check again?

Email me if you have need any help (free, of course.). Answer within 24 hours. 
Or send to forum message

How to: Setup Password & Share url Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care

Link to comment

Archived

This topic is now archived and is 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.