Paginaverspringers maken

Paginaverpringers, ook wel anchor-koppelingen of ankerlink genoemd, zijn links waarop je klikt om meteen verder omhoog of omlaag te gaan in een tekst. De inhoudsopgave aan de rechterkant is een voorbeeld van een paginaverspringer.

Een paginaverspringer is een geweldige manier om te linken naar een gedeelte van een pagina. Bezoekers van je site kunnen klikken om van het ene deel van een lange pagina naar een ander deel van dezelfde pagina te gaan.

Bijvoorbeeld: je hebt een lijst met namen van gedeelten bovenaan een pagina staan. Je kan elke naam koppelen aan het relevante gedeelte lager op de pagina, zodat bezoekers meteen naar het gedeelte kunnen gaan waarin ze geïnteresseerd zijn. Je kunt de lezers vervolgens direct doorsturen naar de oorspronkelijke lijst met alle gedeelten aan het begin van de pagina.

Deze video is in het Engels.
YouTube biedt automatische vertaalfuncties zodat je de video in je eigen taal kunt bekijken:

Automatisch vertaalde ondertitels inschakelen:

1. Speel de video af.
2. Klik op het ⚙️ Instellingen-pictogram (rechtsonder in het videoscherm).
3. Selecteer Ondertiteling/CC.
4. Kies Automatisch vertalen.
5. Selecteer je voorkeurstaal.

Automatische nasynchronisatie (experimenteel) gebruiken:

1. Klik op ⚙️ Instellingen.
2. Selecteer Audiotrack.
3. Kies de taal waarin je wilt luisteren.

ℹ️ Vertalingen en nasynchronisaties worden automatisch gegenereerd door Google, kunnen onjuistheden bevatten en de automatische nasynchronisatie is nog in testfase, dus niet in alle talen beschikbaar.

De eerste stap is om het gedeelte te selecteren waar je lezers naartoe willen wanneer ze op de paginaverspringer klikken. Om dit te doen, kunnen we een ‘anker’ creëren op het blok waar je naar wilt verspringen.

1. Klik op het blok waaraan je de anker wil toevoegen. Veel veelvoorkomende blokken ondersteunen ankers, waaronder paragraaf, koptekst, afbeelding, kolommen en knoppen.
2. Bekijk de blokstellingen in de rechterzijbalk. Als je de zijbalk rechts niet ziet, klik je op het pictogram Instellingen in de rechterbovenhoek om de instellingen weer te geven. Dit pictogram lijkt op een vierkant met twee oneven kolommen:

3. Klik onderaan de blokinstellingen op Geavanceerd.
4. Typ een woord in het vak HTML-anker. Dit zal je anker worden. Zorg ervoor dat je een uniek woord gebruikt dat niet al ergens anders op de pagina als anker wordt gebruikt. Als je meer dan één woord wilt gebruiken, wordt er automatisch een koppelteken (-) tussen de woorden ingevoegd, zoals dit: twee-woorden:

Vervolgens maken we de paginaverspringerlink. Je bezoekers klikken hierop om bij het gedeelte te komen dat je in stap 1 hebt aangemaakt.

1. Typ tekst of voeg een afbeelding, knop of navigatiemenu-item toe waarop je lezers kunnen klikken.
2. Selecteer tekst/afbeelding/knop/menu-item en klik op de linkoptie in de werkbalk van het blok. De linkoptie is een pictogram dat lijkt op de daadwerkelijke schakel (link) van een keten, zoals hier gemarkeerd:
   
3. Voer de HTML-anker die je gemaakt hebt in stap 1 in, en begin daarbij met een hekje (#). Als je bijvoorbeeld een anker met de naam maak-een-paginaverspringer hebt gemaakt, dan link je naar #maak-een-paginaverspringer
4. Klik op Opslaan/Bijwerken/Publiceren rechtsboven in de editor om je wijzigingen op te slaan.

Dat is alles! Je kan nu je link testen op de openbare pagina om er zeker van te zijn dat de link die je in Stap 2 hebt aangemaakt je naar het anker leidt dat je in Stap 1 hebt aangemaakt. Let op: de paginaverspringerlinks werken niet wanneer je een voorbeeld van een pagina of bericht bekijkt, dus test op de gepubliceerde versie.

Je kunt vanuit je navigatiemenu paginaverspringers maken die verwijzen naar een specifiek deel van een pagina. Dit is gebruikelijk voor sites met een lange homepage. Paginaverspringers maken het voor bezoekers eenvoudiger om het gedeelte van de homepage te bekijken dat ze willen.

1. De eerste stap is een anker creëren waarnaar wordt versprongen.
2. Voeg in je menu een nieuw item toe dat een aangepaste link is.
3. Schrijf in het veld Tekst hoe je het menu-item wilt noemen. Dit heeft geen invloed op de paginaverspringing.
4. Schrijf in het URL-veld je anker met een hashtag (#) ervoor.

Houd er rekening mee dat een paginaverspsringer zoals #mijn-anker alleen werkt op dezelfde pagina waarop het anker zich bevindt. Als je naar een gedeelte van een andere pagina wilt verspringen, bekijk dan het volgende gedeelte van deze handleiding.

Paginaverspringers worden niet alleen gebruikt om te linken aan gedeelten binnen dezelfde pagina. Je kan een paginaverspringer gebruiken om van één pagina naar een specifiek onderdeel van een andere pagina te verspringen.

Het verschil is dat in plaats van alleen te linken naar het anker, zoals de manier waarop we onze link hebben geschreven als #een-paginaverspringer-aanmaken in stap 2 hierboven, we zouden linken naar de volledige pagina-URL plus het anker.

Bijvoorbeeld als je pagina de volgende URL heeft:

https://yourgroovydomain.com/example/

en je op die pagina een anker maakt met de naam unieke-identifier, dan is de volledige paginaverspringerlink:

https://yourgroovydomain.com/example/#unieke-identifier

Om een terug-naar-boven-link te maken:

1. Voeg een anker toe aan een blok aan het begin van je pagina.
2. Typ lager op de pagina een tekst zoals ‘Terug naar boven’ of ‘Naar het begin’.
3. Koppel die tekst aan je anker.