Tutorial: lees meer knop met openklapper

Demo

Het eindresultaat waar we naar toe werken in deze demo is weergegeven in een demo:

Voeg een knop toe

De eerste stap is om een knop toe te voegen aan de website waarop bezoekers kunnen klikken als ze meer willen lezen. Om een knop toe te voegen:

  1. Klik op de plusknop in de linkeronderhoek
  2. Open de categorie "navigatie"
  3. Klik op het type knop dat je toe wilt voegen (hou je muisknop niet ingedrukt)
  4. Beweeg je muis naar de positie waaraan je de knop toe wilt voegen
  5. Klik

Meer gedetailleerde beschrijving van het toevoegen van elementen aan je website in de handleiding over het toevoegen van elementen.

Schakel de link uit

Klik nu op de nieuwe knop om deze te bewerken. Open de tab voor eigenschappen. Verander de URL in # (zie afbeelding). Door de URL in te stellen op # vertel je de browser om op deze pagina te blijven wanneer erop wordt geklikt.

Meer over het bewerken van eigenschappen van een element in de handleiding over het bewerken van eigenschappen.

Voeg de tekst toe

De volgende stap is om te tekst toe te voegen die getooond moet worden als op de knop wordt geklikt. Het proces lijkt op het toevoegen van een knop, maar nu selecteren we het "opgemaakte tekst" -element uit de categorie "inhoud".

Voeg de tekst toe aan de positie waarop je wilt dat deze verschijnt wanneer op de knop wordt geklikt.

Verberg de tekst

Terwijl je het tekst element nog hebt geselecteerd (of selecteer het opnieuw) klik je op het tabblad zichtbaarheid. Selecteer nu de optie "verbergen voor actie" (zie afbeelding). Dit vertelt de website de tekst te verbergen, maar zorg ervoor dat deze weer zichtbaar kan worden gemaakt wanneer deze wordt getarget door een actie. Wanneer je op deze optie klikt, verdwijnt de tekst van de pagina.

Meer over het instellen van de zichtbaarheid van een element in de handleiding over het tabblad zichtbaarheid.

Stel de actie in

Het enige dat overblijft is om de actie in te stellen waardoor de tekst weer tevoorschijn komt. Om dit voor elkaar te krijgen:

  • Selecteer het knopelement
  • Klik op het tabblad acties
  • Selecteer als actie "als erop geklikt wordt"
  • Selecteer als doel het tekstelement dat u hebt toegevoegd
  • Selecteer als actie "Weergave aan / uit"

Meer over het instellen van acties in de handleiding over het instellen van acties.

Klik op "Stel in" en je bent klaar. Log uit de front-endeditor om je nieuwe creatie te testen.