Edit font for header and menu on Minimal theme

Solved
Nuccy
Tourist
5 0 0

Hello,

I am working on my website and have managed to change the title and parts of the website to my personal font but not the menu.

I have added codes that only change the header but not the navigation bar.

Can you help?

The line of code I already added was this:

@font-face {
font-family: "Bauhaus_93_Regular";

src:url('{{ "Bauhaus_93_Regular.ttf" | asset_url }}') format("truetype");

}
h1, h1 a, h2, h2 a, h3, h3 a, h4, h4 a, h5, h5 a, h6, h6 a, #nav li a, div.title a, .headline, .subtitle { font-family: 'Bauhaus_93_Regular' !important; }

 

Thank you so much !

xx

 

0 Likes
UmairA
Shopify Partner
872 85 173

Hey there @Nuccy,

Can you please include the URL of your store? I'll take a look for you before I can offer any solution/guidance. Thanks

Need help with theme customization or to add a new feature? Hire me
Email: umairabbascs@gmail.com
WhatsApp: WhatsApp
Theme customization | Custom coding | Store Setup | SEO Audit | Speed Optimization | Tweaks & Bugs fixing
0 Likes
Nuccy
Tourist
5 0 0

Yes of course.

the link is: nuccy.co.uk

and the password for you: helpnuccy

Thank you

0 Likes
g33kgirl
Shopify Partner
223 58 70

Hello @Nuccy, did you get this sorted?

If you found my answer helpful, please LIKE and ACCEPT.
buymeacoffee.com/g33kgirl ☕
If you're not comfortable with code, please modify code files at your own risk.
Do NOT give out your passwords unless absolutely necessary.
0 Likes
Nuccy
Tourist
5 0 0

Hi,

No I did not

0 Likes
g33kgirl
Shopify Partner
223 58 70

You can add this code to timber.scss.css:

.site-nav {
    font-family: 'Bauhaus_93_Regular' !important;
}

 

If you found my answer helpful, please LIKE and ACCEPT.
buymeacoffee.com/g33kgirl ☕
If you're not comfortable with code, please modify code files at your own risk.
Do NOT give out your passwords unless absolutely necessary.
Nuccy
Tourist
5 0 0

Hello,

Great thank you so much it worked !

And what would be the code if I want the header to have that font as well ?

Also, if I want to change the font for the body of text, what should I add ?

 

Thanks again.

0 Likes
g33kgirl
Shopify Partner
223 58 70

This is an accepted solution.

To change the header font, add this to the CSS:

.header-bar {
    font-family: 'Bauhaus_93_Regular' !important;
}

 

To change body text font,

body, input, textarea, button, select {
    font-family: 'Bauhaus_93_Regular' !important;
}

 

Basically, I think you should just replace the original font-family in the timber.scss.css file by using Find and then replace font-family with your choice.

If you found my answer helpful, please LIKE and ACCEPT.
buymeacoffee.com/g33kgirl ☕
If you're not comfortable with code, please modify code files at your own risk.
Do NOT give out your passwords unless absolutely necessary.
Nuccy
Tourist
5 0 0

Ok perfect, it worked !

Thank you so much for your help.

0 Likes