I wanted to share this help article regarding which templates support custom fonts. Can you please confirm if your landing page has a starter template, a coded template, or a theme template?
Thank you!
Best,
Kristen
Did you know that the Community is available in other languages? Join regional conversations by changing your language settings !
According to this knowledge base article, your account has access to up to 20 landing pages with starter templates only. Custom fonts are not available for starter templates.
What you may want to consider instead is creating a webpage since you have access to all templates (starter, themed, or coded) according to the help article linked above. You can use custom fonts with a theme or coded template.
Hope this helps 🙂
Best,
Kristen
Did you know that the Community is available in other languages? Join regional conversations by changing your language settings !
Adding a custom font will not add the font to styling dropdown menus in the content editor.
Can you confirm that you have uploaded the font to Design Tools (also known as Design Manager) and added it to the stylesheet? Here are directions on how to do so. Can you also please share which theme you are using? Is it the Growth Theme Template?
Thanks!
Best,
Kristen
Did you know that the Community is available in other languages? Join regional conversations by changing your language settings !
If you only want to apply this custom font to a single page, you can use the advanced options section of the page in to either add some additional HTML or attach a custom stylesheet.
If you only want to apply this custom font to a single page, you can use the advanced options section of the page in to either add some additional HTML or attach a custom stylesheet.
Thank you for your patience while I was looking into this. I hear you on this being a lengthy process and I appreciate your feedback regarding the knowledge base document.
The reason we are not seeing this option on your page is that it is associated with a theme.
Here are the steps you'll want to take to add a custom font. Please note that they require some coding knowledge:
1) Click on the "Edit this Template" button under "Templates" in the page settings. The template will open in the Design Manager.
2) Once you have opened up Design Manager, you'll need to click on "Create a Child Theme" in order to make edits to the theme itself.
3) Follow these directions to upload your custom fonts to the theme (please note this requires some CSS and JSON coding). You'll need to add the fonts folder and create the files described in the developer documentation.
I also wanted to tag in our subject matter experts to see if they have any tips on uploading custom fonts to a theme in a free account.
Custom fonts can be a little challenging because they do require code experience.
While you can create a child theme and add the custom fonts as Kristen suggested, you would also have to move all of your pages to the child theme.
As an alternative, you can use the Site Header HTML to configure the fonts - all the code below needs to be within the Style HTML tags as noted in the link.
Here's what I would do:
1 - move the fonts from Design Tools to Marketing > Files > fonts (add a folder and load the files there).
This will provide you a much easier to use URL for configuring the fonts in the code.
Once you have the files loaded, you'll view the details to copy the URL and use that in the code below, make sure you update all 4 URLs.
2 - you'll need to add a font-face declaration for each font weight you want to use in the site header HTML as noted above - update the code below with the URLs from step 1
3 - this is the challenging part, you'll need to redefine the fonts used in Growth theme with your new font family - this will essentially overwrite the theme settings for the font family, so even if you change the font in theme settings, it won't change unless you remove this code.
Growth uses a Primary and Secondary font, so you'll replace both if you want all fonts to be the same, the font weight can still be set in the theme settings, but if you want to set it here, you can:
@SVanSickle you're right, I apologize - I just checked one of my CMS Starter accounts and it's not an option. I thought this setting was excluded from CMS Free only.
Without a child theme where you can add code, it won't be possible to configure a custom font.
In a child theme, you would use the same code I provided (without the <style> tags).
If you create a child theme as Kristen suggested, it will have a child.css file included where you can add the custom font.
Then from each of your pages, on the settings tab, you would have to change the template so that you can change from the marketplace theme to the child theme. The template file will be the same and it won't impact your content, it will just allow you to extend the theme with customization like this.