{"id":4776,"date":"2025-08-22T07:33:40","date_gmt":"2025-08-22T07:33:40","guid":{"rendered":"\/nl\/tutorials\/?p=4776"},"modified":"2025-12-18T13:20:50","modified_gmt":"2025-12-18T13:20:50","slug":"wordpress-header","status":"publish","type":"post","link":"\/nl\/tutorials\/wordpress-header\/","title":{"rendered":"Zo bewerk je de WordPress header met de site editor of customizer (inclusief tips)"},"content":{"rendered":"<p class=\"wp-block-paragraph\">WordPress headers zijn bepalend voor de eerste indruk van je bezoekers. Door te weten hoe je een WordPress header kan bewerken, kun je je merkidentiteit versterken, de navigatie verbeteren of simpelweg het uiterlijk van je website opfrissen.<\/p><p class=\"wp-block-paragraph\">Gelukkig kun je in WordPress eenvoudig je header aanpassen via de <strong>Customizer<\/strong> of de Site Editor. Beide methodes zijn snel en gebruiksvriendelijk &ndash; je keuze hangt af van je voorkeur en het thema dat je gebruikt.<\/p><p class=\"wp-block-paragraph\">In dit artikel laten we zien hoe je met beide tools aan de slag gaat &eacute;n delen we handige tips voor het maken van een effectieve header.<\/p><h2 class=\"wp-block-heading\" id=\"h-zo-bewerk-je-een-wordpress-header\"><strong>Zo bewerk je een WordPress header<\/strong><\/h2><p class=\"wp-block-paragraph\">Hoe je een header aanpast in <a href=\"\/nl\/tutorials\/wordpress\/\">WordPress<\/a>, hangt af van het thema en de versie van de software die je gebruikt. Die bepalen namelijk welke functies en tools je tot je beschikking hebt om een custom header te maken.<\/p><p class=\"wp-block-paragraph\">De twee meestgebruikte methodes zijn het bewerken via de<strong> Site Editor<\/strong> en via de <strong>Customizer<\/strong>. In deze handleiding gebruiken we de nieuwste versie: <a href=\"https:\/\/www.hostinger.com\/blog\/wordpress-6-5\/\">WordPress 6.5<\/a>.<\/p><h3 class=\"wp-block-heading\" id=\"h-zo-bewerk-je-de-header-in-wordpress-met-de-site-editor\"><strong>Zo bewerk je de header in WordPress met de Site Editor<\/strong><\/h3><p class=\"wp-block-paragraph\">Vanaf WordPress versie 5.0 is de standaard editor ge&iuml;ntegreerd met <a href=\"\/nl\/tutorials\/wordpress-gutenberg\/\">Gutenberg<\/a>. Deze editor werkt met blokken waarmee je eenvoudig elementen aan je website toevoegt, zoals kopjes, alinea&rsquo;s, lijsten en afbeeldingen.<\/p><p class=\"wp-block-paragraph\">Let op: niet alle thema&rsquo;s zijn compatibel met de Gutenberg Editor. Je kunt de Site Editor alleen gebruiken als je thema een blok thema is.<\/p><p>\n\n\n<div class=\"announcement-block announcement-block--important\">\n            <span class=\"announcement-block__heading\">\n                <svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\">\n                    <path fill-rule=\"evenodd\" clip-rule=\"evenodd\"\n                          d=\"M12 22.5C17.799 22.5 22.5 17.799 22.5 12C22.5 6.20101 17.799 1.5 12 1.5C6.20101 1.5 1.5 6.20101 1.5 12C1.5 17.799 6.20101 22.5 12 22.5ZM13.637 7.65198C13.637 6.74791 12.9041 6.01501 12 6.01501C11.0959 6.01501 10.363 6.74791 10.363 7.65198C10.5335 9.53749 10.875 13.383 10.875 13.383C10.875 14.0043 11.3787 14.508 12 14.508C12.6213 14.508 13.125 14.0043 13.125 13.383V13.38L13.637 7.65198ZM11.9927 15.714C11.3714 15.714 10.8677 16.2177 10.8677 16.839C10.8677 17.4603 11.3714 17.964 11.9927 17.964H12.0073C12.6286 17.964 13.1323 17.4603 13.1323 16.839C13.1323 16.2177 12.6286 15.714 12.0073 15.714H11.9927Z\"\n                          fill=\"#FEA419\"\/>\n                <\/svg>\n                Important\n            <\/span>\n            <p class=\"announcement-block__content\">\n                <strong>Belangrijk! <\/strong>Zie je het menu-item Editor niet in je WordPress admin dashboard? Dan ondersteunt je gekozen thema de volledige Site Editor niet. Toch je header aanpassen? Gebruik in dat geval de Customizer.\n            <\/p><\/div>\n\n\n\n<\/p><p class=\"wp-block-paragraph\">Zo pas je je header aan met de Site Editor:<\/p><ol class=\"wp-block-list\">\n<li>Ga in je WordPress dashboard naar <strong>Weergave &rarr; Editor<\/strong>.<\/li>\n\n\n\n<li>Zodra de Site Editor is geopend, klik je in het linkermenu op <strong>Patronen<\/strong>.<\/li>\n\n\n\n<li>Scroll naar beneden naar het gedeelte <strong>Template Onderdelen<\/strong> en selecteer <strong>Header<\/strong>.Let op: het aantal beschikbare header template onderdelen hangt af van je gekozen blok thema.<\/li>\n<\/ol><div class=\"wp-block-image\">\n<figure data-wp-context='{\"imageId\":\"6a91e514bf1ad\"}' data-wp-interactive=\"core\/image\" data-wp-key=\"6a91e514bf1ad\" class=\"aligncenter wp-lightbox-container\"><img decoding=\"async\" data-wp-class--hide=\"state.isContentHidden\" data-wp-class--show=\"state.isContentVisible\" data-wp-init=\"callbacks.setButtonStyles\" data-wp-on--click=\"actions.showLightbox\" data-wp-on--load=\"callbacks.setButtonStyles\" data-wp-on--pointerdown=\"actions.preloadImage\" data-wp-on--pointerenter=\"actions.preloadImageWithDelay\" data-wp-on--pointerleave=\"actions.cancelPreload\" data-wp-on-window--resize=\"callbacks.setButtonStyles\" src=\"https:\/\/lh7-qw.googleusercontent.com\/docsz\/AD_4nXdOhOgMRBJlRrvDRCfWMsrSQD-f-pUEqUWJo91_C6QC1gb7_9XUFLHEWuQMDlg_Y40E0kIdHvMVJ6QGtPrk0hxIttz1bZtMnhWlaaCscfq-Q0W-qKLBT6qF0DcyQ-PdU3ucIwRS?key=d-WOuKA4wfkiWPSpXkicNw\" alt=\"Scroll naar beneden naar het gedeelte Template Onderdelen en selecteer Header.\"><button class=\"lightbox-trigger\" type=\"button\" aria-haspopup=\"dialog\" data-wp-bind--aria-label=\"state.thisImage.triggerButtonAriaLabel\" data-wp-init=\"callbacks.initTriggerButton\" data-wp-on--click=\"actions.showLightbox\" data-wp-style--right=\"state.thisImage.buttonRight\" data-wp-style--top=\"state.thisImage.buttonTop\">\n\t\t\t<svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"12\" height=\"12\" fill=\"none\" viewbox=\"0 0 12 12\">\n\t\t\t\t<path fill=\"#fff\" d=\"M2 0a2 2 0 0 0-2 2v2h1.5V2a.5.5 0 0 1 .5-.5h2V0H2Zm2 10.5H2a.5.5 0 0 1-.5-.5V8H0v2a2 2 0 0 0 2 2h2v-1.5ZM8 12v-1.5h2a.5.5 0 0 0 .5-.5V8H12v2a2 2 0 0 1-2 2H8Zm2-12a2 2 0 0 1 2 2v2h-1.5V2a.5.5 0 0 0-.5-.5H8V0h2Z\"><\/path>\n\t\t\t<\/svg>\n\t\t<\/button><\/figure>\n<\/div><ol start=\"4\" class=\"wp-block-list\">\n<li>Kies de header die je wilt aanpassen en klik op de knop <strong>Bewerken<\/strong> om de volledige bewerkmodus van de header in de Site Editor te openen.<\/li>\n<\/ol><div class=\"wp-block-image\">\n<figure data-wp-context='{\"imageId\":\"6a91e514bf669\"}' data-wp-interactive=\"core\/image\" data-wp-key=\"6a91e514bf669\" class=\"aligncenter wp-lightbox-container\"><img decoding=\"async\" data-wp-class--hide=\"state.isContentHidden\" data-wp-class--show=\"state.isContentVisible\" data-wp-init=\"callbacks.setButtonStyles\" data-wp-on--click=\"actions.showLightbox\" data-wp-on--load=\"callbacks.setButtonStyles\" data-wp-on--pointerdown=\"actions.preloadImage\" data-wp-on--pointerenter=\"actions.preloadImageWithDelay\" data-wp-on--pointerleave=\"actions.cancelPreload\" data-wp-on-window--resize=\"callbacks.setButtonStyles\" src=\"https:\/\/lh7-qw.googleusercontent.com\/docsz\/AD_4nXdClgyhOl94BmNiMMKT3OTLludeQcj5SeelJ2bwvXWE1ZWh5Yciw6zF6UgAR2Wo3XPBuXlq-cJCcDO0vl_zMMOOiUeZv4qxL7hNTdMzklzxMPx52SGokFyLf1VstYqG-VWOgvb8?key=d-WOuKA4wfkiWPSpXkicNw\" alt=\"Klik op de knop Bewerken om de volledige bewerkmodus van de header in de Site Editor te openen.\"><button class=\"lightbox-trigger\" type=\"button\" aria-haspopup=\"dialog\" data-wp-bind--aria-label=\"state.thisImage.triggerButtonAriaLabel\" data-wp-init=\"callbacks.initTriggerButton\" data-wp-on--click=\"actions.showLightbox\" data-wp-style--right=\"state.thisImage.buttonRight\" data-wp-style--top=\"state.thisImage.buttonTop\">\n\t\t\t<svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"12\" height=\"12\" fill=\"none\" viewbox=\"0 0 12 12\">\n\t\t\t\t<path fill=\"#fff\" d=\"M2 0a2 2 0 0 0-2 2v2h1.5V2a.5.5 0 0 1 .5-.5h2V0H2Zm2 10.5H2a.5.5 0 0 1-.5-.5V8H0v2a2 2 0 0 0 2 2h2v-1.5ZM8 12v-1.5h2a.5.5 0 0 0 .5-.5V8H12v2a2 2 0 0 1-2 2H8Zm2-12a2 2 0 0 1 2 2v2h-1.5V2a.5.5 0 0 0-.5-.5H8V0h2Z\"><\/path>\n\t\t\t<\/svg>\n\t\t<\/button><\/figure>\n<\/div><ol start=\"5\" class=\"wp-block-list\">\n<li>In de header editor pas je bestaande blokken aan, vervang je ze of voeg je nieuwe blokken toe aan het header template gedeelte.<\/li>\n<\/ol><div class=\"wp-block-image\">\n<figure data-wp-context='{\"imageId\":\"6a91e514bfa23\"}' data-wp-interactive=\"core\/image\" data-wp-key=\"6a91e514bfa23\" class=\"aligncenter wp-lightbox-container\"><img decoding=\"async\" data-wp-class--hide=\"state.isContentHidden\" data-wp-class--show=\"state.isContentVisible\" data-wp-init=\"callbacks.setButtonStyles\" data-wp-on--click=\"actions.showLightbox\" data-wp-on--load=\"callbacks.setButtonStyles\" data-wp-on--pointerdown=\"actions.preloadImage\" data-wp-on--pointerenter=\"actions.preloadImageWithDelay\" data-wp-on--pointerleave=\"actions.cancelPreload\" data-wp-on-window--resize=\"callbacks.setButtonStyles\" src=\"https:\/\/lh7-qw.googleusercontent.com\/docsz\/AD_4nXfxKP55po2npKuU-vh6Jt3jYHyQjoy5X5EMryK9_4RUUHEhw6jD6ttun0NkpEbbzttW8UUz-oBB2A0NRle5FuyK3cnhPtoeBELKop_fiqNJ_E5mjTxnCVXNT6QDkBZlpq-1miQf2Q?key=d-WOuKA4wfkiWPSpXkicNw\" alt=\"In de header editor pas je bestaande blokken aan, vervang je ze of voeg je nieuwe blokken toe.\"><button class=\"lightbox-trigger\" type=\"button\" aria-haspopup=\"dialog\" data-wp-bind--aria-label=\"state.thisImage.triggerButtonAriaLabel\" data-wp-init=\"callbacks.initTriggerButton\" data-wp-on--click=\"actions.showLightbox\" data-wp-style--right=\"state.thisImage.buttonRight\" data-wp-style--top=\"state.thisImage.buttonTop\">\n\t\t\t<svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"12\" height=\"12\" fill=\"none\" viewbox=\"0 0 12 12\">\n\t\t\t\t<path fill=\"#fff\" d=\"M2 0a2 2 0 0 0-2 2v2h1.5V2a.5.5 0 0 1 .5-.5h2V0H2Zm2 10.5H2a.5.5 0 0 1-.5-.5V8H0v2a2 2 0 0 0 2 2h2v-1.5ZM8 12v-1.5h2a.5.5 0 0 0 .5-.5V8H12v2a2 2 0 0 1-2 2H8Zm2-12a2 2 0 0 1 2 2v2h-1.5V2a.5.5 0 0 0-.5-.5H8V0h2Z\"><\/path>\n\t\t\t<\/svg>\n\t\t<\/button><\/figure>\n<\/div><p class=\"wp-block-paragraph\">Elk thema dat met Gutenberg werkt, gebruikt verschillende standaardonderdelen in de header template onderdelen. Klik op de knop <strong>Lijstweergave<\/strong> om een overzicht te krijgen van alle blokken in de header die je aan het bewerken bent.<\/p><div class=\"wp-block-image\">\n<figure data-wp-context='{\"imageId\":\"6a91e514bfe6f\"}' data-wp-interactive=\"core\/image\" data-wp-key=\"6a91e514bfe6f\" class=\"aligncenter wp-lightbox-container\"><img decoding=\"async\" data-wp-class--hide=\"state.isContentHidden\" data-wp-class--show=\"state.isContentVisible\" data-wp-init=\"callbacks.setButtonStyles\" data-wp-on--click=\"actions.showLightbox\" data-wp-on--load=\"callbacks.setButtonStyles\" data-wp-on--pointerdown=\"actions.preloadImage\" data-wp-on--pointerenter=\"actions.preloadImageWithDelay\" data-wp-on--pointerleave=\"actions.cancelPreload\" data-wp-on-window--resize=\"callbacks.setButtonStyles\" src=\"https:\/\/lh7-qw.googleusercontent.com\/docsz\/AD_4nXdo23ho6UeDhuVgo9jucReu0GKKw7xmIqDyWmsrySW8mDS13V1ACWnLaOB8hNdJTluhGuPUG1edPozLacKOTig_BQCYOx5BzPKyVEjHoGaKiqoU59qba4PBuf2QCZtQj36q_aOh?key=d-WOuKA4wfkiWPSpXkicNw\" alt=\"Klik op de knop Lijstweergave om een overzicht te krijgen van alle blokken.\"><button class=\"lightbox-trigger\" type=\"button\" aria-haspopup=\"dialog\" data-wp-bind--aria-label=\"state.thisImage.triggerButtonAriaLabel\" data-wp-init=\"callbacks.initTriggerButton\" data-wp-on--click=\"actions.showLightbox\" data-wp-style--right=\"state.thisImage.buttonRight\" data-wp-style--top=\"state.thisImage.buttonTop\">\n\t\t\t<svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"12\" height=\"12\" fill=\"none\" viewbox=\"0 0 12 12\">\n\t\t\t\t<path fill=\"#fff\" d=\"M2 0a2 2 0 0 0-2 2v2h1.5V2a.5.5 0 0 1 .5-.5h2V0H2Zm2 10.5H2a.5.5 0 0 1-.5-.5V8H0v2a2 2 0 0 0 2 2h2v-1.5ZM8 12v-1.5h2a.5.5 0 0 0 .5-.5V8H12v2a2 2 0 0 1-2 2H8Zm2-12a2 2 0 0 1 2 2v2h-1.5V2a.5.5 0 0 0-.5-.5H8V0h2Z\"><\/path>\n\t\t\t<\/svg>\n\t\t<\/button><\/figure>\n<\/div><p class=\"wp-block-paragraph\">In dit voorbeeld werken we met het Twenty Twenty-Four blok thema, waarin de standaard header uit een groep blokken bestaat. Als jouw gekozen template onderdeel dat ook gebruikt, zie je door op het pijltje te klikken alle samengevoegde blokken.<\/p><div class=\"wp-block-image\">\n<figure data-wp-context='{\"imageId\":\"6a91e514c01fb\"}' data-wp-interactive=\"core\/image\" data-wp-key=\"6a91e514c01fb\" class=\"aligncenter wp-lightbox-container\"><img decoding=\"async\" data-wp-class--hide=\"state.isContentHidden\" data-wp-class--show=\"state.isContentVisible\" data-wp-init=\"callbacks.setButtonStyles\" data-wp-on--click=\"actions.showLightbox\" data-wp-on--load=\"callbacks.setButtonStyles\" data-wp-on--pointerdown=\"actions.preloadImage\" data-wp-on--pointerenter=\"actions.preloadImageWithDelay\" data-wp-on--pointerleave=\"actions.cancelPreload\" data-wp-on-window--resize=\"callbacks.setButtonStyles\" src=\"https:\/\/lh7-qw.googleusercontent.com\/docsz\/AD_4nXe9dsJJR3ysQL16zaAmDBdKE7LrNIQX9obj-O0F91GtIeej_hEtyHf61zemNoVfpOpQQ5UQVN5fvbBbroUwfoFOB0hbK18vKGJzxb5-zD_RGS-nJtbhYWV71Ca46cvQJ173_wRs?key=d-WOuKA4wfkiWPSpXkicNw\" alt=\"Klik op het pijltje en zie alle samengevoegde blokken.\"><button class=\"lightbox-trigger\" type=\"button\" aria-haspopup=\"dialog\" data-wp-bind--aria-label=\"state.thisImage.triggerButtonAriaLabel\" data-wp-init=\"callbacks.initTriggerButton\" data-wp-on--click=\"actions.showLightbox\" data-wp-style--right=\"state.thisImage.buttonRight\" data-wp-style--top=\"state.thisImage.buttonTop\">\n\t\t\t<svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"12\" height=\"12\" fill=\"none\" viewbox=\"0 0 12 12\">\n\t\t\t\t<path fill=\"#fff\" d=\"M2 0a2 2 0 0 0-2 2v2h1.5V2a.5.5 0 0 1 .5-.5h2V0H2Zm2 10.5H2a.5.5 0 0 1-.5-.5V8H0v2a2 2 0 0 0 2 2h2v-1.5ZM8 12v-1.5h2a.5.5 0 0 0 .5-.5V8H12v2a2 2 0 0 1-2 2H8Zm2-12a2 2 0 0 1 2 2v2h-1.5V2a.5.5 0 0 0-.5-.5H8V0h2Z\"><\/path>\n\t\t\t<\/svg>\n\t\t<\/button><\/figure>\n<\/div><p class=\"wp-block-paragraph\">Als je de hele header wilt verwijderen, kies je in de lijst voor <strong>Groep<\/strong> en klik je op de <strong>Opties voor Groep<\/strong> knop. Kies daarna voor <strong>Verwijderen<\/strong>.<\/p><div class=\"wp-block-image\">\n<figure data-wp-context='{\"imageId\":\"6a91e514c058b\"}' data-wp-interactive=\"core\/image\" data-wp-key=\"6a91e514c058b\" class=\"aligncenter wp-lightbox-container\"><img decoding=\"async\" data-wp-class--hide=\"state.isContentHidden\" data-wp-class--show=\"state.isContentVisible\" data-wp-init=\"callbacks.setButtonStyles\" data-wp-on--click=\"actions.showLightbox\" data-wp-on--load=\"callbacks.setButtonStyles\" data-wp-on--pointerdown=\"actions.preloadImage\" data-wp-on--pointerenter=\"actions.preloadImageWithDelay\" data-wp-on--pointerleave=\"actions.cancelPreload\" data-wp-on-window--resize=\"callbacks.setButtonStyles\" src=\"https:\/\/lh7-qw.googleusercontent.com\/docsz\/AD_4nXdg5E-GXnWGlIT1Grag_26-lHfIDxnam8vK41l5GZRnMY4Ee4ClzCOFTiyJ5tRCNkTMpXWuKstYiNoHR314gn9RG0LkR5KPvq9SzZ5LNFXE6oF3bQFqiW8KWSULNq0dVQJaitmO3g?key=d-WOuKA4wfkiWPSpXkicNw\" alt=\"Kies in de lijst voor Groep en klik op de Opties voor Groep knop. Kies daarna voor Verwijderen.\"><button class=\"lightbox-trigger\" type=\"button\" aria-haspopup=\"dialog\" data-wp-bind--aria-label=\"state.thisImage.triggerButtonAriaLabel\" data-wp-init=\"callbacks.initTriggerButton\" data-wp-on--click=\"actions.showLightbox\" data-wp-style--right=\"state.thisImage.buttonRight\" data-wp-style--top=\"state.thisImage.buttonTop\">\n\t\t\t<svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"12\" height=\"12\" fill=\"none\" viewbox=\"0 0 12 12\">\n\t\t\t\t<path fill=\"#fff\" d=\"M2 0a2 2 0 0 0-2 2v2h1.5V2a.5.5 0 0 1 .5-.5h2V0H2Zm2 10.5H2a.5.5 0 0 1-.5-.5V8H0v2a2 2 0 0 0 2 2h2v-1.5ZM8 12v-1.5h2a.5.5 0 0 0 .5-.5V8H12v2a2 2 0 0 1-2 2H8Zm2-12a2 2 0 0 1 2 2v2h-1.5V2a.5.5 0 0 0-.5-.5H8V0h2Z\"><\/path>\n\t\t\t<\/svg>\n\t\t<\/button><\/figure>\n<\/div><p class=\"wp-block-paragraph\">Gebruik de <strong>Blok inserter<\/strong> om nieuwe elementen toe te voegen, zoals een slogan of een zoekbalk aan de header. Je vindt de plusknop door met je muis over het header onderdeel te bewegen of via de bovenste toolbar van de Site Editor.<\/p><div class=\"wp-block-image\">\n<figure data-wp-context='{\"imageId\":\"6a91e514c08f8\"}' data-wp-interactive=\"core\/image\" data-wp-key=\"6a91e514c08f8\" class=\"aligncenter wp-lightbox-container\"><img decoding=\"async\" data-wp-class--hide=\"state.isContentHidden\" data-wp-class--show=\"state.isContentVisible\" data-wp-init=\"callbacks.setButtonStyles\" data-wp-on--click=\"actions.showLightbox\" data-wp-on--load=\"callbacks.setButtonStyles\" data-wp-on--pointerdown=\"actions.preloadImage\" data-wp-on--pointerenter=\"actions.preloadImageWithDelay\" data-wp-on--pointerleave=\"actions.cancelPreload\" data-wp-on-window--resize=\"callbacks.setButtonStyles\" src=\"https:\/\/lh7-qw.googleusercontent.com\/docsz\/AD_4nXcT3KOn8eRMGseX9MYvdaTb5Dp7pn2tRCiXu1gSzGVxfrG7HnmZRWyDTzq9DO-Amrd_AZhPNKNcbMvaB-SykZY04WUNB3tnlkRcpcElxTpuTxUS16PhKdqu6WGd8IbudrStweac?key=d-WOuKA4wfkiWPSpXkicNw\" alt=\"Gebruik de Blok inserter om nieuwe elementen toe te voegen.\"><button class=\"lightbox-trigger\" type=\"button\" aria-haspopup=\"dialog\" data-wp-bind--aria-label=\"state.thisImage.triggerButtonAriaLabel\" data-wp-init=\"callbacks.initTriggerButton\" data-wp-on--click=\"actions.showLightbox\" data-wp-style--right=\"state.thisImage.buttonRight\" data-wp-style--top=\"state.thisImage.buttonTop\">\n\t\t\t<svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"12\" height=\"12\" fill=\"none\" viewbox=\"0 0 12 12\">\n\t\t\t\t<path fill=\"#fff\" d=\"M2 0a2 2 0 0 0-2 2v2h1.5V2a.5.5 0 0 1 .5-.5h2V0H2Zm2 10.5H2a.5.5 0 0 1-.5-.5V8H0v2a2 2 0 0 0 2 2h2v-1.5ZM8 12v-1.5h2a.5.5 0 0 0 .5-.5V8H12v2a2 2 0 0 1-2 2H8Zm2-12a2 2 0 0 1 2 2v2h-1.5V2a.5.5 0 0 0-.5-.5H8V0h2Z\"><\/path>\n\t\t\t<\/svg>\n\t\t<\/button><\/figure>\n<\/div><p class=\"wp-block-paragraph\">Zoek daarna naar beschikbare blokken om aan je header toe te voegen. Sleep de nieuwe elementen naar de plek waar jij ze wilt hebben. Dit kan ook via de <strong>Lijstweergave<\/strong>, terwijl je direct rechts op het scherm de aanpassingen bekijkt.<\/p><p class=\"wp-block-paragraph\">Omdat het<strong> Twenty Twenty-Four<\/strong> blok thema al de belangrijkste header elementen bevat, laten we die staan zoals ze zijn. In de volgende stappen personaliseren we de websitetitel, het logo en het navigatiemenu in de volledige site editor.<\/p><p class=\"wp-block-paragraph\"><strong>Websitetitel aanpassen<\/strong><\/p><p class=\"wp-block-paragraph\">Pas de standaard websitetitel aan in de volledige site editor door het <strong>Site Titel<\/strong> blok te selecteren.<\/p><div class=\"wp-block-image\">\n<figure data-wp-context='{\"imageId\":\"6a91e514c0c75\"}' data-wp-interactive=\"core\/image\" data-wp-key=\"6a91e514c0c75\" class=\"aligncenter wp-lightbox-container\"><img decoding=\"async\" data-wp-class--hide=\"state.isContentHidden\" data-wp-class--show=\"state.isContentVisible\" data-wp-init=\"callbacks.setButtonStyles\" data-wp-on--click=\"actions.showLightbox\" data-wp-on--load=\"callbacks.setButtonStyles\" data-wp-on--pointerdown=\"actions.preloadImage\" data-wp-on--pointerenter=\"actions.preloadImageWithDelay\" data-wp-on--pointerleave=\"actions.cancelPreload\" data-wp-on-window--resize=\"callbacks.setButtonStyles\" src=\"https:\/\/lh7-qw.googleusercontent.com\/docsz\/AD_4nXfG22V5t-pxkMEcEYB3qOwJFySxPS7NNyK8R6qhG-sW4rfHoTEEoBRx3RwQZXuPLlKHKz3k6f1ViTK7VwEh9XzB0fTtfG3CDAQ4QC-R4R8gzbOT2Qit1LVlkXj7rf47jtzBYWlb?key=d-WOuKA4wfkiWPSpXkicNw\" alt=\"Selecteer het Site Title blok.\"><button class=\"lightbox-trigger\" type=\"button\" aria-haspopup=\"dialog\" data-wp-bind--aria-label=\"state.thisImage.triggerButtonAriaLabel\" data-wp-init=\"callbacks.initTriggerButton\" data-wp-on--click=\"actions.showLightbox\" data-wp-style--right=\"state.thisImage.buttonRight\" data-wp-style--top=\"state.thisImage.buttonTop\">\n\t\t\t<svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"12\" height=\"12\" fill=\"none\" viewbox=\"0 0 12 12\">\n\t\t\t\t<path fill=\"#fff\" d=\"M2 0a2 2 0 0 0-2 2v2h1.5V2a.5.5 0 0 1 .5-.5h2V0H2Zm2 10.5H2a.5.5 0 0 1-.5-.5V8H0v2a2 2 0 0 0 2 2h2v-1.5ZM8 12v-1.5h2a.5.5 0 0 0 .5-.5V8H12v2a2 2 0 0 1-2 2H8Zm2-12a2 2 0 0 1 2 2v2h-1.5V2a.5.5 0 0 0-.5-.5H8V0h2Z\"><\/path>\n\t\t\t<\/svg>\n\t\t<\/button><\/figure>\n<\/div><p class=\"wp-block-paragraph\">Je kunt de websitetitel ook wijzigen via <strong>Instellingen<\/strong> in je WordPress dashboard. Dit past automatisch ook het header blok aan.<\/p><div class=\"wp-block-image\">\n<figure data-wp-context='{\"imageId\":\"6a91e514c0f18\"}' data-wp-interactive=\"core\/image\" data-wp-key=\"6a91e514c0f18\" class=\"aligncenter wp-lightbox-container\"><img decoding=\"async\" data-wp-class--hide=\"state.isContentHidden\" data-wp-class--show=\"state.isContentVisible\" data-wp-init=\"callbacks.setButtonStyles\" data-wp-on--click=\"actions.showLightbox\" data-wp-on--load=\"callbacks.setButtonStyles\" data-wp-on--pointerdown=\"actions.preloadImage\" data-wp-on--pointerenter=\"actions.preloadImageWithDelay\" data-wp-on--pointerleave=\"actions.cancelPreload\" data-wp-on-window--resize=\"callbacks.setButtonStyles\" src=\"https:\/\/lh7-qw.googleusercontent.com\/docsz\/AD_4nXeLVTjFaXGu4fo_RSDBEWfAaLV-xHrfQhJn1ubWvsUK5ligFV7wZkLhoDAOMNDoaUxe7YDH3uXdm_jP8NHplr4yRNZXQNj3b8JH705sn0gu1Sw-gARUBYAHSUTRNTJfKlm_Yv-qIQ?key=d-WOuKA4wfkiWPSpXkicNw\" alt=\"Je kunt de sitetitel ook wijzigen via Instellingen in je WordPress dashboard.\"><button class=\"lightbox-trigger\" type=\"button\" aria-haspopup=\"dialog\" data-wp-bind--aria-label=\"state.thisImage.triggerButtonAriaLabel\" data-wp-init=\"callbacks.initTriggerButton\" data-wp-on--click=\"actions.showLightbox\" data-wp-style--right=\"state.thisImage.buttonRight\" data-wp-style--top=\"state.thisImage.buttonTop\">\n\t\t\t<svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"12\" height=\"12\" fill=\"none\" viewbox=\"0 0 12 12\">\n\t\t\t\t<path fill=\"#fff\" d=\"M2 0a2 2 0 0 0-2 2v2h1.5V2a.5.5 0 0 1 .5-.5h2V0H2Zm2 10.5H2a.5.5 0 0 1-.5-.5V8H0v2a2 2 0 0 0 2 2h2v-1.5ZM8 12v-1.5h2a.5.5 0 0 0 .5-.5V8H12v2a2 2 0 0 1-2 2H8Zm2-12a2 2 0 0 1 2 2v2h-1.5V2a.5.5 0 0 0-.5-.5H8V0h2Z\"><\/path>\n\t\t\t<\/svg>\n\t\t<\/button><\/figure>\n<\/div><p class=\"wp-block-paragraph\"><strong>Website logo toevoegen<\/strong><\/p><p class=\"wp-block-paragraph\">Er zijn verschillende manieren om je logo in WordPress te wijzigen, bijvoorbeeld via de Site Editor. Omdat dit huidige thema standaard een logo toont, vervang je eenvoudig het tijdelijke plaatje door het <strong>Site Logo<\/strong> blok in de header te selecteren.<\/p><p class=\"wp-block-paragraph\">Klik vervolgens op de knop <strong>Voeg een site logo toe<\/strong> in het midden van het blok.<\/p><div class=\"wp-block-image\">\n<figure data-wp-context='{\"imageId\":\"6a91e514c1261\"}' data-wp-interactive=\"core\/image\" data-wp-key=\"6a91e514c1261\" class=\"aligncenter wp-lightbox-container\"><img decoding=\"async\" data-wp-class--hide=\"state.isContentHidden\" data-wp-class--show=\"state.isContentVisible\" data-wp-init=\"callbacks.setButtonStyles\" data-wp-on--click=\"actions.showLightbox\" data-wp-on--load=\"callbacks.setButtonStyles\" data-wp-on--pointerdown=\"actions.preloadImage\" data-wp-on--pointerenter=\"actions.preloadImageWithDelay\" data-wp-on--pointerleave=\"actions.cancelPreload\" data-wp-on-window--resize=\"callbacks.setButtonStyles\" src=\"https:\/\/lh7-qw.googleusercontent.com\/docsz\/AD_4nXccvD2f9_Qs9nMgH7VGFtt8HmK_3We-LVzALVz_6Yaik_n688vY9u7hns081bzct7WUm5gjweipVhGZLR0UsjWoXsGOQcab49f49huXfgcpDEEqpFysKZIv4j2ZF6Q_P57YRKTXOg?key=d-WOuKA4wfkiWPSpXkicNw\" alt=\"Klik op de knop Voeg een site logo toe in het midden van het blok.\"><button class=\"lightbox-trigger\" type=\"button\" aria-haspopup=\"dialog\" data-wp-bind--aria-label=\"state.thisImage.triggerButtonAriaLabel\" data-wp-init=\"callbacks.initTriggerButton\" data-wp-on--click=\"actions.showLightbox\" data-wp-style--right=\"state.thisImage.buttonRight\" data-wp-style--top=\"state.thisImage.buttonTop\">\n\t\t\t<svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"12\" height=\"12\" fill=\"none\" viewbox=\"0 0 12 12\">\n\t\t\t\t<path fill=\"#fff\" d=\"M2 0a2 2 0 0 0-2 2v2h1.5V2a.5.5 0 0 1 .5-.5h2V0H2Zm2 10.5H2a.5.5 0 0 1-.5-.5V8H0v2a2 2 0 0 0 2 2h2v-1.5ZM8 12v-1.5h2a.5.5 0 0 0 .5-.5V8H12v2a2 2 0 0 1-2 2H8Zm2-12a2 2 0 0 1 2 2v2h-1.5V2a.5.5 0 0 0-.5-.5H8V0h2Z\"><\/path>\n\t\t\t<\/svg>\n\t\t<\/button><\/figure>\n<\/div><p class=\"wp-block-paragraph\">Er verschijnt nu een pop-upvenster van de mediabibliotheek. Upload het nieuwe afbeeldingsbestand en vergeet niet de alt-tekst toe te voegen voordat je op <strong>Selecteren<\/strong> klikt.<\/p><p class=\"wp-block-paragraph\">Je ziet het logo van de site nu in je aangepaste header. Pas de grootte aan door de selectie puntjes naar binnen of buiten te slepen tot het goed is. Wil je het logo verplaatsen, gebruik dan de pijltjestoetsen in de toolbar van de blokeditor.<\/p><p class=\"wp-block-paragraph\"><strong>Navigatiemenu toevoegen<\/strong><\/p><p class=\"wp-block-paragraph\">Je gekozen WordPress thema toont waarschijnlijk een navigatiemenu in de header. Bijvoorbeeld, het <strong>Twenty Twenty-Four <\/strong>blok thema gebruikt het <a href=\"https:\/\/wordpress.org\/documentation\/article\/navigation-block\/\" target=\"_blank\" rel=\"noopener\">Navigatieblok<\/a>, waarmee je de structuur en het ontwerp van het menu direct kunt aanpassen.<\/p><p class=\"wp-block-paragraph\">Selecteer het <strong>Navigatieblok<\/strong> in de header om het menu te bewerken en klik op de knop <strong>Blok toevoegen<\/strong>.<\/p><div class=\"wp-block-image\">\n<figure data-wp-context='{\"imageId\":\"6a91e514c15e3\"}' data-wp-interactive=\"core\/image\" data-wp-key=\"6a91e514c15e3\" class=\"aligncenter wp-lightbox-container\"><img decoding=\"async\" data-wp-class--hide=\"state.isContentHidden\" data-wp-class--show=\"state.isContentVisible\" data-wp-init=\"callbacks.setButtonStyles\" data-wp-on--click=\"actions.showLightbox\" data-wp-on--load=\"callbacks.setButtonStyles\" data-wp-on--pointerdown=\"actions.preloadImage\" data-wp-on--pointerenter=\"actions.preloadImageWithDelay\" data-wp-on--pointerleave=\"actions.cancelPreload\" data-wp-on-window--resize=\"callbacks.setButtonStyles\" src=\"https:\/\/lh7-qw.googleusercontent.com\/docsz\/AD_4nXfSw7W8dPjhqlPzV-eqmUDS_ZhkCgx61qV-hYBbOYbMRa9xo4i9bx_SDCwV_0ZiQPRqfyMWLzf2Z9pxmaaqpfC24nYsru5208jy4EsaI69BE9aI3z48Ma1iPXBES8UykOqMoK4bmg?key=d-WOuKA4wfkiWPSpXkicNw\" alt=\"Selecteer het Navigatieblok in de header om het menu te bewerken en klik op de knop Blok toevoegen.\"><button class=\"lightbox-trigger\" type=\"button\" aria-haspopup=\"dialog\" data-wp-bind--aria-label=\"state.thisImage.triggerButtonAriaLabel\" data-wp-init=\"callbacks.initTriggerButton\" data-wp-on--click=\"actions.showLightbox\" data-wp-style--right=\"state.thisImage.buttonRight\" data-wp-style--top=\"state.thisImage.buttonTop\">\n\t\t\t<svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"12\" height=\"12\" fill=\"none\" viewbox=\"0 0 12 12\">\n\t\t\t\t<path fill=\"#fff\" d=\"M2 0a2 2 0 0 0-2 2v2h1.5V2a.5.5 0 0 1 .5-.5h2V0H2Zm2 10.5H2a.5.5 0 0 1-.5-.5V8H0v2a2 2 0 0 0 2 2h2v-1.5ZM8 12v-1.5h2a.5.5 0 0 0 .5-.5V8H12v2a2 2 0 0 1-2 2H8Zm2-12a2 2 0 0 1 2 2v2h-1.5V2a.5.5 0 0 0-.5-.5H8V0h2Z\"><\/path>\n\t\t\t<\/svg>\n\t\t<\/button><\/figure>\n<\/div><p class=\"wp-block-paragraph\">Door dit te doen, wordt er automatisch een link placeholder gemaakt die je kunt koppelen aan iedere pagina op je website.<\/p><div class=\"wp-block-image\">\n<figure data-wp-context='{\"imageId\":\"6a91e514c185d\"}' data-wp-interactive=\"core\/image\" data-wp-key=\"6a91e514c185d\" class=\"aligncenter wp-lightbox-container\"><img decoding=\"async\" data-wp-class--hide=\"state.isContentHidden\" data-wp-class--show=\"state.isContentVisible\" data-wp-init=\"callbacks.setButtonStyles\" data-wp-on--click=\"actions.showLightbox\" data-wp-on--load=\"callbacks.setButtonStyles\" data-wp-on--pointerdown=\"actions.preloadImage\" data-wp-on--pointerenter=\"actions.preloadImageWithDelay\" data-wp-on--pointerleave=\"actions.cancelPreload\" data-wp-on-window--resize=\"callbacks.setButtonStyles\" src=\"https:\/\/lh7-qw.googleusercontent.com\/docsz\/AD_4nXc2ascAaBiLQ0jJZhvWG2Vkb8hHX3E9SnSLh3-niMhLL7CizVLMkU9pH6FEhFSrkE3CANgZP1fr7U1Z76GSaTbf5h9yhpzXISiV2NQ-MzJ4-FyfapSBzEwr41r0nfUrUcvO5mTT3Q?key=d-WOuKA4wfkiWPSpXkicNw\" alt=\"Er wordt automatisch een link placeholder gemaakt die je kunt koppelen aan elke pagina op je website.\"><button class=\"lightbox-trigger\" type=\"button\" aria-haspopup=\"dialog\" data-wp-bind--aria-label=\"state.thisImage.triggerButtonAriaLabel\" data-wp-init=\"callbacks.initTriggerButton\" data-wp-on--click=\"actions.showLightbox\" data-wp-style--right=\"state.thisImage.buttonRight\" data-wp-style--top=\"state.thisImage.buttonTop\">\n\t\t\t<svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"12\" height=\"12\" fill=\"none\" viewbox=\"0 0 12 12\">\n\t\t\t\t<path fill=\"#fff\" d=\"M2 0a2 2 0 0 0-2 2v2h1.5V2a.5.5 0 0 1 .5-.5h2V0H2Zm2 10.5H2a.5.5 0 0 1-.5-.5V8H0v2a2 2 0 0 0 2 2h2v-1.5ZM8 12v-1.5h2a.5.5 0 0 0 .5-.5V8H12v2a2 2 0 0 1-2 2H8Zm2-12a2 2 0 0 1 2 2v2h-1.5V2a.5.5 0 0 0-.5-.5H8V0h2Z\"><\/path>\n\t\t\t<\/svg>\n\t\t<\/button><\/figure>\n<\/div><p class=\"wp-block-paragraph\">Voor makkelijker bewerken van het navigatiemenu, kies je het blok en klik je op <strong>Instellingen<\/strong> om het configuratievenster te openen.<\/p><div class=\"wp-block-image\">\n<figure data-wp-context='{\"imageId\":\"6a91e514c1b7e\"}' data-wp-interactive=\"core\/image\" data-wp-key=\"6a91e514c1b7e\" class=\"aligncenter wp-lightbox-container\"><img decoding=\"async\" data-wp-class--hide=\"state.isContentHidden\" data-wp-class--show=\"state.isContentVisible\" data-wp-init=\"callbacks.setButtonStyles\" data-wp-on--click=\"actions.showLightbox\" data-wp-on--load=\"callbacks.setButtonStyles\" data-wp-on--pointerdown=\"actions.preloadImage\" data-wp-on--pointerenter=\"actions.preloadImageWithDelay\" data-wp-on--pointerleave=\"actions.cancelPreload\" data-wp-on-window--resize=\"callbacks.setButtonStyles\" src=\"https:\/\/lh7-qw.googleusercontent.com\/docsz\/AD_4nXelVnItjVoDU17HwZjIuvU572NYQ-8ut3aJr8SFtVKMOC9vW6YwVrpvC8rMnAyMyZqsRyTmeysXBYv8bB1X9tOPE2wlS3W3s8jHY9sAGjDgJL1jYG3aX13-HAkbcN6V8MqInogI?key=d-WOuKA4wfkiWPSpXkicNw\" alt=\"Ga naar de opties voor Custom Link en kies Add submenu link.\"><button class=\"lightbox-trigger\" type=\"button\" aria-haspopup=\"dialog\" data-wp-bind--aria-label=\"state.thisImage.triggerButtonAriaLabel\" data-wp-init=\"callbacks.initTriggerButton\" data-wp-on--click=\"actions.showLightbox\" data-wp-style--right=\"state.thisImage.buttonRight\" data-wp-style--top=\"state.thisImage.buttonTop\">\n\t\t\t<svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"12\" height=\"12\" fill=\"none\" viewbox=\"0 0 12 12\">\n\t\t\t\t<path fill=\"#fff\" d=\"M2 0a2 2 0 0 0-2 2v2h1.5V2a.5.5 0 0 1 .5-.5h2V0H2Zm2 10.5H2a.5.5 0 0 1-.5-.5V8H0v2a2 2 0 0 0 2 2h2v-1.5ZM8 12v-1.5h2a.5.5 0 0 0 .5-.5V8H12v2a2 2 0 0 1-2 2H8Zm2-12a2 2 0 0 1 2 2v2h-1.5V2a.5.5 0 0 0-.5-.5H8V0h2Z\"><\/path>\n\t\t\t<\/svg>\n\t\t<\/button><\/figure>\n<\/div><p class=\"wp-block-paragraph\">Daar kun je de link instellingen aanpassen, zoals het label, de URL, attributen en het ontwerp. Heb je een custom CSS om het menu te stylen? Dan kun je die hier ook toevoegen.<\/p><p class=\"wp-block-paragraph\">Wil je een <a href=\"\/nl\/tutorials\/wordpress-dropwdown-menu\/\">dropdownmenu<\/a> maken? Ga dan naar de opties voor <strong>Custom Link<\/strong> en kies <strong>Add submenu link<\/strong>. Of voeg een submenu toe via de blok inserter.<\/p><figure class=\"wp-block-image\"><img decoding=\"async\" src=\"https:\/\/lh7-qw.googleusercontent.com\/docsz\/AD_4nXeN59Lk8njXtgyM9hN2uo5mGG9xU-rXJ9tk-LEWI1ENo-yqI1rcYsSAe5IYD9iyS5YKMWODeiH0nqj6urxB0kj46hN6asP5NhZsqMDuJsH7M73u3ZyuR3Uo3cSwBMSjAyr17hB2?key=d-WOuKA4wfkiWPSpXkicNw\" alt=\"The Options for Custom Link button and Add submenu link menu are highlighted in the block settings.\"><\/figure><p class=\"wp-block-paragraph\">Als je klaar bent met je aanpassingen, vergeet dan niet om op <strong>Opslaan<\/strong> te klikken voordat je de header editor afsluit.<\/p><h4 class=\"wp-block-heading\" id=\"h-\"><\/h4><p>\n\n\n        <div class=\"protip\">\n            <div class=\"protip__heading\">\n                <svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\">\n                    <path d=\"M1.49234 23.5024C1.23229 23.5024 0.972242 23.4024 0.782206 23.2123C0.562165 22.9923 0.452144 22.6822 0.502153 22.3722C0.562165 21.9221 1.14227 17.9113 3.00262 16.351C3.63274 15.8209 4.43289 15.5509 5.26305 15.5609C6.09321 15.5909 6.87335 15.9109 7.47347 16.4911C8.6937 17.6913 8.76371 19.6717 7.6435 20.9919C6.0832 22.8523 2.08245 23.4324 1.63237 23.4924C1.59236 23.4924 1.54235 23.4924 1.50234 23.4924L1.49234 23.5024ZM5.16303 17.5613C4.84297 17.5613 4.53291 17.6713 4.29287 17.8813C3.60274 18.4614 3.07264 19.9317 2.75258 21.242C4.06282 20.9219 5.5331 20.3918 6.11321 19.7017C6.55329 19.1716 6.54329 18.3814 6.0832 17.9213C5.85316 17.7013 5.5431 17.5713 5.20304 17.5613C5.19304 17.5613 5.17303 17.5613 5.16303 17.5613ZM11.7243 21.8821C11.4942 21.8821 11.2642 21.8021 11.0841 21.652C10.8541 21.462 10.7241 21.1819 10.7241 20.8819V15.9109L8.08358 13.2705H3.11264C2.81259 13.2705 2.53254 13.1404 2.3425 12.9104C2.15246 12.6803 2.07245 12.3803 2.12246 12.0902C2.19247 11.7102 2.84259 8.36953 4.70294 7.12929C6.33325 6.04909 8.96375 6.49918 10.244 6.80923C11.5442 4.96889 13.2546 3.4286 15.2349 2.33839C17.4553 1.11816 19.9858 0.518051 22.4963 0.498047C23.0464 0.498047 23.4865 0.948132 23.4865 1.49824C23.4865 5.0389 22.3763 9.97983 17.1753 13.7605C17.4853 15.0408 17.9354 17.6613 16.8552 19.2816C15.615 21.1419 12.2744 21.7921 11.8943 21.8621C11.8343 21.8721 11.7743 21.8821 11.7143 21.8821H11.7243ZM12.7245 16.181V19.6016C13.7146 19.2916 14.7948 18.7915 15.2049 18.1814C15.675 17.4812 15.605 16.091 15.385 14.9008C14.5248 15.3808 13.6346 15.8109 12.7245 16.181ZM9.66388 12.0302L11.9643 14.3307C13.1845 13.8306 14.3648 13.2204 15.485 12.5103C19.9358 9.51974 21.2361 5.60901 21.4561 2.53843C19.6157 2.67846 17.8254 3.20856 16.2051 4.09872C14.2847 5.14892 12.6544 6.68921 11.4942 8.54956C10.7841 9.65977 10.174 10.82 9.66388 12.0302ZM4.39289 11.2701H7.81353C8.1936 10.3599 8.63368 9.46974 9.11377 8.60957C7.92355 8.38953 6.51329 8.31952 5.81315 8.78961C5.19304 9.19968 4.70294 10.3099 4.39289 11.2701Z\" fill=\"#673DE6\"\/>\n                <\/svg>\n                <p class=\"protip__title\">\n                     Leestip                 <\/p>\n            <\/div>\n            <p class=\"protip__content\"> Als je liever op andere manier je navigatiemenu aanpast, bekijk dan ons artikel over hoe je een pagina toevoegt aan het navigatiemenu in WordPress. <\/p>\n                    <\/div>\n        \n\n\n\n<\/p><h3 class=\"wp-block-heading\" id=\"h-hoe-je-een-wordpress-header-aanpast-met-de-customizer\"><strong>Hoe je een WordPress header aanpast met de Customizer<\/strong><\/h3><p class=\"wp-block-paragraph\">Als je een oudere WordPress versie of een klassiek thema gebruikt, pas je de header aan met de <strong>Customizer<\/strong>. De stappen om bij de <strong>Customizer<\/strong> te komen kunnen verschillen, afhankelijk van het thema dat je gebruikt.<\/p><p class=\"wp-block-paragraph\">Zo heeft het standaard <strong>Twenty Twenty-One <\/strong>thema en oudere thema&rsquo;s alleen de optie<strong> Site Identity<\/strong>, waarmee je het logo en de titel op de header kunt aanpassen.<\/p><p class=\"wp-block-paragraph\">Populaire thema&rsquo;s van derden zoals <a href=\"https:\/\/wpastra.com\/?bsf=12425\" target=\"_blank\" rel=\"noopener\">Astra<\/a> en <strong>Neve<\/strong> bieden meestal extra header opties, zoals het toevoegen van sociale media-iconen, vooral als je de premium versie hebt.<\/p><p class=\"wp-block-paragraph\">In deze uitleg gebruiken we het <strong>Astra<\/strong> thema. De stappen om bij de WordPress Customizer te komen zijn hetzelfde: ga naar <strong>Weergave &rarr; Customizer<\/strong>.<\/p><p class=\"wp-block-paragraph\">De Customizer van Astra heeft een drag-and-drop bouwer met een gebruiksvriendelijke interface. Links kies je welke website-elementen je wilt aanpassen, terwijl je rechts direct ziet wat de wijzigingen doen.<\/p><p class=\"wp-block-paragraph\">Om je website header te bewerken, selecteer je <strong>Header Bouwer <\/strong>uit de lijst.<\/p><div class=\"wp-block-image\">\n<figure data-wp-context='{\"imageId\":\"6a91e514c303a\"}' data-wp-interactive=\"core\/image\" data-wp-key=\"6a91e514c303a\" class=\"aligncenter wp-lightbox-container\"><img decoding=\"async\" data-wp-class--hide=\"state.isContentHidden\" data-wp-class--show=\"state.isContentVisible\" data-wp-init=\"callbacks.setButtonStyles\" data-wp-on--click=\"actions.showLightbox\" data-wp-on--load=\"callbacks.setButtonStyles\" data-wp-on--pointerdown=\"actions.preloadImage\" data-wp-on--pointerenter=\"actions.preloadImageWithDelay\" data-wp-on--pointerleave=\"actions.cancelPreload\" data-wp-on-window--resize=\"callbacks.setButtonStyles\" src=\"https:\/\/lh7-qw.googleusercontent.com\/docsz\/AD_4nXemUoGyWRjy3S05CVGNsbkSvHr1041FDgZ4PjFTsTyGiaqVliaHFNiA_rBsQmkL3AZXM0NZcZqzm9_vNmtcciLnRnO4nklODsOaPpfZV1A6783FQL38f2MIatTZv2Ne35R-WXKOrw?key=d-WOuKA4wfkiWPSpXkicNw\" alt=\"Om je website header te bewerken, selecteer je Header Bouwer uit de lijst.\"><button class=\"lightbox-trigger\" type=\"button\" aria-haspopup=\"dialog\" data-wp-bind--aria-label=\"state.thisImage.triggerButtonAriaLabel\" data-wp-init=\"callbacks.initTriggerButton\" data-wp-on--click=\"actions.showLightbox\" data-wp-style--right=\"state.thisImage.buttonRight\" data-wp-style--top=\"state.thisImage.buttonTop\">\n\t\t\t<svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"12\" height=\"12\" fill=\"none\" viewbox=\"0 0 12 12\">\n\t\t\t\t<path fill=\"#fff\" d=\"M2 0a2 2 0 0 0-2 2v2h1.5V2a.5.5 0 0 1 .5-.5h2V0H2Zm2 10.5H2a.5.5 0 0 1-.5-.5V8H0v2a2 2 0 0 0 2 2h2v-1.5ZM8 12v-1.5h2a.5.5 0 0 0 .5-.5V8H12v2a2 2 0 0 1-2 2H8Zm2-12a2 2 0 0 1 2 2v2h-1.5V2a.5.5 0 0 0-.5-.5H8V0h2Z\"><\/path>\n\t\t\t<\/svg>\n\t\t<\/button><\/figure>\n<\/div><p class=\"wp-block-paragraph\">Je ziet de header patronen aan de linkerkant en de header bouwer rechtsonder in beeld.<\/p><p class=\"wp-block-paragraph\">Standaard zijn er drie header regels beschikbaar. Je voegt een nieuw header element toe door met je muis over een lege plek te gaan en op het plusje te klikken dat verschijnt.<\/p><div class=\"wp-block-image\">\n<figure data-wp-context='{\"imageId\":\"6a91e514c33d5\"}' data-wp-interactive=\"core\/image\" data-wp-key=\"6a91e514c33d5\" class=\"aligncenter wp-lightbox-container\"><img decoding=\"async\" data-wp-class--hide=\"state.isContentHidden\" data-wp-class--show=\"state.isContentVisible\" data-wp-init=\"callbacks.setButtonStyles\" data-wp-on--click=\"actions.showLightbox\" data-wp-on--load=\"callbacks.setButtonStyles\" data-wp-on--pointerdown=\"actions.preloadImage\" data-wp-on--pointerenter=\"actions.preloadImageWithDelay\" data-wp-on--pointerleave=\"actions.cancelPreload\" data-wp-on-window--resize=\"callbacks.setButtonStyles\" src=\"https:\/\/lh7-qw.googleusercontent.com\/docsz\/AD_4nXdaYBPOf5f1PXiVT1NAZVWpXp-eu2AG4gDEzHN8WmHkFRkqPGS8txF1CTf22tm0v3hiE8j2P9GNIAMS3e3nWWLmhe06YxkX7yJOfofIksKuTHHjhIFZxjsjE_8T-IDQpiD2UZZw9w?key=d-WOuKA4wfkiWPSpXkicNw\" alt=\"Je voegt een nieuw header element toe door met je muis over een lege plek te gaan en op het plusje te klikken dat verschijnt.\"><button class=\"lightbox-trigger\" type=\"button\" aria-haspopup=\"dialog\" data-wp-bind--aria-label=\"state.thisImage.triggerButtonAriaLabel\" data-wp-init=\"callbacks.initTriggerButton\" data-wp-on--click=\"actions.showLightbox\" data-wp-style--right=\"state.thisImage.buttonRight\" data-wp-style--top=\"state.thisImage.buttonTop\">\n\t\t\t<svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"12\" height=\"12\" fill=\"none\" viewbox=\"0 0 12 12\">\n\t\t\t\t<path fill=\"#fff\" d=\"M2 0a2 2 0 0 0-2 2v2h1.5V2a.5.5 0 0 1 .5-.5h2V0H2Zm2 10.5H2a.5.5 0 0 1-.5-.5V8H0v2a2 2 0 0 0 2 2h2v-1.5ZM8 12v-1.5h2a.5.5 0 0 0 .5-.5V8H12v2a2 2 0 0 1-2 2H8Zm2-12a2 2 0 0 1 2 2v2h-1.5V2a.5.5 0 0 0-.5-.5H8V0h2Z\"><\/path>\n\t\t\t<\/svg>\n\t\t<\/button><\/figure>\n<\/div><p class=\"wp-block-paragraph\">Je kunt de bestaande header elementen ook verslepen en neerzetten waar jij ze wilt hebben. Zodra alles op zijn plek staat, kun je ze verder personaliseren.<\/p><p class=\"wp-block-paragraph\"><strong>Titel en logo aanpassen<\/strong><\/p><p class=\"wp-block-paragraph\">Open de <strong>Algemene instellingen<\/strong> door in het header configuratiepanel te klikken op<strong> Site Titel &amp; Logo<\/strong>.<\/p><div class=\"wp-block-image\">\n<figure data-wp-context='{\"imageId\":\"6a91e514c37ae\"}' data-wp-interactive=\"core\/image\" data-wp-key=\"6a91e514c37ae\" class=\"aligncenter wp-lightbox-container\"><img decoding=\"async\" data-wp-class--hide=\"state.isContentHidden\" data-wp-class--show=\"state.isContentVisible\" data-wp-init=\"callbacks.setButtonStyles\" data-wp-on--click=\"actions.showLightbox\" data-wp-on--load=\"callbacks.setButtonStyles\" data-wp-on--pointerdown=\"actions.preloadImage\" data-wp-on--pointerenter=\"actions.preloadImageWithDelay\" data-wp-on--pointerleave=\"actions.cancelPreload\" data-wp-on-window--resize=\"callbacks.setButtonStyles\" src=\"https:\/\/lh7-qw.googleusercontent.com\/docsz\/AD_4nXfT3Rq8Pig_-tDNw1MTwYJb5mQpdK1jFNq_MiJEQ6SRTqd1H462aaXJWJhuyNM1kms-zC7QaWFThx-mDMr9Vb0jpqKiYO8-20v8C8UDgPugOVQO45uYySdLErgHsaTThiANA6u3xA?key=d-WOuKA4wfkiWPSpXkicNw\" alt=\"Open de Algemene instellingen door in het header configuratiepanel te klikken op Site Titel &amp; Logo.\"><button class=\"lightbox-trigger\" type=\"button\" aria-haspopup=\"dialog\" data-wp-bind--aria-label=\"state.thisImage.triggerButtonAriaLabel\" data-wp-init=\"callbacks.initTriggerButton\" data-wp-on--click=\"actions.showLightbox\" data-wp-style--right=\"state.thisImage.buttonRight\" data-wp-style--top=\"state.thisImage.buttonTop\">\n\t\t\t<svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"12\" height=\"12\" fill=\"none\" viewbox=\"0 0 12 12\">\n\t\t\t\t<path fill=\"#fff\" d=\"M2 0a2 2 0 0 0-2 2v2h1.5V2a.5.5 0 0 1 .5-.5h2V0H2Zm2 10.5H2a.5.5 0 0 1-.5-.5V8H0v2a2 2 0 0 0 2 2h2v-1.5ZM8 12v-1.5h2a.5.5 0 0 0 .5-.5V8H12v2a2 2 0 0 1-2 2H8Zm2-12a2 2 0 0 1 2 2v2h-1.5V2a.5.5 0 0 0-.5-.5H8V0h2Z\"><\/path>\n\t\t\t<\/svg>\n\t\t<\/button><\/figure>\n<\/div><p class=\"wp-block-paragraph\">Klik op de knop <strong>Logo Wijzigen<\/strong> om de WordPress mediabibliotheek te openen en je website logo te uploaden. Pas daarna de breedte van de header aan zoals je wilt.<\/p><p class=\"wp-block-paragraph\">Als je liever geen logo in je header wilt, kun je de placeholder ook verwijderen.<\/p><div class=\"wp-block-image\">\n<figure data-wp-context='{\"imageId\":\"6a91e514c3a3d\"}' data-wp-interactive=\"core\/image\" data-wp-key=\"6a91e514c3a3d\" class=\"aligncenter wp-lightbox-container\"><img decoding=\"async\" data-wp-class--hide=\"state.isContentHidden\" data-wp-class--show=\"state.isContentVisible\" data-wp-init=\"callbacks.setButtonStyles\" data-wp-on--click=\"actions.showLightbox\" data-wp-on--load=\"callbacks.setButtonStyles\" data-wp-on--pointerdown=\"actions.preloadImage\" data-wp-on--pointerenter=\"actions.preloadImageWithDelay\" data-wp-on--pointerleave=\"actions.cancelPreload\" data-wp-on-window--resize=\"callbacks.setButtonStyles\" src=\"https:\/\/lh7-qw.googleusercontent.com\/docsz\/AD_4nXdVSBjaYlB7CmbZzmqqqOhANtE9YDRslt9eApu8h9cm-whyAHhT7TCFNVHI142lW0RTtmUVVfciV084cmb5XBIDeUz0lz2XpJqBqXOcYNaW4FHKNaDvbVUFO9qAIN8j3fXUYrs_Pw?key=d-WOuKA4wfkiWPSpXkicNw\" alt=\"Klik op de knop Logo Wijzigen om de WordPress mediabibliotheek te openen en je website logo te uploaden.\"><button class=\"lightbox-trigger\" type=\"button\" aria-haspopup=\"dialog\" data-wp-bind--aria-label=\"state.thisImage.triggerButtonAriaLabel\" data-wp-init=\"callbacks.initTriggerButton\" data-wp-on--click=\"actions.showLightbox\" data-wp-style--right=\"state.thisImage.buttonRight\" data-wp-style--top=\"state.thisImage.buttonTop\">\n\t\t\t<svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"12\" height=\"12\" fill=\"none\" viewbox=\"0 0 12 12\">\n\t\t\t\t<path fill=\"#fff\" d=\"M2 0a2 2 0 0 0-2 2v2h1.5V2a.5.5 0 0 1 .5-.5h2V0H2Zm2 10.5H2a.5.5 0 0 1-.5-.5V8H0v2a2 2 0 0 0 2 2h2v-1.5ZM8 12v-1.5h2a.5.5 0 0 0 .5-.5V8H12v2a2 2 0 0 1-2 2H8Zm2-12a2 2 0 0 1 2 2v2h-1.5V2a.5.5 0 0 0-.5-.5H8V0h2Z\"><\/path>\n\t\t\t<\/svg>\n\t\t<\/button><\/figure>\n<\/div><h4 class=\"wp-block-heading\" id=\"h-\"><\/h4><p>\n\n\n        <div class=\"protip\">\n            <div class=\"protip__heading\">\n                <svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\">\n                    <path d=\"M1.49234 23.5024C1.23229 23.5024 0.972242 23.4024 0.782206 23.2123C0.562165 22.9923 0.452144 22.6822 0.502153 22.3722C0.562165 21.9221 1.14227 17.9113 3.00262 16.351C3.63274 15.8209 4.43289 15.5509 5.26305 15.5609C6.09321 15.5909 6.87335 15.9109 7.47347 16.4911C8.6937 17.6913 8.76371 19.6717 7.6435 20.9919C6.0832 22.8523 2.08245 23.4324 1.63237 23.4924C1.59236 23.4924 1.54235 23.4924 1.50234 23.4924L1.49234 23.5024ZM5.16303 17.5613C4.84297 17.5613 4.53291 17.6713 4.29287 17.8813C3.60274 18.4614 3.07264 19.9317 2.75258 21.242C4.06282 20.9219 5.5331 20.3918 6.11321 19.7017C6.55329 19.1716 6.54329 18.3814 6.0832 17.9213C5.85316 17.7013 5.5431 17.5713 5.20304 17.5613C5.19304 17.5613 5.17303 17.5613 5.16303 17.5613ZM11.7243 21.8821C11.4942 21.8821 11.2642 21.8021 11.0841 21.652C10.8541 21.462 10.7241 21.1819 10.7241 20.8819V15.9109L8.08358 13.2705H3.11264C2.81259 13.2705 2.53254 13.1404 2.3425 12.9104C2.15246 12.6803 2.07245 12.3803 2.12246 12.0902C2.19247 11.7102 2.84259 8.36953 4.70294 7.12929C6.33325 6.04909 8.96375 6.49918 10.244 6.80923C11.5442 4.96889 13.2546 3.4286 15.2349 2.33839C17.4553 1.11816 19.9858 0.518051 22.4963 0.498047C23.0464 0.498047 23.4865 0.948132 23.4865 1.49824C23.4865 5.0389 22.3763 9.97983 17.1753 13.7605C17.4853 15.0408 17.9354 17.6613 16.8552 19.2816C15.615 21.1419 12.2744 21.7921 11.8943 21.8621C11.8343 21.8721 11.7743 21.8821 11.7143 21.8821H11.7243ZM12.7245 16.181V19.6016C13.7146 19.2916 14.7948 18.7915 15.2049 18.1814C15.675 17.4812 15.605 16.091 15.385 14.9008C14.5248 15.3808 13.6346 15.8109 12.7245 16.181ZM9.66388 12.0302L11.9643 14.3307C13.1845 13.8306 14.3648 13.2204 15.485 12.5103C19.9358 9.51974 21.2361 5.60901 21.4561 2.53843C19.6157 2.67846 17.8254 3.20856 16.2051 4.09872C14.2847 5.14892 12.6544 6.68921 11.4942 8.54956C10.7841 9.65977 10.174 10.82 9.66388 12.0302ZM4.39289 11.2701H7.81353C8.1936 10.3599 8.63368 9.46974 9.11377 8.60957C7.92355 8.38953 6.51329 8.31952 5.81315 8.78961C5.19304 9.19968 4.70294 10.3099 4.39289 11.2701Z\" fill=\"#673DE6\"\/>\n                <\/svg>\n                <p class=\"protip__title\">\n                     Pro tip                 <\/p>\n            <\/div>\n            <p class=\"protip__content\"> Het Astra thema laat je een apart logo uploaden voor retina schermen. Dit wordt vaak gebruikt bij high-end apparaten zoals Apple producten. Voor deze functie moet je een logo aanleveren dat qua resolutie twee keer zo groot is als het originele logo. <\/p>\n                    <\/div>\n        \n\n\n\n<\/p><p class=\"wp-block-paragraph\">Als je in het panel naar beneden scrolt, zie je de algemene instellingen voor de<strong> Site Titel<\/strong>. Daar kun je de tekst aanpassen, bepalen op welke apparaten deze zichtbaar is, een tagline toevoegen en kiezen of je verschillende elementen in de header tonen of juist verbergen.<\/p><p class=\"wp-block-paragraph\">Onderaan het instellingen panel kun je het website icoon aanpassen. Bezoekers zien dit icoon in hun browser als ze jouw website bezoeken.<\/p><p class=\"wp-block-paragraph\">Je kunt het uiterlijk van de website titel, het logo en de tagline aanpassen door over te schakelen naar het <strong>Design<\/strong> tabblad in het instellingen panel.<\/p><div class=\"wp-block-image\">\n<figure data-wp-context='{\"imageId\":\"6a91e514c3e6b\"}' data-wp-interactive=\"core\/image\" data-wp-key=\"6a91e514c3e6b\" class=\"aligncenter wp-lightbox-container\"><img decoding=\"async\" data-wp-class--hide=\"state.isContentHidden\" data-wp-class--show=\"state.isContentVisible\" data-wp-init=\"callbacks.setButtonStyles\" data-wp-on--click=\"actions.showLightbox\" data-wp-on--load=\"callbacks.setButtonStyles\" data-wp-on--pointerdown=\"actions.preloadImage\" data-wp-on--pointerenter=\"actions.preloadImageWithDelay\" data-wp-on--pointerleave=\"actions.cancelPreload\" data-wp-on-window--resize=\"callbacks.setButtonStyles\" src=\"https:\/\/lh7-qw.googleusercontent.com\/docsz\/AD_4nXd-G6IdVA_3dEAoLYQ0J632v8EXohUB8VDSjycqDS21kQFehSXmha0U2QLAiUb8IYqPfqZWP9SdssN-NBgeAM828yVBcaGLv3f7zBTrQGgnwhay3YG6FXyhCKLS8g9IRG_EJY5S?key=d-WOuKA4wfkiWPSpXkicNw\" alt=\"Schakel over naar het Design tabblad in het instellingenpanel.\"><button class=\"lightbox-trigger\" type=\"button\" aria-haspopup=\"dialog\" data-wp-bind--aria-label=\"state.thisImage.triggerButtonAriaLabel\" data-wp-init=\"callbacks.initTriggerButton\" data-wp-on--click=\"actions.showLightbox\" data-wp-style--right=\"state.thisImage.buttonRight\" data-wp-style--top=\"state.thisImage.buttonTop\">\n\t\t\t<svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"12\" height=\"12\" fill=\"none\" viewbox=\"0 0 12 12\">\n\t\t\t\t<path fill=\"#fff\" d=\"M2 0a2 2 0 0 0-2 2v2h1.5V2a.5.5 0 0 1 .5-.5h2V0H2Zm2 10.5H2a.5.5 0 0 1-.5-.5V8H0v2a2 2 0 0 0 2 2h2v-1.5ZM8 12v-1.5h2a.5.5 0 0 0 .5-.5V8H12v2a2 2 0 0 1-2 2H8Zm2-12a2 2 0 0 1 2 2v2h-1.5V2a.5.5 0 0 0-.5-.5H8V0h2Z\"><\/path>\n\t\t\t<\/svg>\n\t\t<\/button><\/figure>\n<\/div><p class=\"wp-block-paragraph\"><strong>Navigatiemenu toevoegen<\/strong><\/p><p class=\"wp-block-paragraph\">Om het navigatiemenu in je nieuwe header aan te passen, klik je in het instellingen panel op de optie <strong>Primair Menu<\/strong>. Net als bij de site titel en het logo kun je hier de <strong>Algemene<\/strong> en <strong>Design<\/strong> instellingen van het menu aanpassen.<\/p><p class=\"wp-block-paragraph\">Wil je de menu-items in de header wijzigen? Klik dan op <strong>Menu vanaf hier Configureren<\/strong> om direct naar de menu-instellingen te gaan. Zo kun je het menu aanpassen, terwijl je meteen ziet hoe de veranderingen op de live website eruitzien.<\/p><p class=\"wp-block-paragraph\">Als alternatief worden de instellingen die je aanpast via <strong>Weergave &rarr; Menu&rsquo;s<\/strong> ook automatisch overgenomen in de header van het thema.<\/p><p class=\"wp-block-paragraph\">Zorg er wel voor dat je op <strong>Publiceren<\/strong> klikt voordat je de thema bouwer afsluit, zodat alle wijzigingen aan de header worden opgeslagen.<\/p><h4 class=\"wp-block-heading\" id=\"h-\"><\/h4><p>\n\n\n        <div class=\"protip\">\n            <div class=\"protip__heading\">\n                <svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\">\n                    <path d=\"M1.49234 23.5024C1.23229 23.5024 0.972242 23.4024 0.782206 23.2123C0.562165 22.9923 0.452144 22.6822 0.502153 22.3722C0.562165 21.9221 1.14227 17.9113 3.00262 16.351C3.63274 15.8209 4.43289 15.5509 5.26305 15.5609C6.09321 15.5909 6.87335 15.9109 7.47347 16.4911C8.6937 17.6913 8.76371 19.6717 7.6435 20.9919C6.0832 22.8523 2.08245 23.4324 1.63237 23.4924C1.59236 23.4924 1.54235 23.4924 1.50234 23.4924L1.49234 23.5024ZM5.16303 17.5613C4.84297 17.5613 4.53291 17.6713 4.29287 17.8813C3.60274 18.4614 3.07264 19.9317 2.75258 21.242C4.06282 20.9219 5.5331 20.3918 6.11321 19.7017C6.55329 19.1716 6.54329 18.3814 6.0832 17.9213C5.85316 17.7013 5.5431 17.5713 5.20304 17.5613C5.19304 17.5613 5.17303 17.5613 5.16303 17.5613ZM11.7243 21.8821C11.4942 21.8821 11.2642 21.8021 11.0841 21.652C10.8541 21.462 10.7241 21.1819 10.7241 20.8819V15.9109L8.08358 13.2705H3.11264C2.81259 13.2705 2.53254 13.1404 2.3425 12.9104C2.15246 12.6803 2.07245 12.3803 2.12246 12.0902C2.19247 11.7102 2.84259 8.36953 4.70294 7.12929C6.33325 6.04909 8.96375 6.49918 10.244 6.80923C11.5442 4.96889 13.2546 3.4286 15.2349 2.33839C17.4553 1.11816 19.9858 0.518051 22.4963 0.498047C23.0464 0.498047 23.4865 0.948132 23.4865 1.49824C23.4865 5.0389 22.3763 9.97983 17.1753 13.7605C17.4853 15.0408 17.9354 17.6613 16.8552 19.2816C15.615 21.1419 12.2744 21.7921 11.8943 21.8621C11.8343 21.8721 11.7743 21.8821 11.7143 21.8821H11.7243ZM12.7245 16.181V19.6016C13.7146 19.2916 14.7948 18.7915 15.2049 18.1814C15.675 17.4812 15.605 16.091 15.385 14.9008C14.5248 15.3808 13.6346 15.8109 12.7245 16.181ZM9.66388 12.0302L11.9643 14.3307C13.1845 13.8306 14.3648 13.2204 15.485 12.5103C19.9358 9.51974 21.2361 5.60901 21.4561 2.53843C19.6157 2.67846 17.8254 3.20856 16.2051 4.09872C14.2847 5.14892 12.6544 6.68921 11.4942 8.54956C10.7841 9.65977 10.174 10.82 9.66388 12.0302ZM4.39289 11.2701H7.81353C8.1936 10.3599 8.63368 9.46974 9.11377 8.60957C7.92355 8.38953 6.51329 8.31952 5.81315 8.78961C5.19304 9.19968 4.70294 10.3099 4.39289 11.2701Z\" fill=\"#673DE6\"\/>\n                <\/svg>\n                <p class=\"protip__title\">\n                     Pro tip                 <\/p>\n            <\/div>\n            <p class=\"protip__content\"> De standaardinstellingen voor het navigatiemenu kunnen per klassiek thema verschillen. Check eventueel de documentatie van het thema dat je gebruikt om te zien hoe je het navigatiemenu kunt aanpassen. <\/p>\n                    <\/div>\n        \n\n\n\n<\/p><h2 class=\"wp-block-heading\" id=\"h-waarom-een-wordpress-header-belangrijk-is\"><strong>Waarom een WordPress header belangrijk is<\/strong><\/h2><p class=\"wp-block-paragraph\">De header van je WordPress website staat bovenaan elke pagina en zet meteen de toon voor de gebruikerservaring.<\/p><p class=\"wp-block-paragraph\">Een aangepaste header biedt verschillende voordelen voor je WordPress website:<\/p><ul class=\"wp-block-list\">\n<li><strong>Navigatiehub<\/strong> &ndash; De header bevat vaak het hoofdmenu, waarmee bezoekers makkelijk hun weg vinden op jouw WordPress website.<\/li>\n\n\n\n<li><strong>Merkuitstraling<\/strong> &ndash; Je logo, tagline en kleuren komen hier samen en laten meteen zien waar jouw merk voor staat.<\/li>\n\n\n\n<li><strong>Visuele aantrekkingskracht<\/strong> &ndash; Een goed ontworpen header maakt je WordPress website niet alleen mooier, maar ook professioneler en uitnodigender.<\/li>\n<\/ul><p class=\"wp-block-paragraph\">Kort gezegd: je WordPress header heeft grote invloed op de gebruikerservaring (UX), omdat het bepaalt hoe mensen je WordPress website ervaren en ermee navigeren. Daarnaast helpt een duidelijke header ook bij je zoekmachineoptimalisatie (SEO), omdat het structuur geeft die belangrijk is voor zoekmachines.<\/p><h2 class=\"wp-block-heading\" id=\"h-tips-voor-een-effectieve-wordpress-header\"><strong>Tips voor een effectieve WordPress header<\/strong><\/h2><p class=\"wp-block-paragraph\">Houd je WordPress header functioneel &eacute;n aantrekkelijk met deze handige tips:<\/p><p class=\"wp-block-paragraph\"><strong>Zorg voor consistentie<\/strong><\/p><p class=\"wp-block-paragraph\">Je header helpt bezoekers om soepel door je website te navigeren. Daarom is het belangrijk dat hij op elke pagina dezelfde uitstraling heeft. Of iemand nu op je startpagina, een blogartikel of een productpagina belandt &ndash; een uniforme header zorgt voor herkenning en vertrouwen.<\/p><p class=\"wp-block-paragraph\">Let er ook op dat je de header bijwerkt als je nieuwe pagina&rsquo;s toevoegt of content verandert. Maak je bijvoorbeeld een nieuwe pagina aan? Vergeet dan niet om het navigatiemenu te updaten.<\/p><p class=\"wp-block-paragraph\">Sommige WordPress thema&rsquo;s passen de header automatisch aan, maar niet allemaal. Controleer dus altijd of alles nog klopt.<\/p><p class=\"wp-block-paragraph\"><strong>Houd het simpel<\/strong><\/p><p class=\"wp-block-paragraph\">Een header is belangrijk, maar te veel elementen kunnen je website rommelig maken. Een minimalistische header werkt meestal het beste.<\/p><p class=\"wp-block-paragraph\">Zorg dat je bezoekers zich kunnen focussen op wat &eacute;cht telt: je logo, websitetitel, tagline en het menu.<\/p><p class=\"wp-block-paragraph\">Wil je toch iets groots toevoegen, zoals een uitgebreide zoekfunctie? Overweeg dan om die ergens anders op de pagina te plaatsen.<\/p><p class=\"wp-block-paragraph\"><strong>Gebruik beelden van hoge kwaliteit<\/strong><\/p><p class=\"wp-block-paragraph\">Je logo is het visuele anker van je merk. Zet daarom in je header altijd een scherp en professioneel ogend logo.<\/p><p class=\"wp-block-paragraph\">Een wazige afbeelding doet af aan je uitstraling. Gebruik dus een bestand met hoge resolutie voor de beste eerste indruk.<\/p><p class=\"wp-block-paragraph\">Tip: laat je logo ontwerpen door een professional of maak er een met een <a href=\"\/nl\/logo-maken\">AI-logo tool<\/a>.<\/p><p class=\"wp-block-paragraph\"><strong>Denk aan mobiel gebruik<\/strong><\/p><p class=\"wp-block-paragraph\">Bijna<a href=\"https:\/\/www.thewebmaster.com\/what-percentage-of-search-are-mobile\/\" target=\"_blank\" rel=\"noopener\"> 60% van alle internet zoekopdrachten<\/a> wordt gedaan via een mobiel apparaat. Het is dus belangrijk dat mobiele bezoekers je WordPress website makkelijk kunnen lezen en gebruiken, zonder in te zoomen of te schuiven.<\/p><p class=\"wp-block-paragraph\">Een mobielvriendelijke header past zich automatisch aan elk schermformaat aan en zorgt voor een soepele gebruikservaring, of iemand nu op een laptop, tablet of smartphone zit. Dit is niet alleen fijn voor je bezoekers, maar ook gunstig voor je SEO.<\/p><p class=\"wp-block-paragraph\">Kies daarom altijd voor een responsief WordPress thema of een pagina bouwer die mobiel ondersteunt. Zo blijft je aangepaste header automatisch goed zichtbaar en bruikbaar op elk apparaat.<\/p><p class=\"wp-block-paragraph\">Wil je controleren of je WordPress website mobielvriendelijk is? Dan kun je bijvoorbeeld de <a href=\"https:\/\/search.google.com\/test\/mobile-friendly\" target=\"_blank\" rel=\"noopener\">Mobiel Vriendelijke Test in Google Search Console<\/a> gebruiken.<\/p><figure class=\"wp-block-image size-large\"><a href=\"\/nl\/wordpress-hosting\"><img decoding=\"async\" width=\"1024\" height=\"300\" src=\"https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/28\/2024\/06\/NL-New-WP_in-text-banner-1.png\/w=1024,h=1024,fit=scale-down\" alt=\"\" class=\"wp-image-160\" srcset=\"https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/28\/2024\/06\/NL-New-WP_in-text-banner-1.png\/w=1024,fit=scale-down 1024w, https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/28\/2024\/06\/NL-New-WP_in-text-banner-1.png\/w=300,fit=scale-down 300w, https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/28\/2024\/06\/NL-New-WP_in-text-banner-1.png\/w=768,fit=scale-down 768w\" sizes=\"(max-width: 1024px) 100vw, 1024px\" \/><\/a><\/figure><h2 class=\"wp-block-heading\" id=\"h-conclusie\"><strong>Conclusie<\/strong><\/h2><p class=\"wp-block-paragraph\">Leren hoe je de header in WordPress aanpast, helpt om je website er beter uit te laten zien &eacute;n gebruiksvriendelijker te maken. Gelukkig kun je dit eenvoudig doen via de <strong>Site Editor <\/strong>of de<strong> Customizer<\/strong> &ndash; het zijn maar een paar simpele stappen.<\/p><p class=\"wp-block-paragraph\">Naast de uitleg over beide methodes, hebben we ook tips gegeven om je WordPress header effectief te houden. Hier een korte samenvatting:<\/p><ul class=\"wp-block-list\">\n<li>Houd je header consistent voor een professionele uitstraling.<\/li>\n\n\n\n<li>Zorg voor een rustige opzet met focus op de belangrijkste elementen: je logo, titel, tagline en navigatiemenu.<\/li>\n\n\n\n<li>Gebruik afbeeldingen van hoge kwaliteit om je branding te versterken.<\/li>\n\n\n\n<li>Kies een mobielvriendelijk WordPress thema, zodat je header goed werkt op elk schermformaat.<\/li>\n<\/ul><p class=\"wp-block-paragraph\">En tot slot: kies een <a href=\"\/nl\/wordpress-hosting\">betrouwbare WordPress hostingprovider<\/a> zodat je website altijd bereikbaar is en snel laadt.<\/p><h2 class=\"wp-block-heading\" id=\"h-hoe-je-een-wordpress-header-aanpast-faq-s\"><strong>Hoe je een WordPress header aanpast FAQ&rsquo;s<\/strong><\/h2><p class=\"wp-block-paragraph\">Lees hieronder de meestgestelde vragen over het aanpassen van je WordPress header:<\/p><div id=\"rank-math-faq\" class=\"rank-math-block\">\n<div class=\"rank-math-list \">\n<div id=\"faq-question-6943ffb2db56a\" class=\"rank-math-list-item\">\n<h3 class=\"rank-math-question \"><strong>Kan ik een WordPress header aanpassen zonder technische kennis van code?<\/strong><\/h3>\n<div class=\"rank-math-answer \">\n\n<p>Zeker. Je kunt je header bewerken via de WordPress<strong> Site Editor <\/strong>of <strong>Customizer<\/strong> zonder dat je hoeft te coderen. Wil je toch custom CSS toevoegen voor extra stijlaanpassingen? Dan kun je dat makkelijk doen via de <strong>Theme File Editor<\/strong> of met een plug-in.<\/p>\n\n<\/div>\n<\/div>\n<div id=\"faq-question-6943ffb2db56f\" class=\"rank-math-list-item\">\n<h3 class=\"rank-math-question \"><strong>Kan ik het bestand header.php van WordPress direct aanpassen?<\/strong><\/h3>\n<div class=\"rank-math-answer \">\n\n<p>Ja, het bestand<strong> header.php <\/strong>is aanpasbaar in WordPress. Zorg er wel voor dat je eerst <a href=\"\/nl\/tutorials\/wordpress-backup\/\">een back-up maakt<\/a>. Alle wijzigingen hebben direct invloed op de uitstraling en werking van je website. Wees dus extra voorzichtig en werk het liefst in een child theme om problemen te voorkomen.<\/p>\n\n<\/div>\n<\/div>\n<div id=\"faq-question-6943ffb2db570\" class=\"rank-math-list-item\">\n<h3 class=\"rank-math-question \"><strong>Bestaat er een plug-in om de header in WordPress aan te passen?<\/strong><\/h3>\n<div class=\"rank-math-answer \">\n\n<p>Ja, er zijn verschillende plug-ins om een custom header te maken. Populaire opties zijn <a href=\"https:\/\/wordpress.org\/plugins\/insert-headers-and-footers\/\" target=\"_blank\" rel=\"noopener\">WPCode<\/a>, <a href=\"https:\/\/codecanyon.net\/item\/ultimate-header-builder-addon-wpbakery-page-builder-formerly-visual-composer\/21118792\" target=\"_blank\" rel=\"noopener\">Ultimate Header Builder <\/a>en <a href=\"https:\/\/wordpress.org\/plugins\/header-footer-code-manager\/\" target=\"_blank\" rel=\"noopener\">Header Footer Code Manager<\/a> &ndash; vooral handig als je aangepaste code zoals Google Analytics of Facebook Pixel in je header wilt zetten.<\/p>\n\n<\/div>\n<\/div>\n<\/div>\n<\/div><p class=\"wp-block-paragraph\"><strong>Alle educatieve content op deze website wordt zorgvuldig gecontroleerd en voldoet aan de hoge redactionele standaarden van Hostinger.<\/strong><\/p>\n","protected":false},"excerpt":{"rendered":"<p>WordPress headers zijn bepalend voor de eerste indruk van je bezoekers. Door te weten hoe je een WordPress header kan bewerken, kun je je merkidentiteit versterken, de navigatie verbeteren of simpelweg het uiterlijk van je website opfrissen. Gelukkig kun je in WordPress eenvoudig je header aanpassen via de Customizer of de Site Editor. Beide methodes [&#8230;]<\/p>\n<p><a class=\"btn btn-secondary understrap-read-more-link\" href=\"\/nl\/tutorials\/wordpress-header\/\">Read More&#8230;<\/a><\/p>\n","protected":false},"author":538,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_acf_changed":false,"rank_math_title":"WordPress header bewerken: 2 methodes + handige tips","rank_math_description":"Verbeter de navigatie en gebruikerservaring met een aantrekkelijke Wordpress header. Ontdek snel hoe je dit kan doen.","rank_math_focus_keyword":"wordpress header","footnotes":""},"categories":[134,116],"tags":[],"class_list":["post-4776","post","type-post","status-publish","format-standard","hentry","category-personalisatie-en-ontwerp","category-wordpress"],"hreflangs":[{"locale":"en-US","link":"https:\/\/www.hostinger.com\/tutorials\/how-to-edit-wordpress-header\/","default":0},{"locale":"es-ES","link":"https:\/\/www.hostinger.com\/es\/tutoriales\/como-editar-un-header-de-wordpress\/","default":0},{"locale":"de-DE","link":"https:\/\/www.hostinger.com\/de\/tutorials\/wordpress-header\/","default":0},{"locale":"pl-PL","link":"https:\/\/www.hostinger.com\/pl\/tutoriale\/jak-edytowac-naglowek-w-wordpress\/","default":0},{"locale":"ja-JP","link":"https:\/\/www.hostinger.com\/jp\/tutorials\/how-to-edit-wordpress-header\/","default":0},{"locale":"en-PH","link":"https:\/\/www.hostinger.com\/ph\/tutorials\/how-to-edit-wordpress-header\/","default":0},{"locale":"en-MY","link":"https:\/\/www.hostinger.com\/my\/tutorials\/how-to-edit-wordpress-header\/","default":0},{"locale":"en-GB","link":"https:\/\/www.hostinger.com\/uk\/tutorials\/how-to-edit-wordpress-header\/","default":0},{"locale":"en-IN","link":"https:\/\/www.hostinger.com\/in\/tutorials\/how-to-edit-wordpress-header\/","default":0},{"locale":"en-CA","link":"https:\/\/www.hostinger.com\/ca\/tutorials\/how-to-edit-wordpress-header\/","default":0},{"locale":"en-AU","link":"https:\/\/www.hostinger.com\/au\/tutorials\/how-to-edit-wordpress-header\/","default":0},{"locale":"en-NG","link":"https:\/\/www.hostinger.com\/ng\/tutorials\/how-to-edit-wordpress-header\/","default":0},{"locale":"es-AR","link":"https:\/\/www.hostinger.com\/ar\/tutoriales\/como-editar-un-header-de-wordpress\/","default":0},{"locale":"es-MX","link":"https:\/\/www.hostinger.com\/mx\/tutoriales\/como-editar-un-header-de-wordpress\/","default":0},{"locale":"es-CO","link":"https:\/\/www.hostinger.com\/co\/tutoriales\/como-editar-un-header-de-wordpress\/","default":0}],"acf":[],"_links":{"self":[{"href":"https:\/\/www.hostinger.com\/nl\/tutorials\/wp-json\/wp\/v2\/posts\/4776","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.hostinger.com\/nl\/tutorials\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.hostinger.com\/nl\/tutorials\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.hostinger.com\/nl\/tutorials\/wp-json\/wp\/v2\/users\/538"}],"replies":[{"embeddable":true,"href":"https:\/\/www.hostinger.com\/nl\/tutorials\/wp-json\/wp\/v2\/comments?post=4776"}],"version-history":[{"count":4,"href":"https:\/\/www.hostinger.com\/nl\/tutorials\/wp-json\/wp\/v2\/posts\/4776\/revisions"}],"predecessor-version":[{"id":5289,"href":"https:\/\/www.hostinger.com\/nl\/tutorials\/wp-json\/wp\/v2\/posts\/4776\/revisions\/5289"}],"wp:attachment":[{"href":"https:\/\/www.hostinger.com\/nl\/tutorials\/wp-json\/wp\/v2\/media?parent=4776"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.hostinger.com\/nl\/tutorials\/wp-json\/wp\/v2\/categories?post=4776"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.hostinger.com\/nl\/tutorials\/wp-json\/wp\/v2\/tags?post=4776"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}