WPLounge
Favicon toevoegen aan je WordPress-website
Home » Tutorials » Favicon toevoegen aan je WordPress-website

Favicon toevoegen aan je WordPress-website

Wil je een favicon toevoegen aan je WordPress-website? Het toevoegen van een favicon is heel eenvoudig.

Affiliate disclaimer:
In onze artikelen en op onze pagina's staan affiliate links. Wanneer je via één van deze links een aankoop doet, ontvangen wij een (meestal kleine) commissie van de verkoper. Wij geven altijd onze eerlijke mening over producten. Klik hier voor meer informatie.

In dit artikel laat ik je zien hoe je een favicon maakt, waar de afbeelding aan moet voldoen en hoe je deze vervolgens toevoegt aan je WordPress-site.

Wat is een favicon?

Een favicon is een klein icoontje dat in de browserbalk van je bezoekers wordt getoond. In de afbeelding bovenaan dit artikel zie je hoe dat er op WPLounge uit ziet. Dit icoontje wordt ook gebruikt als bezoekers je website aan hun favorieten toevoegen. In de favorieten-balk van hun browser wordt dan je favicon getoond. De meeste bedrijven kiezen voor een klein, herkenbaar beeldmerk als favicon.

TIP VAN WPLOUNGE
Divi theme & Divi Builder
Bij Elegant Themes ontvang je meer dan
85 premium WordPress themes (waaronder Divi!) voor maar 89 dollar!
Bekijk de themes »»
Lees meer over Divi.
Favicon nu.nl
Favicon op Nu.nl

In de afbeelding hierboven zie je de favicon van Nu.nl als voorbeeld.

Hoe maak je een favicon?

Om een favicon te maken die je in WordPress kunt gebruiken, kun je het beste een vierkante afbeelding maken met een minimaal formaat van 512×512 pixels. Zelf gebruik ik hier Photoshop voor, maar je kunt ook een ander programma gebruiken.

Gebruik een transparante achtergrond

Ik raad je ook aan om je favicon als PNG te maken. Logo’s en beeldmerken zien er als PNG vaak scherper uit dan JPG. Bovendien kan een PNG-afbeelding een transparante achtergrond hebben. Zo weet je zeker dat je favicon er in iedere browser mooi uit ziet. In de onderstaande afbeelding zie je het verschil tussen een JPG en een transparante PNG. Klik op de afbeelding voor een grotere weergave.

Favicon als PNG uploaden

Zoals je kunt zien ziet de linker variant (JPG met witte achtergrond) er een stuk minder goed uit. Dat komt doordat de JPG een witte achtergrond heeft. Rechts zie je de PNG-versie met transparante achtergrond. Zo wordt je favicon op een mooie manier getoond in iedere browser, doordat er geen wit vlak onder je favicon zichtbaar is. Het is een klein detail, maar een transparante PNG ziet er een stuk professioneler uit.

Favicon toevoegen aan je WordPress-website

Site-identiteit in WordPress CustomizerNu je een logo of icoontje hebt gemaakt met een transparante achtergrond, kun je deze gaan uploaden naar WordPress. Hiervoor gebruiken we de WordPress Customizer. Deze open je door naar Weergave > Customizer te gaan, of bovenin de toolbar op “Customizer” te klikken terwijl je je website aan het bekijken bent.

Zodra je in de WordPress Customizer zit, klik je op Site-identiteit. Hier kun je de titel en ondertitel van je website aanpassen én een favicon uploaden (zie ook de afbeelding rechts. Klik op Selecteer afbeelding en upload vervolgens de favicon die je hebt gemaakt. In de Customizer zie je vervolgens direct het resultaat in je browserbalk.

Ben je tevreden met het resultaat? Klik dan op de “Publiceren”-knop bovenin de WordPress Customizer.

Als je favicon niet werkt

In sommige gevallen kan het zo zijn dat je WordPress-theme óók functionaliteit heeft voor favicons. Je theme stamt dan waarschijnlijk uit de tijd dat je in WordPress (standaard) nog geen favicon kon uploaden. Mocht dit het geval zijn, dan kun je je favicon meestal uploaden onder het “Theme Options”-menu van je WordPress-theme.

Een andere optie die je kunt uitproberen is om een plugin te installeren, zoals de All In One Favicon-plugin. Toch is dit eigenlijk niet nodig, zeker nu WordPress de functionaliteit aan de Customizer heeft toegevoegd.

Conclusie

Voor het toevoegen van een favicon aan je WordPress-website heb je geen technische kennis nodig. Het is tegenwoordig heel eenvoudig om een favicon toe te voegen dankzij de WordPress Customizer. Houd er bij het maken van je favicon rekening mee dat het mooier is om deze als PNG op te slaan, met een transparante achtergrond. Als je JPG gebruikt wordt je favicon in veel gevallen in een wit blokje getoond.

Beoordeel dit artikel

(4 ratings, gemiddeld: 5,00 van de 5)

Wouter Postma

Oprichter WPLounge. Blogt ook in het Engels op WPLounge.org.

Gratis op de hoogte blijven?

Meld je gratis aan voor onze nieuwsbrief om op de hoogte
te blijven over ontwikkelingen in WordPress!

Reageer

Advertenties

SEO scan door kiesling.nl

Blijf op de hoogte!

Scroll Up Skip to content