Heerenveen probeert WhatsApp als kanaal
5 juni
CSS text-shadow
17 juni
Laat alles zien

Google fonts in jouw wordpress site

Met de komst van CSS3, de @font-face regels en services als google fonts is het voor webdesigners veel makkelijker om creatief te zijn met typography. Via google fonts zijn er al meer dan 630 verschillende fonts beschikbaar, en in dit artikel leer je hoe makkelijk het is om deze te integreren met jouw wordpress site. Op de google fonts pagina staan mooie instructies om deze fonts in wordpress te integreren. Maar op die methode houd wel in dat je de header.php of de funtions.php en de stylesheet zou moeten aanpassen, terwijl er een veel eenvoudiger manier is om dit te doen.

Als eerste moet je de google fonts plugin van ThemeTrust instaleren. Het mooie van deze plugin is dat het direct wordt geintegreerd met de wordpress customizer, waardoor direct kunt zien wat er gebeurt met je site als je een andere font gebruikt.

ThemeTrust

Hoe gebruik ik de plugin

Nadat je het hebt geïnstalleerd ga naar weergave -> Aanpassen en je ziet direct een extra google fonts menu.

google_fonts_11 Je ziet nu 8 verschillende onderdelen die je kunt aanpassen:

  • All Text
  • Paragraph Text
  • Header 1
  • Header 2
  • Header 3
  • Links
  • Blockquote
  • List Item

 

Bij elk onderdeel kun je kiezen voor een font en de zwaarte van die font. Als je een speciale font wil gebruiken voor bijvoorbeeld de h3 in de footer kun je #footer in de ruimte onder CSS Selectors zette. Je kunt hier dan ook meerdere selectors neerzetten door ze met een komma te scheiden.

 

 

 

 

via Web Design Ledger How to Easily Use Google Fonts in WordPress | Tutorials.

Vincent Hofman
Vincent Hofman
Sinds 1998 bezig met het maken van webpagina's , muzikant en levensgenieter. Ik vertaal veel Engelse artikelen in het Nederlands en zoek het web af voor interessante sites en weetjes. Heb sinds 2013 mijn eigen bedrijf voor web-consulting en web-developement

Geef een reactie

%d bloggers liken dit: