Jump to content

Style mobile navigation menu

Go to solution Solved by Ziggy,

Recommended Posts

Hi everyone!

I am currently redesigning my website and I am trying to style my mobile navigation menu through custom CSS. 

https://www.thesoaresprotocol.com/

I would like to reduce the size of the font and space it out more properly. I hid my desktop menu links with a custom CSS code I found, just so you know.

The password to access it is bringtemplatesback (yes, because 7.1 sucks).

Thank you for your help!

image.png.9d0aceac2c45937409f4096bdf65dd51.png

 

PS: I'm also trying to remove the original templates navigation links on the bottom, any idea?:

image.png.d97e60d468ea54b79d1de84e1d40d036.png

Edited by A1Protocol
Link to comment
28 minutes ago, A1Protocol said:

space it out more properly

Can you define this?

Share your website URL?

Please like and upvote if my comments were helpful to you. Cheers!

Zygmunt Spray
Squarespace Website Designer
Contact me: 
https://squarefortytwo.com 

  Did I help? Buy me a coffee?

🔌 Ghost Squarespace Plugins (Referral link)
📈 SEO Space (Referral link)
 SquareWebsites Plugins (Referral link)
 🔲 SQSP Themes (Referral link) 
Spark Plugin (Referral link) 

Link to comment
  • Solution

Try this Custom CSS:

.header-menu-nav-item a {
  font-size: 6vmin;
  line-height:1.2em;
  margin: 3vw 5vw;
}

There are some values in there for you to tweak and get looking how you want.

The first margin value (3vw) is top/bottom, the second value (5vw) is the left/right.

Please like and upvote if my comments were helpful to you. Cheers!

Zygmunt Spray
Squarespace Website Designer
Contact me: 
https://squarefortytwo.com 

  Did I help? Buy me a coffee?

🔌 Ghost Squarespace Plugins (Referral link)
📈 SEO Space (Referral link)
 SquareWebsites Plugins (Referral link)
 🔲 SQSP Themes (Referral link) 
Spark Plugin (Referral link) 

Link to comment

Try this CSS:

.item-pagination[data-collection-type^="portfolio"] {
    display: none;
}

Please like and upvote if my comments were helpful to you. Cheers!

Zygmunt Spray
Squarespace Website Designer
Contact me: 
https://squarefortytwo.com 

  Did I help? Buy me a coffee?

🔌 Ghost Squarespace Plugins (Referral link)
📈 SEO Space (Referral link)
 SquareWebsites Plugins (Referral link)
 🔲 SQSP Themes (Referral link) 
Spark Plugin (Referral link) 

Link to comment
16 minutes ago, A1Protocol said:

Thank you so much Ziggy! You are my savior!

Happy to help, enjoy your weekend!

Please like and upvote if my comments were helpful to you. Cheers!

Zygmunt Spray
Squarespace Website Designer
Contact me: 
https://squarefortytwo.com 

  Did I help? Buy me a coffee?

🔌 Ghost Squarespace Plugins (Referral link)
📈 SEO Space (Referral link)
 SquareWebsites Plugins (Referral link)
 🔲 SQSP Themes (Referral link) 
Spark Plugin (Referral link) 

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

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.