We're moving the community! Starting July 7, the current community will be read-only for approx. 2 weeks. You can browse content, but posting will be temporarily unavailable. Learn more

Customizing Navigation Font

Customizing Navigation Font

musedesigns
Shopify Partner
4 0 0

Hi, I have successfully integrated custom fonts to my shopify development store but they don't seem to be working for the Navigation Menu or Buttons.  Can anyone help with this?

 

Thanks
Dev

Replies 3 (3)
musedesigns
Shopify Partner
4 0 0

Thanks Naeem, I am using the theme.css to integrate custom fonts and not the theme selector.  So it doesn't appear in the typography stack.

 

Dev

musedesigns
Shopify Partner
4 0 0

Hi Junia2!  Thanks for much for the response.  I went through the steps you suggested.  It worked for the buttons!  Thats awesome thanks.

 

It still didn't work for the navigation fonts.

 

The fonts seem to be working across the rest of the site great so I am assuming the font files have been uploaded properly.  I uploaded OTF files.

Here is the CSS 

 

@font-face { font-family: Salsiccia; src: url('https://cdn.shopify.com/s/files/1/0692/9534/1625/files/Salsiccia.otf?v=1732299435'); }
h2,h3,h4,h5,h6 {
font-family: Salsiccia !important;
}

@font-face { font-family: Antisocial; src: url('https://cdn.shopify.com/s/files/1/0692/9534/1625/files/Antisocial.otf?v=1732302953'); }
p,body,html {
font-family: Antisocial !important;
}

.btn {
font-family: 'Salsiccia', sans-serif !important;
}

nav li a {
font-family: 'Antisocial', serif !important;
}

 

Appreciate the assistance!

 

Dev

musedesigns
Shopify Partner
4 0 0

Hi 🙂 it actually didnt' work for the nav only the buttons.  Could you help with that?