Jump to content

Trying to customize mobile/tablet navigation font, working on desktop view.

Recommended Posts

Site URL: http://www.kaedystovallphotography.com

Hello everyone, I'm fairly new to custom CSS and I'm having a heck of a time trying to get my drop down navigation menu (for mobile/tablet) to use my custom font. Is there a specific code I'm needing to enter to get it to change my font?

Currently using:

@font-face {
font-family: AlmondWhisp-d9KAX;
src: url(https://static1.squarespace.com/static/57e2e03ad1758e22fa51f34b/t/61cbd6578b9e9864a3884b38/1640748632075/AlmondWhisp-d9KAX.ttf);

Here are pictures of my website, one in mobile/tablet view (which doesn't have the correct font) and one in desktop view (that is correct). Thank you for your help!

Screenshot 2021-12-28 234851.png

Screenshot 2021-12-28 234932.png

Link to comment

Mobile nav uses a different class name.

Don't remove/edit any code in your current code

Add this to Design > Custom CSS

/* mobile nav font */
div.overlay-nav-wrapper * {
    font-family: 'AlmondWhisp-d9KAX' !important;


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

Contact Customer Care - Learn CSS - Buy me a coffee (thank you!)

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.