How to change the font at the top bar

Johannes Genberg Posted in Technical Support 5 years ago

How do I do that?

Replies
se Johannes Genberg Replied 5 years ago

I'm not asking for advice on simple programming, I'm asking for help with one particular problem. A lot of people are asking, and getting, help here. How is that a bad thing?

German Michael Zülsdorff Replied 5 years ago

Hi Johannes,

1.) there's another thread and you said "the site takes a long time to finish loading"
Having that in mind, the last thing I'd recommend is loading an additonal font file because it would slow down loading times even more

2.) this forum isn't meant to teach basic programming, and actually you'll find answers like that by simply googling "css usee custom font" for example

se Johannes Genberg Replied 5 years ago

I am still hoping someone can help me here. I have tried for months to find a solution, and I know it must be a really easy solution, but my knowledge is too limited to find it.

Please someone? :)

se Johannes Genberg Replied 5 years ago

OK, thanks. But what do I do next?

gb Rishi B Replied 5 years ago

what I was saying about the !important flag was that you can specify a font-family in another css rule and overwrite the font-family that is specified in the rule for body. for example:

.topbar .site-name a {
    text-transform: lowercase;
    font-size: 25px;
    padding: 10px;
    color: #fff;
    display: block;
    font-weight: normal;
    font-family:"Helvetica Neue",Helvetica,Arial,sans-serif" !important;
}

the !important flag overrides any existing css rule that would otherwise be applied.

se Johannes Genberg Replied 5 years ago

My knowledge of CSS and HTML is limited. I hope there is someone out there who knows and who has the time to explain this to me :)

gb Rishi B Replied 5 years ago

you can use the !important flag to override existing css rules, so that might help solve your problem. unfortunately I'm not great at css myself.

se Johannes Genberg Replied 5 years ago

Hello

I wish I was better at CSS. I am able to change the size and into lowecase here (this is pretty self-explanatory for me):

.topbar .site-name a {
    text-transform: lowercase;
    font-size: 25px;
    padding: 10px;
    color: #fff;
    display: block;
    font-weight: normal;
}

but I am not able to find where to change the font. Apparently I need to change something in body, but I can't find this part:

    body {
    font-family: "PT Sans",sans-serif,"Apple Color Emoji","Segoe UI
    Emoji","NotoColorEmoji","Segoe UI Symbol","Android Emoji","EmojiSymbols";

All I want to do is to change the font at the top to a ttf-font called Biysk.ttf, which I have uploaded to root. But the code is so confusing to me that even with the help of Google I can't figure out what to do where.

se Johannes Genberg Replied 5 years ago

Thanks :)

Indonesian Arsalan Shah Replied 5 years ago

You can change it in themes/goblue/plugins/default/css/core/default.php