Te lange tekst op een pagina? Dan is het handig om gebruik te maken van de ‘Lees meer’ functie. Er zijn verschillende manieren waarop je met Elementor (Pro) de ‘Lees meer’ functie kunt toevoegen. Ik zet ze hieronder even op een rij:
1. Lees meer knop posts widgets
De lees meer knop zie je vaak op blog- of productpagina’s. Je start met een korte intro waarmee je de bezoeker triggert om op de lees meer knop te klikken. Wanneer je gebruik maakt van de Elementor Pro posts widget, heb je standaard de optie om een ‘Read more’ knop toe te voegen. Ook kun je de tekstlengte van de samenvatting aangeven. De Lees meer knop leidt de bezoeker dan naar de pagina waar meer informatie te vinden is.
Hieronder zie je de instellingen in de post widget voor ‘Lees verder’. Je kunt hier ook een andere tekst invoeren. De button kun je geheel in eigen stijl opmaken onder het tabblad ‘Stijl’.
2. Unfold widget (add-on)
Wil je de tekst in hetzelfde tekstblok weergeven, maar is de tekst te lang of oogt het mooi in het algehele design? Elementor Pro biedt hiervoor (nog) geen standaard widget, maar er zijn wel add-ons beschikbaar waarmee je dit kunt doen. Je zoekt dan de ‘Unfold’ widget. Zelf maken we gebruik van de unfold widget van JetTricks.
Hieronder zie je de instellingen die je kunt gebruiken voor de unfold widget:
3. Popup toggle (voor meer dan alleen tekst)
Wil je meer dan alleen tekst onder de ‘Lees meer’ knop tonen? Dan kun je ook gebruik maken van de popup toggle functie van Elementor Pro. Je volgt dan deze stappen:
1. Maak een popup template met de content die je wilt tonen onder de lees meer knop
Dit doe je via Templates -> Popups. Kies vervolgens voor ‘Nieuwe toevoegen’.
2. Voeg een button toe onder de tekst waar je het template wilt tonen
3. Klik op ‘Dynamische content’ en kies voor Popup
4. Kies vervolgens voor ‘Toggle content’ en selecteer de popup die je zojuist hebt gemaakt
Popups maken met Elementor? Lees dan dit artikel
4. Tekst op andere pagina of plek
Tot slot kun je natuurlijk ook gewoon een button onder een tekst plaatsen met daarin een link naar de pagina waar meer informatie te vinden is. Ook kun je met een anchorlink verwijzen naar een andere deel op de pagina waar meer informatie te vinden is.
Dit waren de vier manieren om een ‘Lees meer’ functie te gebruiken met Elementor. Heb jij nog andere ideeën? We voegen ze graag toe!
2 Responses
Beste Sanne, ik wil graag een Read More add-on toevoegen aan mijn Site. Ben al de hele dag aan het zoeken maar kan geen simpele vinden. Ik wil voor alleen deze Add-on niet betalen want ik vind dat dit in Elementor Pro hoort. Ik wil alleen de tekst in het zelfde blok vermeerderen. Weet jij nog wat?
Hoi Fulco, ik ben het met je eens dat dit eigenlijk een standaard functie in Elementor zou moeten zijn. Wie weet komt dat nog :-). Ben je zelf een beetje handig met css en javascript? Dan zou je ook eens dit kunnen proberen. Als je niet met code wilt werkt werken zou je ook de Wisselen widget kunnen gebruiken. Dan geef je een item de titel ‘lees meer’ (en als ie actief is, wijzig je de kleur naar de achtergrondkleur van je site zodat de tekst onleesbaar wordt). Maar persoonlijk zou ik het niet zo snel op die manier gebruiken. Een dag zoeken is mij een plugin van 15 dollar meer dan waard 😉
Succes!