Google Fonts lokal in Divi

von tom | März 2024 | Code, Plugins

Mach Deine Website schneller und sicher

Das lokale Hosten von Google Fonts auf Deiner Website kann eine großartige Möglichkeit sein, die Leistung und das Benutzererlebnis Deiner Website zu verbessern. Wenn Du Google Fonts verwendest, wird die eigentliche Schriftartendatei auf dem Google-Server gehostet, was Deine Website verlangsamen und sich negativ auf das Benutzererlebnis auswirken kann. Indem Du die Schriftartdateien lokal hostest, kannst Du dieses Problem vermeiden und sicherstellen, dass Deine Website schnell und reibungslos geladen wird.

Wenn Du Divi verwenden, bietet das lokale Hosten von Google Fonts mehrere Vorteile. Erstens kann es Dir dabei helfen, die Anzahl der externen Domains zu reduzieren, von denen Deine Website abhängig ist, was die Leistung Deiner Website verbessern kann. Zweitens hast Du die volle Kontrolle über das Caching, was Dir dabei helfen kann, die Leistung Deiner Website noch weiter zu optimieren. Drittens entfällt die Notwendigkeit, sich auf Dienste von Drittanbietern zu verlassen, die unzuverlässig und langsam sein können.

Wenn Du Google Fonts lokal hostest, profitierst Du außerdem von größerer Flexibilität und Anpassungsmöglichkeiten. Du kannst beispielsweise auswählen, welche Schriftarten Du verwenden möchtest und wie Du diese verwendest, anstatt sich auf die vordefinierten Optionen von Google zu verlassen. Du kannst die Schriftarten auch so anpassen, dass sie zum Branding und Design Deiner Website passen, was Dir dabei helfen kann, ein einheitlicheres und professionelleres Erscheinungsbild zu erzielen.

Insgesamt kann das lokale Hosten von Google Fonts eine großartige Möglichkeit sein, die Leistung, das Benutzererlebnis und die Anpassungsoptionen Deiner Website zu verbessern. Wenn Du Divi verwendest, ist es auf jeden Fall eine Überlegung wert.
Ich hoffe das hilft!

Suche nach „Google Webfonts Helper“, um die Website zum Herunterladen Deiner Schriftarten zu finden.

Füge dies in Dein CHILD-THEME ein (functions.php)

/*
PHP. Add this in your CHILD THEME 
functions.php after the existing content.
Backup first!
*/
add_filter( 'wp_check_filetype_and_ext', 'my_file_and_ext_woff', 10, 4 );
function my_file_and_ext_woff( $types, $file, $filename, $mimes ) {
if ( false !== strpos( $filename, '.woff' ) ) {
$types['ext']  = 'woff';
$types['type'] = 'font/woff|application/font-woff|application/x-font-woff|application/octet-stream';
}
if ( false !== strpos( $filename, '.woff2' ) ) {
$types['ext']  = 'woff2';
$types['type'] = 'font/woff2|application/octet-stream|font/x-woff2';
}
return $types;
}
/* Mime Types Support */
add_filter('upload_mimes', 'custom_mime_types', 999999);
function custom_mime_types($mimes) {
$mimes['woff'] = 'application/font-woff';
$mimes['woff2'] = 'application/font-woff2';
return $mimes;
}
/* Custom Font Types Support */
add_filter('et_pb_supported_font_formats', 'custom_font_formats', 1);
function custom_font_formats() { 
return array('woff', 'woff2');
}
// End

PHP. Add this in your CHILD THEME

functions.php after the existing content.

Backup first!

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

function my_file_and_ext_woff( $types, $file, $filename, $mimes ) {

if ( false !== strpos( $filename, '.woff' ) ) {

$types['ext'] = 'woff';

$types['type'] = 'font/woff|application/font-woff|application/x-font-woff|application/octet-stream';

}

if ( false !== strpos( $filename, '.woff2' ) ) {

$types['ext'] = 'woff2';

$types['type'] = 'font/woff2|application/octet-stream|font/x-woff2';

}

return $types;

}

/* Mime Types Support */

add_filter('upload_mimes', 'custom_mime_types', 999999);

function custom_mime_types($mimes) {

$mimes['woff'] = 'application/font-woff';

$mimes['woff2'] = 'application/font-woff2';

return $mimes;

}

/* Custom Font Types Support */

add_filter('et_pb_supported_font_formats', 'custom_font_formats', 1);

function custom_font_formats() {

return array('woff', 'woff2');

}

// End

Wenn Dir das alles etwas zu schwer vorkommt dann kannst Du natürlich auch ein Plugin benutzen was die Arbeit für Dich übernimmt.
Ein gutes Plugin wäre z.B. „OMGF | GDPR/DSGVO Compliant, Faster Google Fonts. Easy„

zum download

← Neon-Glow-Effekt 3D-Special-Effekt →