Using custom fonts in WordPress Avada Theme

I love WordPress and I love the Avada Theme. Avada gives me tonnes of options to build a nice website in all my projects. But there is one thing that I don’t like: Fonts customization! In this post I will show you how you can replace the font theme wide.

Yes, Avada allows you to upload a custom font (eof, ttf, woff, svg), but it only uses these fonts at some places. For example, the body font family cannot be replaced, as well as in some other areas. After experimenting for a while, I developed this procedure to replace all fonts with my custom font. Here are the steps:

Step 1: Activate the Avada Child Theme (of course you should transfer your settings first (Avada -> Theme Options -> Backup).

Step 2: Upload your font files into the Child-Theme-Folder. In my case I created a folder named “fonts” and copied all font files into this folder (wp-content -> themes -> Avada-Child-Theme -> fonts).

Step 3: Go on your webserver (e.g. by FTP) and edit the style.css file inside the Avada Child Theme folder (wp-content -> themes -> Avada-Child-Theme). Add the following css code:

Note: Of course you have to adjust the content, means the right path an the right file names. But do not replace the word “Arial”, because that is the trick.

Step 4: Open up the theme options again (Avada -> Theme Options -> Typography -> Standard Fonts). Here, select Arial as your standard font for everything.

There you go! You replaced everything.

4 comments on “Using custom fonts in WordPress Avada Theme”

  1. ASHKAN says:

    tnx for your really usefull article.

  2. blue bear says:

    That’s fucking great !

  3. very cool… so does this mean one could take the google font open sans and upload it so that font set is being server from my site and not having to make a call out to google for the font?

  4. Ruud says:

    You helped me a lot with this! Thanks :)

Leave a Reply

Your email address will not be published. Required fields are marked *