add new font to themler

Hi,

Themler uses system fonts (installed in your system) and google fonts. It does not provide own fonts library.
If you want to use custom font I suggest that you try the following solution:
1. install it in your system and use it as system font. But in this case the font will not be visible to your site visitors who do not have it installed. So you need to link it to the project.
2. For this you need to upload font file (ttf, woff, etc) to your webserver and link to the theme using @font-face css rule.
http://www.w3schools.com/cssref/css3_pr_font-face_rule.asp

The custom css can be added to he Themler Home tab >> Settings >> Additional CSS.

Thank you,
Olivia

Hi,

How can i do this?

i have this font:
https://www.dafont.com/search.php?q=kg+somebody

Download it and installed on Windows.
Then uploaded to the root folder of WWW.

And in the Settings of Themler:
Additonal CSS:

@font-face {
font-family: KG-somebody;
src: url(https://www.domeinname.com/KGSomebodyThatIUsedToKnow.ttf);
}

I dont see the font appear into the text fonts.

Hi,

You need to apply the font to some element. For example:
h1
{
font-family: KG-somebody;
}
It will work of the link to the font is correct, if browser can display ерша format of font and the font was not blocked by CORS policy.

Thank you,
Olivia

Hi Olivia,

Thanks for your quick reply.
But im sorry, but I cant make this work :(

I have add this into the Additional CSS:

@font-face {
font-family: 'KG-somebody';
src: local('KGSomebodyThatIUsedToKnow'), url(https://www.domeinname.com/KGSomebodyThatIUsedToKnow.ttf) format('truetype');
}

h1
{
font-family: KG-somebody;
}

Then I add a text element, with H1. But it shows the chosen font of Themler, not the CSS one.

Last edited 23 January 2018 by plexforce

Hi,

Do you mean that you're using exactly the code you provided?
The link to the font is not real:
https://www.domeinname.com/KGSomebodyThatIUsedToKnow.ttf
Looks like this is dummy code. You need the real link to the existing font.

Thank you,
Olivia

Yes ofcourse :) haha, I just put a dummy, the real link works. (when i click, it download the font.)

plexforce,

Have you managed to solve the issue with custom fonts?
If not please create a new private topic and provide us with the code you're using with real links and a link to the website that demonstrates the issue.

Thank you,
Olivia

i have get this code (its ok on pc but i cant see it on android phone)
what is wrong in this code for see it in my phone ?

@font-face {
rc: url('HTTPS//.....................');
font-family: 'market_decoregular';
src: url('market_deco-webfont.eot');
src: url('market_deco-webfont.eot?#iefix') format('embedded-opentype'),
url('market_deco-webfont.woff2') format('woff2'),
url('market_deco-webfont.woff') format('woff'),
url('market_deco-webfont.ttf') format('truetype'),
url('market_deco-webfont.svg#market_decoregular') format('svg');
font-weight: normal;
font-style: normal;
}

Hello,

The second line is definitely wrong, maybe a typo.
Then, it is recommended to use absolute URLs for font sources.

Sincerely,
Nettie

Yes, it’s usually possible, and I’ve been there myself. When I was customizing a theme and couldn’t find the right font, I realized how beautiful fonts have revolutionized how people express themselves visually in the digital world—it really is about presentation, not just content. Most themes let you add custom fonts by uploading font files or linking them through CSS, even if they’re not in the default font family. While experimenting, I explored typography resources like letrabonitas.com for inspiration and style ideas. Once I added a custom font, the whole site felt more personal and visually engaging.

Adding a new font that’s not in your theme’s default font family can be tricky but usually possible by uploading custom fonts via your site’s CSS or using plugins. It depends on the platform and theme flexibility. It reminds me of how everyone loves Instagram but struggles with plain default fonts—that’s why I use igfontsgen, an Ig Font Generator that creates cool, unique font styles you can copy-paste anywhere without needing to install fonts. It’s a quick and free way to make your text stand out, especially if your theme limits font choices.