WP Theme ohne Google-Fonts

Hi,

Zitat von Kai57

Die meisten guten Premium-Themes haben diese Funktion schon integriert.

Joar da wird Geld mit der Not anderer gemacht, sage ich mal krass ausgedrückt. Aber die Themes sind leider nicht das einzige Problem in dieser Hinsicht. Gibt sicher auch genug Plugins, welche auf Google Fonts zurückgreifen.Habe vor ein paar Monaten festgestellt, dass ein Wetter Plugin Google Fonts nutzte und habe es dann ersatzlos gestrichen.

Zitat von Kai57

ich weiß nicht wie man das deaktivieren kann.

Es gibt verschiedene Methoden, doch nicht alle funktionieren.
Falls du ein Plugin dafür ausprobieren möchtest, habe ich mal zwei ausgesucht.
https://wordpress.org/plugins/disable-remove-google-fonts/
https://wordpress.org/plugins/wp-asset-clean-up/

Wenn du wissen willst, was so an Google Fonts auf deiner Seite geladen wird, könntest du mal eine Überprüfung machen. Dann weißt du genau wo du überall ansetzen musst um die Fonts los zu werden, bzw. durch Alternativen (Font Local Hosting) zu ersetzen.
https://sicher3.de/google-fonts-checker/
https://google-fonts-checker.54gradsoftware.de/

Hier noch ein etwas umfassenderer Check;
https://webbkoll.dataskydd.net/de/

Zitat von Kai57

Ich benutze z.B. The7, und die Frage ist: kann ich die Schriften dort deaktivieren und sie selbst auf der Seite einbinden oder nicht!?

klar geht. bspw. o.g. plugins nutzen um google zu deaktivieren und die fonts über childtheme oder custom css einbinden.

Ich verwende für meine HP das Theme Astra, dort sind keine Google-Fonts standardmäßig in Benutzung.

Zitat von Kai57

Es müsste ja ausreichen, wenn alles in der Datenschutzbestimmung beschrieben steht, und jeder Nutzer einwilligen muss der die Seite Besucht.

leider nicht. der besucher muss die möglichkeit haben google dienste abzulehnen. sonst dsgvo verstoss.
dazu habe ich schon diverse diskussionen hier gelesen und auch das web allg. wird dich leider eines besseren belehren.
bspw. RA christian solmecke LINK

Das Einschalten der Google-Fonts erst nach Einwilligung wird nicht funktionieren, da die Seite ja geladen werden muss, damit der Cookie-Banner erscheint. Die Seite muss dann erst mit einer Systemschriftart angezeigt werden und nach Einwilligung des Besuchers in der eigentlich vorgesehen Schriftart. Das verlängert die Ladezeit der Startseite.

Da kann man die Seite auch direkt ohne Google-Fonts aufbauen.

Wenn das Theme es nicht vorsieht Google-Fonts abzuschalten, dann können hier 2 Plugins helfen:

Disable and Remove Google-Fonts

Local Google Fonts

Das erste Plugin schaltet den Zugriff auf den Google-Server ab. Mit dem 2. Plugin lädst du die Google-Fonts, die du verwenden möchtest als Admin lokal auf den Webserver.

Und im allerschlimmsten Fall musst du das eben manuell machen. Dazu gibt es aber über die Suchmaschinen reichlich Seiten mit den entsprechenden Anleitungen.

Hallo Leuts - vielen Dank! :)

....das ist mein Thread - ich bin auch an dem Thema dran. Danke für die guten Beiträge. Die kommen wie gerufen!

Zitat

klar geht. bspw. o.g. plugins nutzen um google zu deaktivieren und die fonts über childtheme oder custom css einbinden.

ich glaub, dass ich mir die genannten Plugins auch mal angucke.

ich finds klasse, Kai dass du das Thema aufgeworfen hast.

Kai57 - ich will das auch so machen - ich will auch die Google-Fonts los werden. Für Eure Tipps und Ideen bin ich sehr sehr dankbar. Danke an Igel1954 und an DummyGirl und auch an dich, MarcusIS. Ich bin froh dass ihr geschrieben habt. Ich werde mir das später noch genauer ansehen und mich am Wochenende an das Thema machen.

Also, die Idee, das mit einem Plugin umzusetzen, die hab ich hier auch schon des Öfteren gelesen, Das ist mir auch schon in dem ein oder anderen Thread hier begegnet. Die Alternative - das Einbinden de Fonts zu Fuß ist mir auch schon eingefallen. Ich hab mich mal umgeguckt und mir einen kleinen Plan zurechtgelegt.
Weil es mir hilft, wenn ich diesen für mich zurecht gelegten Plan mal aufschreibe - hab ich gedacht dass ich das am besten mal mache - und hier in diesem Thread ists vielleicht am allerbesten. Also hier die Schrittfolge, mit der ich nächstens an meine Seiten gehe - um die Google-Fonts selber und lokal zu hosten:

- Identifizieren der entsprechenden Fonts (die wir von Google beziehen) hier gibts mehrere Möglickeiten.
- Herunterladen der Fonts
- Hochladen auf den Server
- Ändern der CSS - diese Daten dann einbinden, am besten via Child-Theme
- deaktivieren der Fonts (entweder via Plugin oder auch mittels Skript)
- finale checks durchführen und gucken ob wir wirklich alles lokal haben und keine Fonts mehr von Google eingebunden werden.

Also es geht los: Zuallererst muss man halt gucken, welche Google Fonts die Seite (also das Theme oder ggf. auch der Plugin) wirklich aufruft und einbindet. Das kann man mit den Entwickler-Tools unter Chrome super gut machen. Also damit lassen sich die Fonts gut identifizieren.

Ich muss schon zugeben: bis jetzt hab ich mich eigentlich eher sehr wenig mit den Google-Fonts beschäftigt. Also ganz ehrlich gesagt, wusste ich noch nicht einmal, welche Google Fonts ich mit meiner Seite überhaupt benutze: Aber seit dem die Google-Fonts wieder in aller Munde sind hab ich mich bemüht da etwas mehr zu erfahren. Und nun ist der allererste Schritt für mich der, zu gucken welche Fonts bei mir eine Rolle spielen - um welche es genau geht: Ich muss also erstmal eine Bestandsaufnahme machen und die Fonts gewissermaßen identifizieren.

Und hier gehts schon los: Es gibt zum Glück gleich hier an dieser Stelle eigentlich auch mehrere Möglichkeiten, genauer zu schauen und auch herauszufinden was auf der Seite für Google-Fonts eingebunden werden. Weil es aber so ist, dass Google Fonts im Grunde über verschieden Wege (Pfade) eingebunden werden können gibt es auch bei diesem Schritt mehrere Möglichkeiten.

bei Plugins: Wenn man z.B. ein extra Plugin einsetzt, welches die Google Fonts einbindet kann man sich dieses zu Hilfe nehmen und dort nachsehen: Dort orientiert, finden sich die Schriftarten - man guckt einfach in den Einstellungen des entsprechenden Plugins nach. Dort im Dashboard gibts Orientierungshilfen. Dort stehen in einer Extraabteilung die Google-Fonts meistens drinne.

bei Themes: sehr sehr oft werden Google-Fonts-Schriften halt über ein spezielles Theme eingebunden. Hier findest du die eingebunden in Schriften in den Einstellungen des Themes oder über den Customizer (Design → Customizer → Fonts).

Wenn du herausgefunden hast, welche Fonts du brauchst, dann musst d u die halt noch besorgen. Hier gibt mittlerweile auch sehr schönes Tools - ( z.B. Google Webfonts Helper von Mario Ranftl), die einem dann bei dieser Aufgabe helfen und die benötigten Dateitypen für die jeweiligen Google Fonts zur Verfügung bringen.

Also - nachdem wir genau geguckt haben welche Fonts wir brauchen - welche in die Seite eingebunden werden, müssen wir, wenn wir die lokal hosten wollen die auch holen. Also ist das der nächste Schritt: wir besorgen die Fonts!

Wenn wir die Fonts downgeloaded haben - dann müssen wir die einbinden und am Ende dann noch dem CSS sagen wo die Fonts liegen. Also mit anderen Worten dann muss das alles noch dem Code mitgeteilt werden, damit die aufrufenden Browser unserer Seitenbesucher dann auch im Grunde wissen wo die (Google-Fonts) Dateien sind.

Es bietet sich hier an, das Notwendige hier über ein sogenanntes Child-Theme zu arrangieren. Ich jedenfalls würde ein Child theme anlegen - und wenn das dann angelegt ist, dann alles in die style.css-Datei des Child-Themes reinschreiben. Das hat den großen und meiner Meinung nach auch entscheidenden Vorzug, dass die notwendigen Änderungen auch nach dem Update deines WordPress-Themes noch bestehen bleiben. Das mit dem Child-Theme ist sowieso eine tolle und auch ansonsten wichtige Sache.

Wenn das passiert ist, dann muss man lediglich nur noch die Verbindung zu Google Fonts deaktivieren - sodass eben sichergestellt ist. dass keine Fonts mehr von Google eingebunden werden. Also kurz gesagt müssen wir nun noch in einem weiteren Schritt jetzt auch die Verbindung zum Google Server kappen oder anders gesagt "trennen" - denn jetzt hosten wir ja lokal und die Schriften sind ab jetzt dann auch lokal eingebunden. ...

weil ned alles in ein Posting reingeht - schick ich das mal ab - und mach unten weiter. :)

Hi Leutz hallo Igel 1954 und DummyGirl hallo Kay57, hallo MarcusIS

also - weil ned oben alles in ein Posting reingegangen is - hab ich das mal abgeschickt - und mach unten weiter. :)

wenn ich auf meinen Plan gucke, dann kommt jetzt folgendes - das Deaktivieren

Das Deaktivieren:
also es ist so, wenn man die etwa Fonts und Schriftarten über ein spezielles WordPress-Plugin eingebunden hat, dann würde es m.E. ja auch ausreichen, wenn man hergeht und dieses zu deaktiviert. Aber viele viele Leute binden die Fonts über ein WordPress-Theme ein; Hier muss nun ein extra Weg beschritten werden - es muss versucht werden, die Schrift-Optionen im jeweiligen Theme selber zu löschen.

Das kann man mit einem kleinen Code-Snippet zum Beispiel machen: Ich hab mich mal umgesehen und mehrere Sachen gefunden - die ich zugegebenermaßen noch nicht selber ausprobiert habe. Da muss ich selber noch ausprobieren, was am besten passt:

Was ich gefunden habe waren diese folgenden Sachen:

Zitat

This code filters all style url's. It returns the url if there is no reference to google fonts. It returns 'false' if there is a reference. What you want is to change the condition. It should only return false if there is a reference and you are on a certain page. Logically, this is equivalent to returning the url if there is no reference or you are not on that page. Like this:

if ((strpos($href, "//fonts.googleapis.com/") === false) || !is_page(12345)) {

Where you should replace 12345 with the ID or slug of the page you want to exclude.

https://deref-web.de/mail/client/J1…nly-single-page

Zitat

(replacing the wp_deregister_script call by wp_deregister_style), but it will always remove all styles from the parent theme. I guess that relates to line 108 in the parent theme’s function.php, whereas the font is set as a dependency for the olsen-light-style – key. If I remove any of the dependency, it will not add the olsen-light-style to the head.

wp_enqueue_style( 'olsen-light-style', get_template_directory_uri() . '/style.css', array(
       // 'olsen-light-google-font',
       'olsen-light-base',
       'olsen-light-common',
       'font-awesome',
       'olsen-light-magnific',
       'olsen-light-slick',
       'olsen-light-mmenu'
   ), $theme->get( 'Version' ) );
Commenting out line 108 and line 99 (registering the font) works, but breaks update possibility.

siehe auch: https://deref-web.de/mail/client/vO…ogle-fonts%252F

function _remove_google_fonts() {
    wp_deregister_style( 'olsen-light-google-font' );
       wp_register_style( 'olsen-light-google-font', '');
}
add_action( 'wp_enqueue_scripts', '_remove_google_fonts', 120 );
[

Inwieweit diese Snippets hier gut weiterhelfen, das kann ich im Moment leider noch nicht sagen. Das müsste ich selber noch austesten und probieren. Die obengenannten Snippets, die hab ich bei einer Recherche gefunden: die ich zugegebenermaßen noch nicht selber ausprobiert habe. Da muss ich selber noch ausprobieren, was am besten passt:

Wenn ich dann weitergehe dann kommen noch ein paar Schritte, die ich entsprechend meines Planes noch abarbeiten muss:
Und ganz ganz am Ende müsste man dann sinnvollerweise noch einmal prüfen ob nun wirklich auch [size=14]alle Google Fonts lokal geladen werden.[/SIZE]
Wie ganz oben beschrieben könnte man diesen Schritt nun auch wieder zweckmäßigerweise über die Entwicklerkonsole des Browsers (ich verwende meistens halt Chrome, weil es einer der genialsten Browser überhaupt ist) und finde hier immer unter den Reitern „Sources“ mit dem entsprechenden Filter „Fonts“ ob denn jetzt an dieser Stelle (also wenn wir uns die ganze oben beschriebene Arbeit schon gemacht haben und alle (!) Schritte einzeln und der Reihe nach durchlaufen haben, ob denn nun jetzt immer noch von Google Schriften geladen werden. Das ist gewissermaßen die Probe aufs Exempel. Jetzt muss sich weisen ob wir alles sauber gearbeitet haben.

An dieser Stelle kann es hilfreich sein auch darauf zu achten, dass der Browsercache geleert ist - denn manchmal stört dieser- etwa indem er, nicht den aktuellen CSS Code verwendet sondern vllt. noch einen alten CSS-Code.

Wie gesagt - ich bin noch selber am Einarbeiten - ich hab die Arbeit mit dem Lokal hosten der Google-Fonts noch vor mir.
Und wie ganz oben gesagt: weil es mir hilft, wenn ich diesen für mich zurecht gelegten Plan mal aufschreibe - hab ich gedacht dass ich das am besten mal mache - und hier in diesem Thread ists vielleicht am allerbesten. Also deshalb habe ich hier die Schrittfolge, mit der ich nächstens an meine Seiten gehe - um die Google-Fonts selber und lokal zu hosten mal aufgeschrieben.

Freue mich von Euch wieder zu lesen.

Viele Grüße
Rhenus:)

guten Morgen liebe Gemeinde, hallo Kay57

Danke für deine Rückmeldung..... ich werde ein Fan von diesem Forum ... :)

...also weil ich mit dem Thema ja auch grad voll zugange bin und hier auch an einer Lösung arbeite hab ich mir vorgenommen, die Tipps von @Igel1954 genauer durchzugehen. Vielleicht komme ich damit weiter.

Eine meiner Pages setzt das Theme jobify von Astoundify ein: dieses hier:

https://astoundify.com/products/jobify/

Ich muss gucken, ob ich weiterkomme in dem ich etwa ...:

a. dort auch die Google-Fonts drinne hab und wenn ja, ob ich dann die
b. etwa abschalten kann.

Hierzu will ich Igels Ansätze testen, also a via Theme die Fonts abzuschalten oder ggf. via Plugin.
Ich halte deine Tipps Igel1954 für sehr gut - und erst wenn ich mit deinen Ansätzen nicht (mehr) weiterkomme, dann geh ich den "harten" weg - die Fonts eben dann über den manuellen Weg lokal zu hosten (vgl. oben)

Zitat von Igel1954

Das Einschalten der Google-Fonts erst nach Einwilligung wird nicht funktionieren, da die Seite ja geladen werden muss, damit der Cookie-Banner erscheint. Die Seite muss dann erst mit einer Systemschriftart angezeigt werden und nach Einwilligung des Besuchers in der eigentlich vorgesehen Schriftart. Das verlängert die Ladezeit der Startseite.

Da kann man die Seite auch direkt ohne Google-Fonts aufbauen.

Wenn das Theme es nicht vorsieht Google-Fonts abzuschalten, dann können hier 2 Plugins helfen:

Disable and Remove Google-Fonts

Local Google Fonts

Das erste Plugin schaltet den Zugriff auf den Google-Server ab. Mit dem 2. Plugin lädst du die Google-Fonts, die du verwenden möchtest als Admin lokal auf den Webserver.

Und im allerschlimmsten Fall musst du das eben manuell machen. Dazu gibt es aber über die Suchmaschinen reichlich Seiten mit den entsprechenden Anleitungen.

Alles anzeigen

ich guck mal am Wochenende - u. melde mich wieder

Nochmals vielen Dank für diesen tollen Thread u. für all Eure Beiträge.

ich werde ein Fan von diesem Forum ... :)

Viele Grüße Rhenus:)

Unter https://sicher3.de/google-fonts-checker/ kann man die Webseite auf Nutzung der Google-Fonts prüfen.

Das o.g. Jobify Theme nutzt lt. Theme Demo und kurzem Blick in den HTML Quelltext externe Google Webfonts.

<link rel='stylesheet' id='jobify-fonts-css'  href='//fonts.googleapis.com/css?family=Varela+Round%3Aregular%7CMontserrat%3Aregular%2C700&subset=latin,hebrew' type='text/css' media='all' />

Mit z.B. diesem Snippet kann man das durch lokal gehostete Versionen der Webfonts ersetzen. Ergänzung: Die Zeile mit [FONT=Courier New]jobify-custom-fonts[/FONT] soll dann natürlich auf eine lokale Datei zeigen, nicht mehr zu Google wie dort beispielhaft angegeben, nur falls das unklar ist.

Einen generellen allgemeingültigen Ansatz gibt es für WordPress nicht, jedes Theme und Plugin löst das ggf. unterschiedlich, gerne auch an den WordPress Enqueue API Möglichkeiten vorbei, im schlimmsten Fall direkt per [FONT=Courier New]@import[/FONT] in [FONT=Courier New]style.css[/FONT] des Themes, in beiden Fällen werden ggf. entspr. "Entfernungsplugins" auch mal ausgehebelt.

Tipp am Rande: In der Theme Demo wird auch noch Google Maps eingebunden, das wiederum Google Webfonts nachlädt, hier wäre dann zu prüfen, ob das aus dem Theme oder aus einem extra Plugin kommt.

Ohne Link zur fraglichen echten Seite kann man ansonsten eher nicht wirklich helfen.

Zitat von Igel1954

Unter https://sicher3.de/google-fonts-checker/ kann man die Webseite auf Nutzung der Google-Fonts prüfen.

ja, die gefahr all dieser checker sites ist allerdings dass man darauf vertrauen muss dass sie ihre arbeit gut machen - und manche machen das eben nicht. außerdem können die checker alle keinen cookiebanner bedienen und somit nicht prüfen unter welcher auswahl sich die site wie verhält und wann schriften geladen werden oder nicht. ergo würde ich das immer lieber manuell mit den dev tools prüfen.

@rhenus ich habe deine beiträge jetzt mal nicht gelesen denn eindeutig zu viel text. ;)