Divi has an option to upload TTF and OTF fonts from within a module, but it is not possible by standard WP security filters.

Sources:

• https://codex.wordpress.org/Uploading_Files
• https://www.elegantthemes.com/blog/wordpress/how-to-fix-the-sorry-this-file-type-is-not-permitted-for-security-reasons-error-in-wordpress

To allow all file types (simple solution)

Add this line of code at the end of the wp-config.php file on your WordPress installation to disable the security filter.

/** Allow all uploads like fonts etc - DISABLE WHEN READY */
define('ALLOW_UNFILTERED_UPLOADS', true);Code language: PHP (php)

Remove or set to false when ready!

Fix TTF/OTF

Add this to functions php

add_filter( 'wp_check_filetype_and_ext', 'div_font_files_check', 10, 4 );

function div_font_files_check( $types, $file, $filename, $mimes ) {
    if ( false !== strpos( $filename, '.ttf' ) ) {
        $types['ext']  = 'ttf';
        $types['type'] = 'font/ttf|application/font-ttf|application/x-font-ttf|application/octet-stream';
    }
    if ( false !== strpos( $filename, '.otf' ) ) {
        $types['ext']  = 'otf';
        $types['type'] = 'font/otf|application/font-otf|application/x-font-otf|application/octet-stream';
    }
    return $types;
}Code language: PHP (php)

If that doesn’t fix it, you may also need to add this

add_filter( 'upload_mimes', 'div_allow_font_file_types' );
function div_allow_font_file_types( $mimes ) {
        $mimes['ttf'] = 'font/ttf|application/font-ttf|application/x-font-ttf|application/octet-stream';
        $mimes['otf'] = 'font/otf|application/font-otf|application/x-font-otf|application/octet-stream';
        return $mimes;
}Code language: PHP (php)

Allow WOFF/WOFF2

To also allow WOFF/WOFF2 files, change this function in this file into:

• wp-content/themes/Divi/includes/builder/core.php

function et_pb_get_supported_font_formats()
{
  return apply_filters('et_pb_supported_font_formats', array('ttf', 'otf', 'woff', 'woff2'));
}Code language: PHP (php)

Source: https://alexhooley.com/divi-custom-woff-fonts/

Use a child theme and custom CSS

Alternatively, add it to the custom css in the following way:

• In the child themes folder, create a folder ‘fonts’: /wordpress/wp-content/themes/ChildTheme/fonts/
• In that folder, put the font file, so for example: /wordpress/wp-content/themes/ChildTheme/fonts/Stencilia-A.ttf
• Then use the following CSS (replace the bold text for the font name) in the style sheet contained in the child theme (so not in the theme options, because then the path won’t be correct).

/* -- START Custom Font -- */
h1, h2, h3,h4, h5, h6 {
	font-family: 'Stencilia', sans-serif  !important;
}
@font-face {
	font-family: Stencilia, sans-serif  !important;
	src: url('fonts/Stencilia-A.ttf');
}
/* -- END Custom Font -- */Code language: CSS (css)