Divi recently disabled the ability to upload WOFF & WOFF2 webfont files in the Divi Builder custom font Drag & Dropload box due to “security reasons”.

Example: I can’t upload WOFF / EOT / SVG font files in Divi

To add WOFF & WOFF2 fonts to the Divi Builder:

Convert Your Font Files to WOFF & WOFF2
Using WOFF & WOFF2 together means your font will be almost universally supported by browsers so take your old TTF files and convert them using CloudConvert.
Find the core.php File & Make a Backup
Find the wp-content/themes/Divi/includes/builder/core.php file in your website’s file system. Download a backup copy to your computer just in case.
Find the Function That is Stopping WOFF & WOFF2 Uploads
Open the core.php file and search for this function:
```
function et_pb_get_supported_font_formats() { return apply_filters('et_pb_supported_font_formats', array('ttf', 'otf')); }
```
Divi uses this function when uploading new fonts. As you can see it is currently set to only allow OTF and TTF fonts.
Temporarily Update the Divi Core to Allow WOFF & WOFF2 Uploads
Add the WOFF and WOFF2 formats to the array and save the file. It should look something like this:
```
function et_pb_get_supported_font_formats() { return apply_filters('et_pb_supported_font_formats', array('ttf', 'otf', 'woff', 'woff2')); }
```
Upload the Fonts Together via the Divi Builder
Now go back into the Divi Builder and upload the fonts in the normal way. Make sure you select the WOFF file and the WOFF2 file when you upload them:

Your WOFF fonts should now be uploaded and working so save and exit the Divi Builder.
Go Back & Undo the Changes to the core.php File
Find the core.php file and remove WOFF and WOFF2 items from the array and save it so it looks like this again:
```
function et_pb_get_supported_font_formats() { return apply_filters('et_pb_supported_font_formats', array('ttf', 'otf')); }
```

14 Comments

Balaka on 7th January 2021 at 2:53 pm

THANK YOU!!!

Seriously, thank you so much for this. This is by FAR the best solution I have come across. So good to finally solve this problem once and for all.
Reply
- Alex Hooley on 11th January 2021 at 1:40 pm
  
  Thanks Balaka!
  Reply
Betsy Pruitt on 8th February 2021 at 4:55 am

This is fantastic and so easy! Thank you so much!
Reply
Angelique Berger on 23rd February 2021 at 7:05 pm

Is there anything different to this process if you have a child theme on top of the Divi theme? Thanks so much!
Reply
- Alex Hooley on 24th February 2021 at 7:28 pm
  
  Should work exactly the same Angelique!
  Reply
Nadia on 13th April 2021 at 8:03 am

I can not find this function in the core.php. Maybe something changed after a update?
Reply
- Alex Hooley on 13th April 2021 at 1:48 pm
  
  Hi Nadia, it’s still there for me in core.php in Divi 4.9.3 on line 5302.
  Reply
MD on 13th April 2021 at 9:02 pm

Umm, yes, this worked great! Thanks a mill!
Reply
- Alex Hooley on 14th April 2021 at 12:50 pm
  
  Thanks Melissa!
  Reply
Christian Balta on 1st June 2021 at 11:51 am

Hi

I’ve done the steps but my Font is only visible in the Visual Builder. As soon as i exit the Visual Builder the font is gone.

Any idea?

Thanks!
Christian
Reply
- Alex Hooley on 2nd June 2021 at 5:57 pm
  
  Hi Christian, any errors in your browser console? Is the font loading in the “Network” tab of your browser console?
  Reply
Nordie on 27th July 2021 at 5:51 pm

i like this
would there be an option to ad this n some shape of form in to the functions.php file?
Reply
Nordie on 14th August 2021 at 8:05 am

I just found this and it works fine
https://gist.githubusercontent.com/lukebussey/79b54deeb3e499069c853b46589b63b9/raw/e81aaf6dcf7b7e70131617ecd3716e2a387739cf/functions.php
Reply
- Alex Hooley on 15th August 2021 at 3:18 am
  
  Looks good, I’ll add it to the post. Thanks Nordie!
  Reply

How to Add WOFF/WOFF2 Custom Fonts to the Divi Builder

To add WOFF & WOFF2 fonts to the Divi Builder:

14 Comments

Submit a Comment Cancel reply