Atomic Blocks: Google Fonts lokal einbinden

Aomic Blocks ohne Google-Fonts

Titelbild von ThreeMilesPerHour auf Pixabay

Schon seit einiger Zeit nutze ich hier das WordPress Theme Atomic Blocks. Ein sehr schönes Theme mit leider einem kleinen Fehler. Es nutzt Google Fonts.

Eigentlich habe ich nicht gegen Schriften, die von einem Google-Server geladen werden. Doch in Zeiten der DSGVO ist das bedenklich.  Der Grund ist einfach erklärt. Beim Laden der Schriften vom Google-Server wird die IP-Adresse übermittelt. Und diese zählt zu den persönlichen Daten eines Besuchers. Google erklärt zwar dass der Service entkoppelt wäre und auch keine Cookies gesetzt werden. Trotzdem erscheint es mir besser auf eine solche Anbindung zu verzichten.

Beschreibungen wie man diese Fonts aus einem Theme verbannt und wie man Ersatz schafft gibt es viele. Doch dummerweise funktionieren die hier nicht. Ich bin so kein großer Held das PHP und HTML inklusive CSS angeht, aber soviel habe ich verstanden das Theme Atomic Blocks was das Stylesheet und die Einbindung der Google Fonts angeht etwas komplizierter ist. Das Theme arbeitet mit sogenannten SASS-Dateien, was meinen Durchblick für dieses Theme nicht gerade vergrößert.

Ich habe es trotzdem, dank dem Artikel von Martina Honecker, geschafft. Sie erklärt darin wirklich klasse wie man Google-Schriften erkennt, lokal herunterlädt, einbindet und die Google-Fonts aus dem Theme verbannt. Gerade beim letzten Punkt, dem PHP-Code zum entfernen der Schrift hatte ich so meine Probleme. Erst obiger Artikel hatte für mich die Lösung.

Atomic Blocks bindet die Google-Schriften via Theme-Function ab Zeile 174 ein. Allerdings muss man da bereits wissen was man via Customizer konfiguriert hat. Läuft das Theme in der der Standard-Einstellung sind das die Schriften „Nunito Sans“ für die Texte und „Muli“ für die Überschriften. Dazu kommen noch die verschiedenen Strichstärken und die kursive Schrift. Insgesamt sind das 5 verschiedene Schriftarten, die jeweils aus 5 Dateien bestehen. Das macht insgesamt 25 Dateien. Diese Schriften kann man sich über den Google Webfonts Helper herunterladen und so lokal einbinden. Aber auch das wird bei Martina Honecker erklärt. Beide Schriften stehen unter der SIL Open Font License und dürfen (so habe ich es verstanden) lokal genutzt werden.

Bleibt noch der PHP-Code um das alte zu Entfernen. Auch das ist nicht so schwer wenn man den richtigen Ansatz kennt. Nachfolgende Zeilen entfernen die Google Schriften aus Atomic Blocks.

/* Google Fonts aus Atomic Blocks entfernen ------------------------------------*/
function mh_dequeue_google_fonts_style() {
/* -----------------------------------------------------------------------------*/ 
  wp_dequeue_style( 'atomic-blocks-fonts' );
}
add_action( 'wp_print_styles', 'mh_dequeue_google_fonts_style' );

Ich bin mit der Lösung zufrieden. Die Google-Fonts sind Geschichte und die Webseite sieht genauso aus wie vorher.


2 Antworten auf “Atomic Blocks: Google Fonts lokal einbinden”

  1. Obwohl neue Versionen des Themes erschienen sind, an die Möglichkeit, den Blog DSVGO-konform zu gestalten und deshalb eben auch auf Google Fonts zu verzichten, haben die Autoren nicht gedacht.

    Ich glaube die Amis nehmen das nicht so genau mit der DSVGO 🙂 Jetzt wurde Arraythemes zudem auch noch von WP-Engines gekauft. Die tollen Themes von Arraythemes scheinen im Portfolio nicht mehr vorzukommen. Das ist nicht überraschend, weil Studiopress ja da Genesis-Framework bevorzugt 😉 Schade eigentlich.Meine Themes von Array kann ich über meinen Account aber noch downloaden.

    Ich meine, dass das Plugin „Autoptimize“ in seinen Standardeinstellungen das Abschalten der Google Fonts (jedenfalls bei diesem Theme) ermöglicht. Das klappt ja leider längst nicht überall. Bei diesem Theme, glaube ich, hat das funktioniert. Es gibt noch ein Plugin, das ebenfalls etwas bringen könnte. Es heißt: „Self-Hosted Google Fonts“. Die Bereinigung im Code des Themes ist ja nicht jedermanns Sache. Hier sind noch einige Tipps zusammengefasst: https://www.computerbase.de/forum/threads/google-fonts-deaktivieren-ohne-plugin.1746892/

    Antworten

    1. Danke für den Link! Ich hätte so ein Thread gar nicht bei ComputerBase gesucht.

      Antworten

Schreibe einen Kommentar

Diese Kommentarfunktion sammelt die Daten die im Kommentar-Formular angezeigt werden. Außerdem werden Datum und Uhrzeit des Kommentars gespeichert.

Ich bin mit der Speicherung und Verarbeitung meiner Daten durch diese Seite einverstanden