HTML-ankers en scrolling over de website

Wanneer u gebruik maakt van lange pagina's op uw website en u wilt rechtstreekse links maken naar een specifiek onderdeel binnen deze pagina, dan kan dat met een HTML anker.

HTML anker plaatsen

U kunt op ieder willekeurig punt op uw pagina een HTML anker plaatsen. Dat doet u door met de cursor op de positie te gaan staan waar u een 'anker' wilt toevoegen. Vervolgens kiest u aan de rechterzijde voor het 'Content invoegen' icoontje (het blaadje met de pijl). Kies vervolgens voor 'HTML anker' en vul daar het anker in. Het hier door u ingevulde anker kunt u vervolgens gebruiken in de link naar dit onderdeel op deze pagina.

Link maken naar een HTML anker

Wanneer u nu een link wilt maken die automatisch naar de plek springt waar u een anker heeft toegevoegd, dan kunt u dit doen door de gehele URL van de pagina te nemen en hier vervolgens het volgende stukje code achter te plaatsen:

#!anker

Waarbij 'anker' vervangen kan worden door het door u aangemaakte anker. U kunt hier vervolgens een link van maken op uw pagina's door te linken naar de volledige URL, die er dan ongeveer zo uitziet:

www.ziber.nl/welkom#!makkelijk-cms

Hierbij is 'makkelijk-cms' het toegevoegde anker. U kunt nu bijvoorbeeld bovenaan deze pagina een link maken naar het specifieke onderdeel binnen diezelfde pagina. Ook is het natuurlijk mogelijk om elders op de site, of misschien op een geheel andere site, een verwijzing te maken naar dezelfde URL. De bezoeker van die website, welke klikt op de link, wordt dan naar de pagina verwezen en scrolt automatisch naar de goede plek.

Standaard ankers

Binnen uw Ziber website kunt u de volgende standaard ankers altijd gebruiken in de links naar pagina's:

• #!website
• #!section
• #!footer

Het anker #!website zorgt ervoor dat de bezoeker helemaal naar boven scrolt. Ook is het mogelijk om een verwijzing te maken naar de bovenzijde van het 'section' gedeelte (waar de pagina-inhoud begint), dat doet u met het anker #!section. Met het anker #!footer maakt u een verwijzing die helemaal naar uw footer scrolt.