Google-lettertypen insluiten in Wordpress-site

click fraud protection

Google Fonts is sinds de ontwikkeling in 2010 dé bron geworden voor aangepaste webtypografie. Er zijn drie belangrijke redenen waarom Google hier de koploper is geworden. Ten eerste waren er geen lettertypeservices die goed genoeg waren, dus Google vulde de leegte. Ten tweede, zelfs in het begin was de variëteit die ze aanboden relatief groot. Momenteel zijn er meer dan 800 lettertypen beschikbaar in tal van stijlen. Ten derde zijn deze lettertypen gratis beschikbaar, wat ze bijzonder aantrekkelijk maakt.

Bovendien zijn ze verrassend eenvoudig te integreren in uw ontwerpprojecten. We laten u zien hoe u deze Google-lettertypen kunt opnemen in uw WordPress-site.

Google-lettertypen

Om te beginnen, moet u het lettertype selecteren waarmee u wilt werken. Er zijn verschillende opties, dus je hebt een vrij groot menu om uit te kiezen. Je kunt ze vinden door naar te gaan De lettertypepagina van Google. Als u op zoek bent naar een specifiek lettertype, typt u gewoon de naam van het lettertype in het vak Zoeken en er zou een voorbeeld moeten verschijnen.

Er zijn ook andere zoekparameters die u kunt gebruiken. Rechts onder het zoekvak bevindt zich een knop met de naam Categorieën. Als u hierop klikt, verschijnt er een vervolgkeuzemenu met vijf opties. Deze zijn als volgt:

  • Serif - Dit zijn lettertypen met korte lijnen die voortkomen uit de bovenste en onderste streken van een letter. Times New Roman en Sylfaen zijn goede voorbeelden.
  • Sans Serif – Zoals de naam al doet vermoeden, zijn dit lettertypen zonder die kleine lijntjes. Ze hebben de neiging om een ​​​​eenvoudige en schone esthetiek te hebben.
  • Display - Dit zijn wat opvallende lettertypen kan worden genoemd. Ze zijn het beste voor koppen in plaats van lange tekst.
  • Handschrift - Door deze lettertypen lijkt het alsof iemand ze met de hand heeft geschreven. U zult merken dat veel cursief zijn of minder consistente spatiëring hebben.
  • Monospace - Net als een typemachine nemen hun letters dezelfde horizontale breedte in beslag. Ze zijn zeer consequent gespreid.

Daarnaast heb je ook andere opties om uit te kiezen, zoals het selecteren van de taal- en lettertype-eigenschappen. Dit laatste omvat het aantal stijlen, dikte, helling en breedte.

Lettertypen insluiten in WordPress

Als u deze unieke lettertypen in uw WordPress-site wilt opnemen, zijn er verschillende methoden die u kunt proberen.

CSS gebruiken

Klik op het lettertype uit de selectie van Google en u gaat naar de gedetailleerde lettertypepagina. In de rechterbovenhoek staat een "+" teken. Klik daarop en er wordt een zijvenster geopend. Klik op 'Insluiten'.

Nu kunt u klikken op @importeren. Dit opent de CSS-code die u moet kopiëren. Ga naar de stylesheet van je WordPress-thema en plak deze aan het begin. Zorg ervoor dat u de importlink hebt gekopieerd zonder de  haakjes. Zorg ervoor dat je opslaat, dan heb je het lettertype toegevoegd.

PHP gebruiken

Volg de eerste paar stappen en kopieer de link die u krijgt nadat u op het "+"-teken hebt geklikt. Voeg het nu gewoon toe aan het header.php-bestand van uw thema. Vergeet niet op te slaan om het lettertype toe te voegen.

Een Javascript-functie gebruiken

Je kunt ook iets proberen dat 'wachtrijen' wordt genoemd. U moet hiervoor de functie wp_enqueue_style gebruiken. Via deze methode kunt u het gekozen lettertype toevoegen aan het kopgedeelte van al uw webpagina's. Het is een geweldige manier om meerdere wijzigingen tegelijk toe te voegen.

Haal gewoon de link van het lettertype (van http tot de ”), en voeg deze toe aan het functions.php -bestand van je thema met extra code eromheen. Dit is de code die je moet gebruiken:

functie custom_add_google_fonts() {

wp_enqueue_style( ‘custom-google-fonts’, https://fonts.googleapis.com/css2?family=Chelsea+Market&display=swap, onwaar);

}

add_action( 'wp_enqueue_scripts', 'custom_add_google_fonts');

Al deze opties werken prima om Google Fonts te integreren in uw WordPress-website, dus het is belangrijk om degene te kiezen waar u zich het prettigst bij voelt.