- \n
- Bij pagina\u2019s met veel tekst zorgen ankerlinks voor een betere gebruikerservaring<\/strong> en bevorderen de toegankelijkheid<\/strong> van een website. Lezers kunnen gelijk naar dat gedeelte gaan, waar zij ge\u00efnteresseerd in zijn.<\/li>\n
- De ankerlinks komen ook van pas wanneer je vanaf bijvoorbeeld sociale media of in een e-mail of nieuwsbrief naar een bepaald deel van je pagina wilt linken.<\/li>\n
- Wanneer je ankerlinks in de vorm van een inhoudsopgave gebruikt worden deze in de zoekresultaten van Google weergegeven. Zie hiervoor onderstaand voorbeeld van het zoekresultaat van de Wikipediapagina van Barack Obama.<\/li>\n
- Je kan een ankerlink ook inzetten om terug naar het begin van de pagina te gaan.<\/li>\n<\/ul>\n
![\"Ankerlink](\"https:\/\/burorader.com\/wp-content\/uploads\/2020\/12\/anchor-link.jpg\")
<\/a><\/p>\nEventueel nadeel van het gebruik van ankerlinks<\/h2>\n
Hoewel ankerlinks nuttig kunnen zijn, is er wel een nadeel: lezers die gelijk naar datgene gaan wat ze willen lezen, lezen de rest van de pagina niet en kunnen dus informatie missen. Dat schrijvende, de voordelen wegen over het algemeen op tegen dit nadeel.<\/p>\n
Een ankerlink toevoegen<\/h2>\n
Er zijn verschillende manieren om een ankerlink te maken: via je teksteditor, handmatig via html-tags in de teksteditor – je voegt dan dus zelf code toe – via een plugin,\u00a0 of via een Chrome Extensie.<\/p>\n
Een ankerlink toevoegen met Gutenberg<\/h2>\n
Wanneer je met Gutenberg (de nieuwe teksteditor van WordPress 5) werkt, kun je de ankerlink eenvoudig toevoegen. Hier highlight je de tussenkop en in het geavanceerde blok in de rechterkolom kun je vervolgens de ankerlink toevoegen.<\/p>\n
Handmatig een ankerlink toevoegen<\/h2>\n
Zet de teksteditor op \u201chandmatig\u201d in plaats van op \u201cvisueel\u201d en ga op zoek naar datgene naar waar je wilt linken<\/strong>. Aan deze tekst (of knop of formulier) voeg je een id toe. Dit klinkt ingewikkeld maar dit is een voorbeeld van een ankerlink naar tussenkop: <h2 id=”dit-is-de-anker-link”>De tussenkoptekst<\/h2>.<\/p>\n
De ankerlink is nu aangemaakt en nu kun je de link gaan aanmaken<\/strong>. Switch de teksteditor terug naar \u201cvisual\u201den selecteer de tekst waarvan je een link wilt maken. Je klikt op link maken en typt (of kopieert) de URL van de pagina waarop de ankerlink staat, direct gevolgd door een hashtag (#) en door de id (dit-is-de-anker-link) en slaat deze op. En dat is alles!<\/p>\n
Let op: gebruik voor elke ankerlink een unieke id!<\/p>\n
Eenvoudig een ankerlink toevoegen in Divi<\/h2>\n
Onderaan mijn blogposts staat altijd een regel tekst met daarin de mogelijkheid tot het inschrijven op mijn nieuwsbrief. Dit inschrijfformulier onder andere staat onderaan mijn homepage. Ik gaf de sectie waarin het inschrijfformulier staat de id inschrijfnieuws<\/em>. Je vindt die mogelijkheid onder de tab geavanceerd.<\/p>\n
![\"Ankerlink](\"https:\/\/burorader.com\/wp-content\/uploads\/2022\/01\/ankerlink-ingeven-in-divi-sectie.jpg\")
<\/a><\/p>\nVervolgens zul je de URL van de ankerlink – in mijn geval https:\/\/burorader.com\/#inschrijfnieuwsbrief\/ aan je tekst moeten toevoegen. Hieronder zie je hoe ik de ankerlink onderaan deze blogpagina heb toegevoegd.<\/p>\n
![\"Ankerlink](\"https:\/\/burorader.com\/wp-content\/uploads\/2022\/01\/ankerlink-ingeven-in-divi-tekst.jpg\")
<\/a><\/p>\nVoorbeeld ankerlink vanaf een knop<\/h2>\n
Je kunt een ankerlink ook aan een knop toevoegen. Op de homepage van Le R\u00eave Proven\u00e7al<\/a> staat bij de contactmogelijkheden onderaan de pagina, een knop naar de reserveringsaanvraag. Dit formulier staat op de pagina\u00a0prijzen en beschikbaarheid<\/strong>.<\/p>\n
Met een plugin<\/h2>\n
Er zijn verschillende plugins waarmee je ankerlinks eenvoudig kunt toevoegen, maar in principe kan het dus ook prima zonder een plugin:<\/p>\n
- \n
- TinyMCE Advanced<\/a> \u2013 waarmee je extra functionaliteiten aan je teksteditor kan toevoegen en inclusief het maken van ankerlinks<\/li>\n
- Voor het gebruik van ankerlinks in inhoudsopgaven kun je de Easy Table of Contents<\/a> plugin gebruiken<\/li>\n
- En voor het linken naar tussenkopjes kun je de WP Anchor Header<\/a> plugin inschakelen<\/li>\n<\/ul>\n
- Voor het gebruik van ankerlinks in inhoudsopgaven kun je de Easy Table of Contents<\/a> plugin gebruiken<\/li>\n