Google Fonts WordPress PUL

PULIntegrera Google Fonts-kompatibla lokalt i WordPress

Integrationen av Google Fonts i WordPress kan vara kritisk av olika skäl: PUL Dataskydd och efterlevnad, prestanda och laddningstider, beroende av Google och säkerhet. WooCommerce Vår partnerbyrå fivecode är specialiserad på WordPress-webbplatser och -butiker och har redan erfarenhet av flera hundra projekt för välkända företag i sådana frågor. 

Yannic, hur ofta stöter du på problemet med Google Fonts i ditt dagliga byråarbete och vilka effektiva lösningar använder du för att undvika detta problem?

I nästan alla projekt kommer vi i kontakt med ämnet typsnittsintegration och problemet med Google Fonts. Jag berättar gärna hur företag kan ta reda på om Google Fonts körs på deras WordPress -Webbplats och hur de kan inaktivera dem. Jag kan också ge dig en inblick i hur vi laddar upp Google Fonts eller anpassade teckensnitt lokalt på servern i våra projekt. PUL Detta hjälper våra kunder att skydda sina användares integritet och undvika potentiellt kostsamma problem. 

Vi erbjuder inte juridisk rådgivning i denna artikel. Om du har några juridiska frågor, vänligen kontakta specialiserade jurister. PUL De föreslagna åtgärderna baseras på vår nuvarande kunskapsnivå och är avsedda att hjälpa WordPress -administratörer att skapa webbplatser som uppfyller kraven. Vi kan dock inte garantera att de åtgärder som presenteras kommer att säkerställa 100% dataskyddsefterlevnad, eftersom den tekniska utvecklingen och den rättsliga situationen kan förändras. Vid behov bör du anlita en professionell byrå för genomförandet.

Vad är egentligen Google Fonts - och varför är de ofta ett problem?

Google Fonts är en gratistjänst från Google som tillhandahåller ett omfattande bibliotek med teckensnitt för webbplatser och onlinebutiker. De används ofta av utvecklare och webbdesigners på grund av att de är så enkla att integrera. Det beror på att tjänsten gör att vi slipper ladda upp egna typsnitt och ser till att även typsnitt som inte är installerade som standard på besökarnas datorer, smartphones och andra enheter kan användas.

PUL Google Fonts är dock en juridiskt kritisk fråga eftersom deras integration väcker frågor om dataskydd: trots allt överförs data till Googles servrar när teckensnitten laddas, vilket potentiellt kan bryta mot om användarens samtycke inte erhålls.

PULVarför är Google Fonts problematiska i förhållande till EU?

Dataskyddsbestämmelser i USA

PUL Google Fonts kan vara problematiska i förhållande till EU eftersom de överför data till Googles servrar utanför EU varje gång en webbplats används. Problemet är att operatörerna av dessa servrar i USA följer andra dataskyddsbestämmelser än vad vi gör inom EU. 

PULÄven om begäran på en webbplats endast ska ladda respektive typsnitt kan personuppgifter som IP-adressen också överföras till utländska servrar, vilket bryter mot den allmänna dataskyddsförordningen ( ) utan besökarens uttryckliga samtycke. PUL I januari 2022 beslutade den regionala domstolen i München att integreringen av Google Fonts utan användarnas samtycke utgör ett brott mot (källa:datenschutzticker.de).

Ogiltig EU-US Privacy Shield

Privacy Shield mellan EU och USA var ett avtal som syftade till att reglera utbytet av uppgifter mellan EU och USA genom att säkerställa en adekvat skyddsnivå för de uppgifter som överförs. Privacy Shield förklarades dock ogiltigt av EU-domstolen 2020 eftersom det inte i tillräcklig utsträckning kunde garantera skyddet av personuppgifter, särskilt på grund av amerikanska myndigheters åtkomst. PUL Det är därför för närvarande ännu viktigare att vidta åtgärder för att integrera Google Fonts lokalt för att säkerställa efterlevnad (källor:Europeiska kommissionen och Datenschutz.org).

Är det ens möjligt att använda Google Fonts WordPress i enlighet med dataskyddsbestämmelserna?

Den goda nyheten: Användningen av Google Fonts i WordPress är inte problematisk i sig. I alla fall inte om den är korrekt inställd. För att göra detta bör teckensnitten laddas upp lokalt på din egen server. Detta innebär att det inte upprättas någon anslutning till Googles servrar, vilket förhindrar överföring av personuppgifter.

Genom att integrera teckensnitt lokalt på din egen server kan du alltså undvika denna dataöverföring och bättre skydda dina webbplatsbesökares integritet.

Verkligheten i praktiken

Tyvärr är det ofta så att detta inte förverkligas i praktiken. Och inte bara det - det har redan förekommit ett antal fall i praktiken där företag har tvingats betala stora summor pengar på grund av överträdelser.

Ett fall gällde t.ex. en webbplats som laddade Google Fonts direkt från Googles servrar i USA, varvid besökarnas IP-adresser överfördes till Google utan deras samtycke. Domstolen fann att detta förfarande stred mot rätten till självbestämmande i fråga om information och dömde webbplatsoperatören att betala skadestånd. Detta exempel visar att det kan löna sig att med några enkla steg förhindra att teckensnitt laddas via servrar i USA - och att spara dem lokalt.

Dataskydd för byråer och WordPress-utvecklare

I den här artikeln förklarar vi allt du behöver veta om dataskydd för byråer: från utnämningen av dataskyddsombud till orderbehandling och samtycke till värden.

Vilka andra nackdelar kan det finnas om Google Fonts inte integreras lokalt?

Å ena sidan är det obehagligt att när som helst få en varning för att man oavsiktligt har brutit mot riktlinjerna för dataskydd. Å andra sidan kan det uppstå andra nackdelar utöver dataskyddsproblemet om Google Fonts inte integreras lokalt:

  • Längre laddningstider: Webbplatsens laddningstid kan öka eftersom teckensnitten måste laddas från externa Google-servrar.
  • Beroende av externa tjänster: Laddningstiden för din webbplats kan påverkas av avbrott eller långsamma svarstider på Googles servrar.
  • Inkonsekvent visning: Om åtkomsten till Googles servrar blockeras (t.ex. av brandväggar) kan teckensnitt inte laddas, vilket påverkar visningen av din webbplats.

Sammanfattningsvis innebär detta att den lokala integrationen av Google Fonts inte bara skyddar dig från obehagliga varningar, utan också förbättrar prestandan och tillförlitligheten på din webbplats.

Så här tar du reda på om Google Fonts körs på din WordPress-webbplats

Om du inte vet om Google Fonts körs på din WordPress-webbplats kan du använda webbläsarkonsolen eller webbplatskontrollen:

Variant 1: Använd webbläsarkonsolen

Om poster med fonts.googleapis.com eller gstatic.com visas i konsolen innebär det att Google Fonts laddas direkt från Googles servrar på din webbplats. PUL Denna begäran kan överföra personuppgifter som besökarnas IP-adress till Google, vilket utgör en potentiell dataskyddsrisk och kan bryta mot utan uttryckligt samtycke.

Chrome:

PULIntegrera Google Fonts-kompatibla lokalt i WordPress
  1. Öppna din webbplats i Chrome.
  2. Högerklicka på sidan och välj Utforska.
  3. Gå till fliken Källor.
  4. Sök efter poster med "fonts.googleapis.com" eller "fonts.gstatic.com" på vänster sida.

Firefox:

PULIntegrera Google Fonts-kompatibla lokalt i WordPress
  1. Öppna din webbplats i Firefox.
  2. Högerklicka på sidan och välj Analysera element.
  3. Byt till fliken Nätverk.
  4. Filtrera efter teckensnitt.
  5. Sök efter poster med "fonts.googleapis.com" eller "fonts.gstatic.com".

Safari:

PULIntegrera Google Fonts-kompatibla lokalt i WordPress
  1. Öppna din webbplats i Safari.
  2. Högerklicka på sidan och välj Visa elementinspektör.
  3. Byt till fliken Nätverk.
  4. Sök efter poster med "fonts.googleapis.com" eller "fonts.gstatic.com" på vänster sida.

Alternativ 2: Använd webbplatsens kontrollfunktion

Alternativt kan du också använda onlineverktyg för att kontrollera om Google Fonts är integrerade på din webbplats. Ett verktyg som vi rekommenderar är Google Fonts Scanner från eRecht24. Ange bara webbadressen till din webbplats så kontrollerar verktyget automatiskt om och vilka Google-teckensnitt som används.

PULIntegrera Google Fonts-kompatibla lokalt i WordPress

Körs Google Fonts på din webbplats? Så här förhindrar du dataöverföring till amerikanska servrar

Google Fonts används ofta som standard i teman från Internet, installerade plugins och PageBuilders. Det är därför viktigt att avaktivera dem i olika områden så att de inte längre laddas automatiskt.

Avaktivera Google Fonts i teman

Många WordPress-teman laddar Google Fonts som standard. För att förhindra detta bör du kontrollera temainställningarna:

  1. DashboardGå till Design > Customiser eller Theme Options i din WordPress .
  2. Sök efter alternativ relaterade till typsnitt eller typografi.
  3. Avaktivera Google Fonts eller välj ett annat typsnitt som är integrerat lokalt.

Avaktivera Google Fonts i PageBuilder-insticksprogram

Vissa PageBuilder-plugins som Elementor, WPBakery och Divi laddar Google Fonts som standard om inget standardteckensnitt har valts. Dessa kan avaktiveras i plugin-inställningarna:

Elementor:

  1. DashboardGå till Elementor > Inställningar i din WordPress .
  2. Gå till fliken Avancerat.
  3. Aktivera alternativet Inaktivera Google Fonts.
PULIntegrera Google Fonts-kompatibla lokalt i WordPress

WPBakery:

  1. DashboardGå till WPBakery > Inställningar i din WordPress .
  2. Gå till fliken Allmänt.
  3. Sök efter alternativet Ladda Google Fonts och avaktivera det.
PULIntegrera Google Fonts-kompatibla lokalt i WordPress

Divi:

  1. DashboardGå till Divi > Plugin-alternativ i din WordPress .
  2. Gå till fliken API-inställningar.
  3. Bläddra ner till inställningarna för prestanda.
  4. Avaktivera alternativet Använd Google Fonts.
PULIntegrera Google Fonts-kompatibla lokalt i WordPress

Andra insticksprogram:

Kontrollera inställningarna för de installerade insticksprogrammen. Sök efter alternativ som rör teckensnitt eller typografi. Avaktivera Google Fonts eller välj ett annat lokalt typsnitt.

Avaktivera Google Fonts med ett extra plugin

Det finns speciella plugins, t.ex. pluginet Disable and Remove Google Fonts, som kan hjälpa dig att inaktivera Google Fonts och använda lokala teckensnitt i stället. Dessa plugins känner igen motsvarande källkod som upprättar en anslutning till Google Fonts-tjänsterna och blockerar automatiskt dessa skript och därmed alla Google Fonts på din webbplats:

  1. Installera tillägget Disable and Remove Google Fonts.
  2. Aktivera pluginet efter installationen.

Avaktivera Google Fonts manuellt i temat via filen functions.php

Filen functions.php är en fil i ditt WordPress-tema som innehåller anpassade funktioner och kodsnuttar för att utöka funktionaliteten på din webbplats.

Det kan dock vara riskabelt att göra ändringar i den här filen, särskilt om du inte vet exakt vad du gör. Felaktiga ändringar kan leda till att din webbplats inte längre fungerar som den ska eller till och med misslyckas helt.

Av denna anledning rekommenderar vi att du endast gör justeringar om du har den nödvändiga kunskapen:

Steg 1: Skapa en säkerhetskopia

Innan du gör några ändringar i functions.php bör du skapa en fullständig säkerhetskopia av din webbplats. Detta gör att du kan återställa det ursprungliga tillståndet i händelse av ett problem.

Steg 2: Öppna functions.php

  1. DashboardGå till din WordPress .
  2. Navigera till Design > Theme Editor.
  3. Välj filen functions.php från den högra sidofältet.

Steg 3: Identifiera Google Fonts Handle

För att hitta det korrekta handtaget för Google Fonts måste du kontrollera dokumentationen för ditt tema eller plugin. Ofta hittar du den i filen functions.php eller i källkoden för det installerade WordPress-temat. Alternativt kan du använda webbläsarkonsolen för att identifiera de laddade teckensnitten.

Steg 4: Lägg till kod

Lägg till följande kod i slutet av filen functions.php. Ersätt 'theme-handle'* med det faktiska handtaget för det tema som laddar Google Fonts:


(kodblock) funktion remove_google_fonts() {

wp_dequeue_style('tema-handtag');

wp_deregister_style('theme-handle');

}


add_action('wp_enqueue_scripts', 'remove_google_fonts', 20); (slutet av kodblocket)

Steg 5: Spara ändringar

Klicka på Update file för att spara ändringarna.

*Note:

"Temahandtaget" är specifikt för varje tema och insticksprogram. Ett exempel kan vara "twentytwenty-style" för temat Twenty Twenty.

Den här anpassningen tar bort koden som laddar Google Fonts från kön och avregistrerar den, vilket förhindrar att teckensnitten laddas från externa Google-servrar. PUL Detta bidrar till att säkerställa webbplatsens efterlevnad.

Om du är osäker eller behöver hjälp rekommenderar vi att du tar hjälp av en WordPress-specialiserad byrå för att säkerställa att alla ändringar görs på ett korrekt och säkert sätt.

Är Google Fonts avaktiverade? Så här går du tillväga

Du kan avaktivera Google Fonts med de åtgärder som beskrivs och på så sätt undvika överträdelser av dataskyddslagstiftningen.

Observera dock att teckensnitten inte längre kan användas efteråt och att din webbplats kan visas med ett annat teckensnitt. Detta är normalt eftersom det är standardteckensnitt som redan finns på webbservern som nu används.

Efter avaktiveringen är det viktigt att kontrollera din webbplats. Detta för att säkerställa att den fortsätter att fungera korrekt och är läsbar.

I nästa avsnitt visar vi dig hur du konfigurerar Google Fonts lokalt.PUL På så sätt kan du fortsätta att använda de teckensnitt du vill utan att bryta mot EU:s regler eller straffas genom sämre laddningstider.

PULStäll in Google Fonts -kompatibla: Så här gör du steg för steg

Vi ska nu visa hur du kan ladda upp och använda Google Fonts eller dina egna typsnitt lokalt på din server. På så sätt undviker du problem med dataskydd och ser till att teckensnitten fortfarande visas korrekt.

Det finns olika sätt att göra detta på, som vi kommer att visa dig steg för steg nedan:

Konfigurera Google Fonts lokalt via insticksprogram

PULDet enklaste sättet att ställa in Google Fonts -kompatibla är att använda speciella plugins. Dessa plugins avaktiverar den direkta anslutningen till Googles servrar och möjliggör lokal användning av teckensnitten. För detta ändamål laddas teckensnitten ner och lagras på webbservern.

PULIntegrera Google Fonts-kompatibla lokalt i WordPress
  • Sök i WordPress plugin-katalog efter ett plugin som OMGF (Optimise My Google Fonts).
  • Installera och aktivera insticksprogrammet.
  • Konfigurera sedan plugin-programmet via Inställningar för att säkerställa att Google Fonts integreras lokalt.

Konfigurera Google Fonts lokalt via webbplatsen Google Fonts Helper

Ett annat sätt att integrera Google Fonts lokalt är att använda webbplatsen Google Fonts Helper. Detta är det manuella sättet, men kräver inte ett extra plugin. Observera att detta tillvägagångssätt är mer komplext och kräver en viss erfarenhet av CSS och webbservrar.

PULIntegrera Google Fonts-kompatibla lokalt i WordPress

Steg 1: Välj teckensnitt

Steg 2: Generera CSS-kod

  • Välj önskad typsnittsstil (t.ex. normal, fet, kursiv).
  • Klicka på Generera CSS och kopiera den CSS-kod som visas.

Steg 3: Ladda ner filer

  • Klicka på Download files och spara teckensnittsfilerna på din dator.

Steg 4: Ladda upp filer till webbservern

  • Anslut till din webbserver via FTP.
  • Skapa en ny mapp i katalogen för ditt tema (t.ex. fonts) och ladda upp de nedladdade fontfilerna till den här mappen.

Steg 5: Anpassa CSS-filen

  • Öppna CSS-filen för ditt tema (t.ex. style.css).
  • Lägg till den genererade CSS-koden och justera sökvägarna till teckensnittsfilerna i enlighet med detta.
  • Uppdatera CSS-filen för att använda det nya teckensnittet i din design.

Nu är det klart! PUL Med dessa steg kan du integrera Google Fonts lokalt och använda dem i enlighet med utan att installera ett plugin.

Integrera Google Fonts lokalt med Elementor Custom Fonts

Använder du Elementor Pro på din WordPress-webbplats? För användare av Elementor Page Builder i den betalda Pro-versionen finns det en inbyggd funktion för att använda anpassade teckensnitt.

Steg 1: Ladda ner teckensnitt

  • Besök webbplatsen Google Fonts Helper och ladda ner önskat teckensnitt.
  • Se till att du laddar ner alla nödvändiga teckensnitt (t.ex. normal, fet, kursiv).

Steg 2: Öppna Elementor

  • Dashboard Öppna Elementor i din WordPress och gå till inställningarna.

Steg 3: Lägg till anpassade teckensnitt

  • Navigera till Elementor > Anpassade teckensnitt och klicka på Lägg till.

Steg 4: Ladda upp teckensnittsfiler

  • Ladda upp de nedladdade teckensnittsfilerna. Se till att ladda upp varje typsnitts vikt och typ (normal, fet, kursiv osv.) separat.
  • Ge typsnittet ett namn så att du lätt kan hitta det igen senare.

Steg 5: Använd typsnitt i designen

  • Välj det uppladdade teckensnittet i din Elementor-design för att använda det.
PULIntegrera Google Fonts-kompatibla lokalt i WordPress

PUL Slutsats: och WordPress-webbplatser - så här går det nu

Med hjälp av de metoder som presenteras här kan du integrera Google Fonts på din webbplats i enlighet med dataskyddsbestämmelserna. Detta skyddar inte bara dina besökares integritet, utan förbättrar också webbplatsens prestanda och tillförlitlighet.

PULDet kan dock vara klokt att ge en professionell byrå i uppdrag att genomföra implementeringen för att säkerställa att alla aspekter av efterlevnad täcks. Professionella kan hjälpa dig att undvika juridiska fallgropar och hitta en optimal lösning för din webbplats.

Några ord om fivecode

WooCommerce Byrån fivecode WordPress från Münster är specialiserad på individuell utveckling av WordPress webbplatser och webbshopar. Vi har stöttat kunder i hela Tyskland sedan 2022, från webbplatsdesign till efterföljande marknadsföring och underhåll. Vi ser webbplatser som ett lukrativt onlineverktyg som aktivt främjar våra kunders verksamhet i det digitala rummet och stärker det mot konkurrensen. Vi lägger stor vikt vid individualitet, kreativitet och professionell programmering.

Vanliga frågor om Google Fonts WordPress

Vad är problemet med Google Fonts?

PULGoogle Fonts är problematiska eftersom de överför data till Googles servrar när de laddas.

Dessa servrar är ofta placerade utanför EU och omfattas av olika dataskyddsbestämmelser.

Överföring av IP-adresser och andra uppgifter kan leda till brott mot dataskyddet utan uttryckligt medgivande från användaren.

För att undvika dessa problem bör Google Fonts hostas lokalt på din server.

PULVilka teckensnitt är kompatibla?

PULTeckensnitt är -compliant om de hostas lokalt på din egen server och därför inte överför några personuppgifter som IP-adresser till externa servrar.

PULDu kan spara och integrera både Google Fonts och andra teckensnitt lokalt för att kunna använda dem i enlighet med . 

Hur kan jag se om Google Fonts är integrerade lokalt?

Det finns flera metoder för att kontrollera om Google Fonts är integrerade lokalt:

  1. Öppna webbläsarkonsolen i Chrome, Firefox eller Safari.
  2. Byt till fliken Nätverk och ladda om sidan.
  3. Sök efter poster med "fonts.googleapis.com" eller "gstatic.com".

Om dessa poster inte visas är teckensnitten integrerade lokalt. I annat fall laddas de direkt från Googles servrar, vilket kan ge upphov till problem med dataskyddet.

Alternativt kan du också använda onlineverktyg för att kontrollera om Google Fonts är integrerade på din webbplats: Ett verktyg som rekommenderas är Google Fonts Scanner från eRecht24. Ange bara webbadressen till din webbplats så kontrollerar verktyget automatiskt om och vilka Google-teckensnitt som används.

Är Google Fonts kostnadsfria?

Ja, Google Fonts kan användas kostnadsfritt. Google erbjuder ett omfattande bibliotek med typsnitt som kan integreras i webbplatser utan kostnad.

Användningen är kostnadsfri, oavsett om teckensnitten laddas från Googles servrar eller lokalt från din egen server.

PULDu bör dock se till att du integrerar teckensnitten i enlighet med gällande regler för att undvika problem med dataskydd.

Hur kan jag avaktivera Google Fonts?

Du kan använda olika metoder för att inaktivera Google Fonts.

  • Temainställningar: Många teman erbjuder alternativ för att avaktivera Google Fonts.
  • Använd insticksprogram: Med plugins som Disable and Remove Google Font s kan du avaktivera Google Fonts med bara några få klick.
  • Elementor: Du kan också avaktivera Google Fonts i Elementor-inställningarna.

Dessa åtgärder förhindrar att Google Fonts laddas från externa servrar. Observera dock: Om du avaktiverar Google Fonts på din webbplats kan designen på din sida ändras, eftersom teckensnitten inte längre visas som vanligt. Istället visas de teckensnitt som används av ditt tema eller din webbläsare som standard. Ibland ser det dock inte så snyggt ut. För att undvika detta bör du se till att du integrerar alternativa teckensnitt lokalt och justerar dem i CSS så att designen på din webbplats förblir konsekvent.

"*" visar obligatoriska fält

Jag vill prenumerera på nyhetsbrevet för att få information om nya bloggartiklar, e-böcker, funktioner och nyheter om WordPress. Jag kan återkalla mitt samtycke när som helst. Observera vår integritetspolicy.
Det här fältet är avsett för validering och bör inte ändras.

Tyckte du om artikeln?

Med din recension hjälper du oss att förbättra vårt innehåll ytterligare.

Skriva en kommentar

Din e-postadress kommer inte att publiceras. Obligatoriska fält är markerade med *.