FONT IMPORT NOT DISPLAYING APPROPRIATELY

Tagged: 

Author Posts

Nicklas

Hi there,

Reaching out to enquire about font imports. Running into an issue where I have successfully imported the Bai Jamboree font from Google and assigned the 400 font weight. But for some reason the font is not displaying itself with a bold font and it looks different. I have done a draft template with this same font before with local code (vscode & @import tag) and the font was displayed appropriately. But for some reason it’s not displaying properly with the exact same characteristics when using Microthemer. Thank you for your assistance.


Sebastian

Hey Nicklas,

Apologies for the slow reply, I’m currently on holiday and couldn’t get to my laptop yesterday.

It would help if you could send me a link to a page with the font. But from what you describe, it seems possible that you need to specify the bold (700) variation of the font when using the Google Fonts browser inside Microthemer. By default, Microthemer will load the normal weighted font, and no others. This ensures Microthemer doesn’t add more KBs of fonts than necessary. But when setting bold on a font that hasn’t been loaded in bold typeface, the browser will resort to a faux bold rendering, which looks odd.

The following video shows how to insert fonts using a specific weight or any other kind of variation:

https://themeover.com/google-fonts/

In the “Google Font” field, Microthemer will add something like “Bai Jamjuree (700)” after you click the “Use font” button. The (700) bit will be stripped from the CSS output, but it tells MT to load that variation of the font, so it renders properly in bold.

Does that help at all?

Cheers,
Sebastian

You must login or register to reply to this topic.