Is het u ooit opgevallen dat sommige websites een klein pictogram naast hun naam op uw browsertabblad hebben? Dit worden favicons genoemd en ze kunnen een geweldige manier zijn om branding en persoonlijkheid aan uw website toe te voegen. Als u WordPress gebruikt, is het toevoegen van een favicon relatief eenvoudig.
Een favicon is een klein icoontje dat uw website vertegenwoordigt. Het wordt doorgaans weergegeven in de adresbalk van uw browser, naast de naam van uw website in een lijst met bladwijzers, en kan ook door webbrowsers op tabbladen worden gebruikt.
Met WordPress kunt u eenvoudig een favicon naar uw website uploaden. Deze tutorial laat zien hoe je een WordPress-favicon toevoegt.
Inhoudsopgave
Hoe WordPress Favicon toevoegen?
Stap 1: Maak uw Favicon-afbeelding
Het eerste dat u hoeft te doen, is uw favicon-afbeelding maken.
Dit moet een PNG-, GIF- of ICO-bestand van 16x16px of 32x32px zijn.
U kunt dit bestand maken in uw favoriete afbeeldingseditor. Voor de beste resultaten maakt u een eenvoudige afbeelding met een effen achtergrondkleur die het logo of de initialen van uw website bevat. Nadat u uw afbeelding heeft gemaakt, slaat u deze op in een map op uw computer, waar u deze later kunt terugvinden.
Stap 2: Upload uw afbeelding naar WordPress
Vervolgens moet u uw favicon-afbeelding uploaden naar WordPress.
Om dit te doen, logt u in op uw WordPress Dashboard en gaat u naar de pagina Instellingen > Media.
Op deze pagina ziet u een optie voor 'Bestanden uploaden'. Selecteer onder 'Bestanden uploaden' de optie 'Mijn uploads ordenen in mappen op basis van maanden en jaren' en klik vervolgens op de knop 'Wijzigingen opslaan' onder aan de pagina.
Nu dat uit de weg is, gaat u naar de pagina Media > Nieuwe toevoegen en uploadt u uw favicon-afbeelding vanaf uw computer. Zodra de afbeelding is geüpload, kopieert u de URL uit het veld 'Bestands-URL' en plakt u deze op een veilige plek voor later gebruik. U heeft deze URL nodig in stap 4.
Stap 3: Voeg de Favicon-code toe aan uw Header.php-bestand
Nu uw afbeelding naar WordPress is geüpload, moet u het header.php-bestand van uw thema bewerken om WordPress te vertellen waar het te vinden is. Om dit te doen, gaat u naar Weergave > Editor vanuit uw WordPress Dashboard.
Op de pagina Thema's bewerken selecteert u het header.php-bestand uit de lijst met sjablonen aan de rechterkant en klikt u erop om het in de editor te openen.
Zodra header.php geopend is, zoekt u naar de tag bovenaan het bestand.
Als er nog geen is, voeg deze dan net onder de opening toe taggen als volgt: . Nu, direct boven de tag, voeg de volgende code toe:
Zorg ervoor dat u “Paste_URL_Here” vervangt door de daadwerkelijke URL van uw favicon-afbeelding die u in stap 2 heeft gekopieerd! Nadat u deze code heeft toegevoegd en “Paste_URL_Here” heeft vervangen door uw URL, klikt u op de knop “Bestand bijwerken” onder aan de pagina om uw wijzigingen op te slaan.
Als u op dit moment een voorbeeld van uw website bekijkt in een browser (door naar www[UwSitenaam].com te gaan), zou u uw nieuwe favicon naast de naam van uw site moeten zien!
Maak je echter geen zorgen als je het nog niet ziet; soms cachen browsers pagina's en worden er pas bijgewerkte favicons weergegeven als u uw cache leegmaakt of uw site bezoekt in een privé-browservenster.
Er zijn twee methoden die u kunt gebruiken om een favicon aan uw WordPress-site toe te voegen.
De eerste methode is om een plug-in te gebruiken, en de tweede methode is om de code van je thema te bewerken.
1) Als u een plug-in gebruikt, raden we u aan de Favicon by RealFaviconGenerator-plug-in te gebruiken.
Met deze plug-in kunt u uw favicon eenvoudig uploaden en indien nodig bewerken. Het zorgt er ook voor dat uw favicon correct wordt weergegeven op alle browsers en apparaten.
Om de plug-in te gebruiken, installeert en activeert u eerst de plug-in. Ga vervolgens naar Instellingen > Favicon van RealFaviconGenerator in uw WordPress-beheergebied. Vanaf hier kunt u uw favicon uploaden of in de URL plakken waar uw favicon zich bevindt.
De plug-in genereert vervolgens automatisch de verschillende formaten die nodig zijn voor verschillende apparaten en browsers. Klik ten slotte op de knop “Favicon genereren” en download het gegenereerde pakket. Eenmaal gedownload, pakt u het pakket uit en uploadt u de inhoud via FTP naar de hoofdmap van uw WordPress-site.
2) Als u geen plug-in wilt gebruiken, kunt u ook een favicon toevoegen door de code van uw thema te bewerken. Om dit te doen, maakt u eerst een PNG- of ICO-bestand van 16x16px voor uw favicon. Upload het vervolgens via FTP naar de hoofdmap van uw WordPress-site. Bewerk ten slotte het header.php-bestand van uw thema en plak de volgende code erin: /favicon.ico”>
Sla uw wijzigingen op en upload het header.php-bestand terug naar uw server. Dat is het! Uw favicon zou nu op het tabblad van uw webbrowser moeten verschijnen wanneer u uw website bezoekt.
Conclusie
Dat is alles wat u hoeft te doen om een favicon toe te voegen in WordPress! Zoals we eerder vermeldden, worden favicons steeds belangrijker omdat steeds meer mensen meerdere tabbladen gebruiken tijdens het surfen op internet. Het is dus zeker de moeite waard om een paar minuten de tijd te nemen om er een aan uw eigen site toe te voegen.
Als je vragen hebt over dit proces of onderweg problemen tegenkomt, laat het ons dan weten in de reacties hieronder!
Lees ook:
