HTML | anchor tags toevoegen aan je berichten

Anchor tags

Anchor tags. wat is het, wat kun je er mee, en hoe maak je ze

Anchor Tags | interne links binnen je bericht

In dit artikel ga ik in op een reuzehandige manier van linken binnen je eigen berichten, of naar een specifiek stuk tekst uit een artikel. Het vraagt een klein beetje html, maar het stelt weinig voor, en is daarna wel heel handig.
Bijvoorbeeld met deze LINK ga je naar de onderkant van dit bericht

HTML, is dat niet achterhaald?

Neu, t werkt nog steeds heel handig hoor!
ik ben van het tijdperk 56k inbelmodem.. oftewel het begin van internet.. oftewel toe aan een midlifecrisis, oftewel nog thuis in de oude html code… logica? not so much.
Wat ik bedoel te zeggen is dat ik op de middelbare school websites bouwde door middel van html. En heb daardoor dus nog enige kennis van de tags die daar bij horen.
Een hyperlink maak je in wordpress met een druk op de knop, maar wat er op de achtergrond eigenlijk gebeurd is dat er een tag wordt toegevoegd aan je stuk tekst waardoor het veranderd in een link.

Vroeger typte je dat zelf.

<a href=”www.dewebsitewaarjenaartoewiltlinken.nl”>de tekst van je link waar je bezoeker op klikt</a>

zo dus.

in de basis.

Visuele editor en de tekst editor

als je een blog bericht toevoegt aan je wordpress site werk je by default in de visuele editor.  what you see is what you get.

wordpress voegt zelf tags toe op de achtergrond als je bijvoorbeeld een

H1 titel

toevoegt of een zin vet gedrukt maakt.

Zie hier de tekst editor van bovenstaande
tags

je kunt dus in je tekst tags toevoegen door naar de Tekst editor van je bericht te gaan.

De anchor tags

Om nou een anchor tag toe te voegen moet je eerst bepalen welk woord of stuk tekst het doel, het anchor, wordt.
ik heb in dit bericht het eerste woord een anchor gemaakt voor de link helemaal onderaan deze pagina, waarmee je weer helemaal naar boven navigeert, en het laatste woord is een anchor waar de link in de eerste alinea naar toe verwijst.

Je voert een anchor als volgt in, in de Tekst editor:
<a id=”naamvanjeanchor”>hier je anker tekst</a>

je maakt een interne link naar de ankertest via de hyperlink knop in je menubalk useful site. Geef hiervoor de je link als volgt in : #naamvanjeanchor

anchor maken   hyperlink wordpress

Je kunt ook linken naar anker testen op andere pagina’s.
In het artikel over Tidio Chat installeren verwijs ik op een gegeven moment naar een eerder genoemd stukje automatisering. Via deze ankerlink kom je precies bij dat stuk tekst uit. (opent in een nieuw tabblad) Handig, als je… zeg… mensen wilt verwijzen naar een exact stuk tekst.
in dit artikel ziet dat er zo uit:

tekst top anchor

De link onderin de pagina ziet er zo uit:

anchor bottom link
je ziet, hier zit eerst een anchor tag die de positie aangeeft waar naar toe gelinkt kan worden vanaf een andere lokatie, en daarna staat er een <a href tag richting het anchor bovenin.

Conclusie

Anchor tags, mega handig als je lange artikelen schrijft en en inhoudsopgave wilt maken bovenaan je artikel, of als je wilt verwijzen naar een heel specifiek stuk tekst in een ander artikel, of gewoon omdat het kan.
HTML is nog steeds handig, en met deze <a id=”anchortag></a> code kun je lekker heen en weer navigeren door je artikelen!
Succes!

 

 

 

Met deze LINK ga je weer helemaal naar de bovenkant het bericht

 

Geef een reactie

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