Elementor Custom Fonts Tutorial

How to Download & Add Custom Fonts To Elementor (In 1 Minute)

Do you want to learn how to download & add  Elementor custom fonts in 1 minute?

If you have watched my other tutorials then you know that I use Canva to design logo’s or a site icon and to create banners for YouTube channels or Facebook pages.

In this quick tutorial I will show you how you can download and upload Elementor custom fonts. For this example I will use the Obelix Pro font which is a very popular.

This font is also used by very popular YouTube influencer Mr. Beast.

Below this post you can also find a link to the YouTube video tutorial.

Don’t forget to like & subscribe if this video helped you out!

Table of Contents

How to download a custom font to Elementor

If you want to download a font you can search for it on Google or you can use a website like https://dafont.io

As you can see I have entered Obelix Pro in the search bar and now you can see a few examples of the font displayed on your screen.

Add custom font to Elementor download font

Now download this font and you can simply do it just by clicking on the download button. Then you the font will be downloaded in different file types. You see OTF and TTF which are two different formats.

Just click on download over here.

download font

Now you click on this blue download button to download the zip file.

download custom font

Now the zip file is downloaded, and you need to open to folder and then you can see the files.

Custom Font zip files

How to upload a custom font to Elementor

The next thing to do is upload the custom font to Elementor.

Therefore, you need to over to the WordPress dashboard. Go to Elementor in the menu and then select Custom fonts.

Select Elementor Custom Fonts

The next thing to do is to add the custom font.

Right here you can see a button which says Add new so you can click on it and now you can enter a font family name. In this case it’s Obelix Pro and after that you can select the format for the custom font.

If I go back to the folder that I have created for the custom font that I have downloaded earlier you can see see these are all TTF files.

So therefore I select this file type and click on Upload.

Upload font TTF File in Elementor

Now I select the folder and go to this blue button over here to select the TTF file. After that is done, I click on this blue Publish button. Here you can see the font is being displayed over here.

Publish Custom font TTF File in Elementor

How to select a custom font in Elementor

Sometimes when you have downloaded a custom font there also can be a few variants in the folder. For example for the Italic or Bold types.

After the font has been added you can use it for you designs in Elementor.

Therefore you need to open the Elementor editor for a page or post.

If you select a text widget like for example a heading, button or the text editor than you can go to the font option over at the Style tab and select the custom font over there.

Select Custom Font in Elementor editor

After the custom font has been selected you will see it will be displayed for the widget that you have selected. Don’t forget to hit the Publish button to save all the settings and then your custom font will be up and running!

You can go to the video tutorial on YouTube by clicking this link.

In another tutorial I have explained how to upload custom fonts to Canva. If you use Canva te create designs you should check it out.

Check out this tutorial to learn the Elementor basics in 7 minutes.

I hope this tutorial was clear and it helped you out. Don’t forget to subscribe to the YouTube channel and hit the notification bell if you found this content interesting!