Hoe kun je anker links in WordPress zetten? Lees het in dit bericht

Wat zijn anker links?

Ankerlinks zijn links waarmee je kunt verspringen binnen je pagina of bericht.

Anker links maken aanleggen in WordPress website editor HTML

Hoe anker links in WordPress zetten?

Stel je wilt binnen een pagina verspringen van de 1 naar de andere plek, dan kun je dit zelf doen via HTML. Binnen de WordPress editor kun je een anker link maken (/ anchorlink maken) door niet ‘Visueel’ te kiezen, maar ‘Tekst’ modus (rechtsboven tab).

HTML code anker links WordPress

Dit zet je eerst in de bovenkant van de pagina of boven je sectie:
<p id=”top”></p>

Leg een anker link aan op het vertrekpunt in je webpagina, waar het verspringen dus begint:
<a href=”#12″ target=”_blank” rel=”&quot;noopener”>Bekijk punt 12.</a>

Naar deze plek:
<h3 id=”12″>12. WordPress website testen</h3>

En via een anker link ook weer terug, definieer de link “top”, startplek is met #, eindplek zonder:
<a href=”#top” target=”_blank” rel=”&quot;noopener”>Terug naar top</a>

HTML voorbeeld anker links WordPress

Je kunt anker links opnemen in een lange opsomming, zoals in deze voorbeeld code (onder) is te zien. Deze code met anker links werkt in mijn bericht over “website testen“. Dus je kunt zelf even checken hoe prettig anker links werken op een website.

<h2 id=”00″></a>Tooloverzicht WordPress website testen</h2>
<ol>
<li><a href=”#01″ target=”_blank” rel=”noopener”>website testen op (eerste) ontwerp</a></li>
<li><a href=”#02″ target=”_blank” rel=”noopener”>WordPress website testen op zoekwoorden</a></li>
<li><a href=”#03″ target=”_blank” rel=”noopener”>website SEO test</a></li>
<li><a href=”#04″ target=”_blank” rel=”noopener”>content en marketing check</a></li>
<li><a href=”#05″ target=”_blank” rel=”noopener”>website performance / laadtijd test</a></li>
<li><a href=”#06″ target=”_blank” rel=”noopener”>usability en responsiveness testen</a></li>
<li><a href=”#07″ target=”_blank” rel=”noopener”>website spelling test / Nederlands taalniveau (</a><a href=”https://www.gerbengvandijk.nl/b1-webteksten-schrijven”>B1 taalniveau)</a></li>
<li><a href=”#08″ target=”_blank” rel=”noopener”>welke WordPress thema’s en plugins gebruikt?</a></li>
<li><a href=”#09″ target=”_blank” rel=”noopener”>website testen op toptaken (GerryMcGovern)</a></li>
<li><a href=”#10″ target=”_blank” rel=”noopener”>WordPress database optimaliseren tools</a></li>
<li><a href=”#11″ target=”_blank” rel=”noopener”>HTML en CSS Webstandaarden toetsen / testen</a></li>
<li><a href=”#12″ target=”_blank” rel=”noopener”>WordPress website bezoek analyseren op gedrag(en afhaak).</a></li>
</ol>

Voorbeeld van bestemming van de anker links, link href #03:

Bovenstaande opsomming leidt alleen tot verspringen binnen de pagina als je elke href laat aankomen bij een id element. Dit is een voorbeeld van zo’n bestemming voor je anker link. Merk op dat de <h3> heading nu is gecombineerd met id:

<h3 id=”03″></a>Ad 3. WordPress website testen op SEO aspect</h3>
Een algehele gratis website SEO test is: <a href=”https://seositecheckup.com”>https://seositecheckup.com</a>
<a href=”#00″>Terug naar tooloverzicht</a>

Succes met WordPress.

Gerben G. van Dijk.

0 antwoorden

Plaats een Reactie

Meepraten?
Draag gerust bij!

Geef een reactie

Het e-mailadres wordt niet gepubliceerd. Vereiste velden zijn gemarkeerd met *