I installed the Brand Header Theme Component. It looks great! Now I want to change the title text to my brand font, which is Harman Sans. I uploaded the font itself. When I try to change the CSS, I seem to break the text. I see the instructions on using a custom font elsewhere in this forum, but I’m unsure where to put the different components from those instructions. I’m looking at my CSS and I’m not sure what to edit: @import "theme_variables"; .b-header { width: 100%; background-color: $tertiary; height: 48px; margin-bottom: 0; .contents { margin: 8px 0; } .title { float: left; margin-right: 24px; a { color: $secondary; } &:visited { color: $secondary; } .rtl & { float: right; margin-left: 24px; margin-right: 0; } }

if you go look at the CSS for the Material Design Theme, you will see what they did with the font there.

I just looked. It’s very clean! But I don’t think I can do that – I’m not using a Google Font. I have to upload the font as an asset (which I’ve done) – and then point it at the header. I’m trying to make sense of this advice, here: Include assets (e.g. images, fonts) in themes and components It’s detailed! I just don’t know where I should put these pieces of text.

You place that into your Theme CSS and use the name in your uploads. Named like this pic [uploaded-font]

Trouble changing Header font in Brand Header Theme

Product Support

Daniel_Wallace (Daniel Wallace) August 4, 2020, 4:22pm 5

I was taking the instructions too literally. Now it works! Thank you again!

Topic		Replies	Views
Add a custom font to my theme via the assets repository Development	7	1821	April 11, 2023
Custom font for single word in a theme Development	1	116	September 14, 2024
Changing the font of the h2 'site text logo' Product Support	1	933	October 14, 2016
Anyone embedding fonts successfully? Product Support	11	3057	April 20, 2020
Changing the header font for Custom Header Links Development custom-header-links	2	349	May 19, 2020

Trouble changing Header font in Brand Header Theme

Related topics