Prestige Theme - Change font in Main Navigation + Change font heading on collection overview

[Vibe21]

Hi everyone,

I've been trying to figure out how to customize a few things in the Prestige theme (Vogue).

Unfortunately, my CSS skills are quite basic and I cannot find the solution in the community.

My goal is to:

1. Change the font-family in the main navigation menu (navigation style center) - (SKINCARE, BODY, HAIR etc. https://prestige-theme-vogue.myshopify.com/)
2. Change the font-size of the header of a collection (e.g. Body on the page https://prestige-theme-vogue.myshopify.com/collections/body-1)
3. Change the font-size of the description/info of a collection (e.g. Who doesn't... on the page https://prestige-theme-vogue.myshopify.com/collections/body-1)

Thanks a lot for your help!

Kind regards,

Victor

[TBCutomsUK]

I haven't worked out the font bit yet but steps 2 and 3, add this to you themes css whis is located in Assets>theme.scss.liquid

.SectionHeader__Heading.SectionHeader__Heading, .SectionHeader__SubHeading.SectionHeader__SubHeading {
    font-size: 40px!Important;
}

.SectionHeader--center .SectionHeader__Description {
    font-size: 20px!Important;
}

  Change the sizes to suit

[Vibe21]

Hi there,

Thanks a lot for your help.

The solution does work, but unfortunately a lot of headers on the homepage change as well (as a result they are too large).

Is there a way to only change the font-size on the collection banner?

Also, if there is anyone else who has experience with changing the font-family in the navigation. Your help is very much appreciated!

Kind regards,

Victor

[Slurrie]

The code above works great, but if you only want to apply it to a certain part of the theme you'll need to add which section you want it to apply to.

I just used this to apply a custom font only to the slideshow banners like this.

div#shopify-section-slideshow
.SectionHeader__Heading.SectionHeader__Heading, .SectionHeader__SubHeading.SectionHeader__SubHeading {
font-family: "Frauen Roman"!Important;
}

.SectionHeader--center .SectionHeader__Description {
font-family: "Frauen Roman"!Important;
}

I think if your just trying to change the main navigation menu in the header you'd need to use

div#section-header