Adding Custom Fonts in Jupiter X

Updated on May 27, 2021

How to use my local and self-hosted fonts in Jupiter X theme?

Jupiter X comes with a huge set of fonts like Google Fonts and Adobe Fonts and you can easily add them to your theme from Jupiter Customizer which is presented here.

But what if you don’t find your preferable fonts and want to use your own custom local font within Jupiter X?

There are 2 Recommended methods you can employ to add the local fonts to your theme in order to create a more unique website:

Method 1: Using Elementor Pro

If you’ve already upgraded to Elementor Pro, you can easily add your local fonts to your website and use them in Elementor.
To add a custom font to your website with Elementor Pro:

1. From the WordPress left dashboard menu, go to Elementor > Custom Fonts.

2. From the top of the page click on Add New and give your font a title, then click on ADD FONT VARIATION.

3. Upload different kinds of font files in order to use them on different browsers and Publish the settings.

4. Now, by editing a page in Elementor you will see your new custom font appear in the Typography option and within the Custom Fonts category.

Adding Custom fonts in Jupiter X

Method 2: Using a plugin

If you’re not familiar with CSS, you can also use a free plugin to add your custom font to your website. There are many plugins such as Use Any Font  by which you can simply add any local font to your website. 

Note: Customizer Typography Settings will not get updated this way!

Adding a custom font using the above methods will not add new fonts in the Customizer -> Typography settings. You would need to use Custom CSS to apply new font on the elements

Did this answer your question?