Google fonts
Load any Google Font in Miyus with a small code injection — embed code plus the --body-font and --title-font CSS variables.
While the Miyus theme supports Ghost's native typography options, you can manually inject any external library from Google Fonts to achieve a specific visual signature.
Native Alternative
Before proceeding, check out Ghost's Native Custom Fonts option which may be simpler for standard branding needs.
Obtain the Embed Code
Visit fonts.google.com and select your preferred font family.
Select the weights you need and click the Get embed code button.
Configure in Ghost
Navigate to the Code injections settings in Ghost Admin.
In the Site header section, paste the <link> or @import code you copied from Google.
Directly below the embed code, paste the following styling block.
Replace "Font Name Here" with the font family name from the font-family: ... CSS rule Google shows alongside the embed code (e.g. "Roboto").
This override wins over Ghost's font picker
Setting --body-font or --title-font here takes priority over any font chosen in Ghost's native Typography settings. If you use this injection, manage your fonts here — changes in the admin font dropdowns won't show.
<style>
:root {
--body-font: "Font Name Here", sans-serif;
}
</style>
Setting a Separate Title Font (Optional)
You can specify a distinct font for headings and another for the body text for a more dynamic editorial look.
Important
When selecting multiple fonts, Google Fonts regenerates a single unified embed code. Ensure you copy the latest version from their panel to include all font families in one payload.
Select your second font on Google Fonts and copy the updated embed code.
Add the --title-font variable to your style block as shown below.
<style>
:root {
--body-font: "Body Font Name", sans-serif;
--title-font: "Title Font Name", serif;
}
</style>