Sticky social media buttons maken met Elementor

Sticky social media buttons op je website plaatsen? Je wilt bijvoorbeeld dat de social media deelknoppen zichtbaar blijven bij het scrollen. Dit maakt de kans groter dat je bezoeker gebruik maakt van deze knoppen. In dit artikel leg ik je uit hoe je de social media knoppen sticky maakt.

Social media deelknoppen toevoegen

Om te te beginnen voeg je eerst de social media knoppen toen aan de pagina of het single (blog) template. In dit artikel lees je hoe je social media buttons toevoegt.

Social media buttons sticky maken

Als je de deelknoppen hebt toegevoegd met behulp van de ‘Share buttons widget’, maak je de widget sticky. Dit werkt als volgt:

• Ga naar het tabblad ‘Geavanceerd’
• Open de tab ‘Bewegings effecten’

Je ziet in het voorbeeld hieronder dat de bewegingseffecten voor Sticky uit staan.

Top of bottom sticky

Je kunt vervolgens kiezen om de buttons ‘Top’ of ‘Bottom’ sticky te maken. Kies één van de twee en scroll de pagina heen en weer. Je ziet dat het sticky effect direct wordt toegepast.

Sticky in- of uitschakelen voor mobiel

Wil je de buttons liever niet sticky op mobiele apparaten? Dan kun je deze gewoon wegklikken in het vak ‘Sticky on’.

Offset instellen

Met de offset stel je in op welke hoogte (in px) op het beeldscherm de buttons sticky moeten zijn. Als je bijvoorbeeld de buttons ‘Top’ sticky maakt, dan wil je niet dat ze over de header vallen. Het is handig om hier dan de offset in te stellen, zodat de buttons onder de header sticky blijven.

Stay in column

Met de optie ‘Stay in column’ zorg je ervoor dat de social media buttons in dezelfde kolom blijven en dus niet over andere content op die pagina valt (bijvoorbeeld over de footer).

Stel de opties naar wens in en test of het werkt.

Sticky social media buttons maken in de sidebar? Dit werkt bijna op dezelfde manier. Check deze blog over een sticky sidebar maken.