De header is een van de belangrijkste onderdelen van een website. Het staat aan de bovenkant van de pagina en verschijnt op vrijwel elke pagina. Het is dus slim deze aan te passen en er de nodige aandacht aan te besteden.
Heel wat WordPress gebruikers lieten ons weten dat ze niet wisten hoe dit te doen, dus beslisten we een stap-voor-stap-gids te maken over het aanpassen van de header van een WordPress website.
Waarom de header aanpassen op je WordPress website?
De header is het eerste wat de bezoeker ziet. En zoals je weet kan je een eerste indruk maar één keer maken. Volgens een recente studie duurt het gemiddeld 0,05 seconden voor een bezoeker om te beslissen of hij je website aantrekkelijk vindt of niet, en dus of hij blijft of je website onverbiddelijk wegklikt.
Uit een studie van de Nielsen Norman Group blijkt dat daarna de bezoeker 10 tot 20 seconden kijkt en dan beslist of hij blijft of niet. Dat is dus niet genoeg tijd om de inhoud te lezen. We leven in een erg visueel gerichte wereld. Niet alleen de kwaliteit van de inhoud van je WordPress website is dus van belang: hoe hij eruit ziet is minstens even belangrijk.
Branding is daarom ook zo’n groot hoofdstuk in marketing. Een herkenbaar merk met een zelfzekere unieke uitstraling boezemt vertrouwen. Je website personaliseren is dus zeker het overwegen waard.
Methodes om de header aan te passen
WordPress laat je toe dit op verschillende manieren te doen. Bij deze wat beginnersvriendelijke manieren:
– Gebruik van een plug-in, zoals Insert Headers and Footers
– Opmaak van de .php-file van de header, in het thema
– Met een FTP client
1. Insert Headers and Footers plug-in
Wanneer je het fijner vindt plug-ins te gebruiken, in plaats van codering en aanpassen van files, is dit een mooie oplossing.
Insert Headers and Footers is een eenvoudige tool, die geen ingewikkelde configuraties vereist.
1. Log in op je WordPress Dashboard
2. Ga naar Plugins > Voeg toe. Van daaruit kan je in de WordPress Repository de plug-in zoeken die je wil installeren. Via de zoekbalk vind je wat je nodig hebt in de WordPress bibliotheek.
3. Selecteer je optie, installeer hem en activeer hem dan.
4. Nu kun je beginnen met configureren van je nieuwe plug-in. Onder instellingen zie je drie vakken voor het aanpassen van de scripts voor de header, de tekst en de voettekst. Wanneer je daar een code toevoegt, kies je in dit geval voor de tag .
5. Voeg je codes toe in het vak voor het script voor de header.
6. Vergeet je aanpassingen niet op te slagen.
7. Klaar!
Zo eenvoudig is het.
2. De header.php file van het theme aanpassen
Wanneer je wat basiskennis hebt van coderen, en je wil wat meer controle over hoe je header er gaat uitzien, kan je de .php-file van je header aanpassen. Je vermijdt hierdoor ook een extra plug-in te installeren, die de laadsnelheid van je website beïnvloedt.
Je moet hiervoor dus de kern-files van het thema gaan aanpassen. Dat kan je ook weer vanuit je WordPress Admin Dashboard.
1. Log in op je WordPress Dashboard.
2. Ga naar Weergave. Daar vindt je onderaan het menu Editor.
3. Dit is waar je de aanpassingen maakt. Je krijgt de .css-file te zien dat standaard aan het thema gelinkt is.
4. Aan de linkerkant zie je de beschikbare files en folders van je huidige thema.
5. Scroll naar beneden tot je header php vindt (onder Theme Header)
6. Selecteer de file en open het met de editor.
7. Pas de code aan. Vergewis je ervan dat de snippet tussen 2
tags staat.8. Klik Update, om je wijzigingen op te slaan.
Wanneer je een Google Analytics traceercode wilt toevoegen, Google AdSense auto ads code/ verification code, of zelfs een Google search console verification code, moet je die net voor de tag plaatsen. Het werkt alleen wanneer je een update hebt gedaan na het toevoegen van de snippets.
Wil je de lettergrootte en het lettertype wijzigen, moet je een beetje CSS kennen. Je doet dat ook via het onderdeel Weergave, maar je klikt Customize.
3. Via de FTP client
Wanneer het je niet lukt om de header te bewerken via de editor van het WordPress thema, kan je ook de FTP client gebruiken. Dit voorbeeld is gebaseerd op FileZilla.
1. Om met een FTP te verbinden, heb je een FTP account nodig. Vanuit het cPanel van de host kan je er één aanmaken. Met gebruikersnaam, hostnaam en paswoord port maak je verbinding tussen de FTP client en je server.
2. Aan de linkerkant zie je de lokale opslag en aan de rechterkant de serveropslag. Om de header te bewerken ga je naar de directory van je actieve thema.
3. Dat zal er zo uitzien: /wp-content/themes/theme-name/. Hier zoek je de header.php file.
4. Klik erop met de rechtermuisknop en kies de optie edit. De file wordt opgeslagen in je lokale opslag en wordt geopend in een Notepad document, of de editor die op jouw computer als standaard staat.
5. Hier maak je de wijzigingen, net voor de tag. Bewaar en upload de file opnieuw naar de server.
6. Klaar! Je kan de veranderingen nakijken in de broncode van de website.
Wat kan je toevoegen in een header?
– Google Analytics Tracking Code / Verification Code
– Script voor advertenties
– Socia Media Scripts / Pixels / Verification Code
Nog hulp nodig? Contacteer ons.
Bekijk ook het Linkedin profiel van onze creatief directeur Michel Schönhage, zoveel mooie reviews kan geen toeval zijn!