Studio Editor: Knoppen toevoegen en aanpassen | Helpcentrum

Knoppen zijn een geweldige manier om bezoekers te betrekken bij een website. In de Studio Editor kun je normale of geanimeerde knoppen toevoegen en kiezen wat ze laten zien (tekst, een pictogram, of beide). Er zijn ook talloze ontwerp- en indelingopties, waardoor je volledige creatieve controle hebt.

Voorbeelden van de vele knopontwerpen die je kunt maken in de Studio Editor

Belangrijk:

Dit artikel gaat over het nieuwe knopelement in de Studio Editor. Klik hier voor de stappen om het vorige knopelement toe te voegen en ermee te werken.

Hoe weet ik welke knop ik heb?

Een knop toevoegen

Kies of je een gestylede (statische) knop of een geanimeerde knop wilt toevoegen. Ze hebben dezelfde ontwerpopties en je kunt een knop op elk moment van gestyled naar geanimeerd veranderen (en omgekeerd).

Om een knop toe te voegen:

Klik links in de editor op Elementen toevoegen .
Klik op Knop.
Klik op of sleep een optie onder Gestylede knoppen / Geanimeerde knoppen om deze aan de pagina toe te voegen.

Het tabblad knoppen is geopend in het paneel Elementen toevoegen. De cursor selecteert een knop.

Heb je wat inspiratie nodig?

Bekijk deze instructievideo's over knoppen:

Een knop instellen

Nadat je een knop hebt toegevoegd, stel je de widget in en kies je wat je wilt weergeven (tekst, een icon, of beide). Afhankelijk van wat de knop weergeeft, kun je ook de tekst en het icon instellen.

Om een knop in te stellen:

Selecteer de knop in je editor.
Klik op Instellingen.
Stel de knop in met de opties:
- Kies wat wordt weergegeven: Selecteer een optie en wijzig de instellingen:
  - Tekst en pictogram: Gebruik het Tekst-veld om te veranderen wat er staat, en klik op het Vervangen-pictogram om een ander pictogram te kiezen.
  - Alleen tekst: Bewerk de knoptekst onder Tekst.
  - Alleen pictogram: Klik op het Vervangen-pictogram om een ander pictogram voor de knop te kiezen.
- Linkt naar: Klik op het veld en stel de link in via het paneel:
  1. Selecteer een type link aan de linkerkant.
  2. Voeg de relevante informatie over de link toe.
  3. Klik op Klaar.
- Toegankelijke naam: Beschrijf de functie van de knop voor bezoekers die ondersteunende technologieën gebruiken.

Het instellingenpaneel is geopend voor een knop en toont de opties. De cursor klikt op het veld om de link in te stellen.

Let op:

Als je Niets selecteert onder Kies wat wordt weergegeven, is de knop leeg. Je kunt nog steeds een toegankelijke naam toevoegen en deze koppelen aan wat je maar wilt.

Een knop personaliseren

Gestylede knoppen bieden talloze personalisatie-opties, zodat je ze tot in het kleinste detail kunt ontwerpen. Verander de tekst en het pictogram om ze bij de gewenste widget te laten passen, kies hoe de twee moeten worden geordend, stel een kleurverloop of een afbeelding in als achtergrond, en nog veel meer.

Om een gestylede knop te personaliseren:

Selecteer de betreffende knop.
Kies wat je wilt personaliseren:

Pictogram-animaties toevoegen

De knop ontwerpen

De indeling van de knop aanpassen