Met de instelling ‘Ankerpunten voor weergeven knoppen’ kun je bepalen waar de Losse knoppen of de Leeshulp-knop op de pagina worden weergegeven.
Je doet dit door een CSS-selector op te geven en aan te geven waar de knop ten opzichte van dat element moet worden geplaatst.
Als je deze stap overslaat, worden de knoppen automatisch geplaatst op de plek waar de script-code op de pagina is ingevoegd.
Gebruik je de variant Zwevende knop, dan hoef je deze instelling niet te gebruiken — die knop wordt altijd rechtsonder in beeld weergegeven.
Deze instelling vind je in Mijn Tolkie.
Ben je nog niet ingelogd? Ga naar mijn.tolkie.nl, open de instellingen voor jouw website en kies dan voor Algemene instellingen.
Goed om te weten
De meest betrouwbare manier om te bepalen waar de knoppen verschijnen, is door in de HTML-code classes te gebruiken.
Tolkie herkent de volgende classes:
tolkie-buttons-beforebegin: plaatst de knoppen vóór het elementtolkie-buttons-afterend: plaatst de knoppen ná het elementtolkie-buttons-afterbegin: plaatst de knoppen aan het begin van het elementtolkie-buttons-beforeend: plaatst de knoppen aan het einde van het element
Kun je deze classes niet gebruiken? Dan kun je ook een CSS-selector invullen in Mijn Tolkie. Hieronder lees je hoe dat werkt.
Voorbeeld
Stel dat je een pagina hebt met een h1-heading met de class article-header, en je wilt dat de knoppen onder deze heading verschijnen.
Doe dan het volgende:
Klik op ‘Element toevoegen’.
Vul in het veld ‘Selector’
h1.article-headerin. Dit verwijst naar heth1-element met de classarticle-header.Kies in het veld ‘Positie’ de optie
afterend. Dit zorgt ervoor dat de knoppen na heth1-element worden geplaatst.Klik op ‘Opslaan’.
De knoppen verschijnen nu onder de heading.
Hoe te kiezen
Bij Selector geef je aan waar de knoppen moeten komen (ten opzichte van welk element).
Bij Positie geef je aan waar de knoppen precies moeten verschijnen ten opzichte van dat element.
De mogelijke opties zijn:
beforebegin: plaatst de knoppen vóór het elementafterbegin: plaatst de knoppen aan het begin van het elementbeforeend: plaatst de knoppen aan het einde van het elementafterend: plaatst de knoppen ná het element
Tips
Gebruik stabiele selectors, bijvoorbeeld een container voor titels, navigatiebalk of werkbalk.
Als je selector meerdere elementen matcht, worden de knoppen geplaatst bij het eerste (bovenste) HTML-element.
Als je de knoppen binnen een element plaatst, controleer dan of dat element deel uitmaakt van de Hoofdelementen waarop de leeshulp actief is.
In dat geval kan de leeshulp ook op de knoppen zelf worden toegepast, wat hun werking kan verstoren.
Bijvoorbeeld: alsh1.article-headeronderdeel is van de Hoofdelementen, plaats de knoppen dan liever metbeforebeginofafterend, zodat ze buiten de heading vallen.
Kort samengevat:
Met Ankerpunten voor weergeven knoppen bepaal je precies waar de Tolkie-knoppen verschijnen op je website — via HTML-classes of CSS-selectors, op de plek die het beste bij je ontwerp past.
