Wix Helpcentrum
    Home
  1. Een website maken
  2. Editor X gebruiken
  3. Elementen toevoegen in Editor X
    4. Editor X: Knoppen toevoegen en aanpassen

Editor X: Knoppen toevoegen en aanpassen

Leestijd 9 minuten
Editor X schakelt over naar Wix Studio, ons nieuwe platform voor bedrijven en freelancers.Lees meer over Wix Studio
Knoppen zijn een ideale manier om bezoekers aan te moedigen om de acties uit te voeren die jij wilt. In Editor X kun je indien nodig knoppen toevoegen die tekst, een pictogram of beide tonen. Je hebt volledige controle over het ontwerp en de indeling, zodat je precies de look kunt creëren die je nodig hebt. 
In dit artikel lees je hoe je:

Een knop toevoegen

Wanneer je een nieuwe knop toevoegt, kun je een ontwerp kiezen uit twee categorieën: 
  • Basisknoppen: Deze knoppen geven alleen tekst weer en hebben een meer 'minimalistisch' uiterlijk.
  • Gestylde knoppen: Deze knoppen kunnen zowel tekst als pictogrammen weergeven en bieden geavanceerde aanpassingsopties (bijvoorbeeld afbeeldingsachtergronden, kleurovergangen en meer).

Om een knop toe te voegen:

  1. Klik linksboven in Editor X op Toevoegen.
  2. Klik op Knop.
  3. Blader door de ontwerpen en sleep een Basisknop of Gestylde knop naar je pagina.
Inspiratie nodig?
Bekijk deze tutorials voor knoppen:

Basisknoppen aanpassen

Nadat je een basisknop aan je website hebt toegevoegd, kun je de tekst aanpassen aan je wensen en kiezen waar de knop naartoe linkt.  Nadat dat is ingesteld, kun je beginnen met het aanpassen van het ontwerp. Kies een andere vulkleur, voeg schaduw toe en pas andere instellingen aan, zoals afstand en tekstopmaak.
Klik hieronder om te lezen hoe je de basisknoppen aanpast:

Gestylde knoppen aanpassen

Gestylde knoppen bieden talloze aanpassingsmogelijkheden, zodat je ze tot in het kleinste detail kunt ontwerpen. Wijzig de tekst en het pictogram voor de gewenste actie, kies hoe de twee moeten worden gerangschikt, stel een overgang of een afbeelding in als achtergrond en nog veel meer.
Klik hieronder om te lezen hoe je gestylde knoppen kunt aanpassen:

Ontwerpwoordenlijst

Optie
Uitleg
Hoe te gebruiken
Achtergrondvullingen
Voeg verschillende vullingen toe, zoals kleuren, afbeeldingen, patronen en kleurverlopen om prachtige en kleurrijke effecten op je knop te creëren. 
  • Klik op het kleurvak voor elke laag en kies het opvullingstype en sleep vervolgens de schuifregelaar om de dekking van de opvullaag te wijzigen.
  • Wijzig de volgorde van de opvullagen door ze omhoog en omlaag te slepen. 
Randen
Pas de rand van de knop aan om deze te laten opvallen. Pas alle kanten van de knop samen of  elke kant afzonderlijk aan door op het pictogram voor vergrendelen en ontgrendelen te klikken. 
  • Klik op het Breedte-veld en voer de pixelbreedte in of pas de schuifregelaar aan.
  • Klik op de Stijl-dropdown en selecteer de randstijl.
  • Klik op het Opvulkleur-vak en selecteer de randkleur en gebruik de schuifregelaar om de dekking aan te passen. 
Hoeken
Wijzig de hoeken van je knop om ze ronder of vierkanter te maken. Wijzig de grootte van alle hoeken samen of pas elke hoek afzonderlijk aan door op het pictogram voor vergrendelen en ontgrendelen te klikken. 
Klik op het pixelveld in een hoek en voer het aantal pixels in dat je erop wilt toepassen.
Schaduwen
Voeg schaduwlagen toe aan je knop en pas de kleur, grootte en meer voor elke laag aan.
  • Klik op het kleurvak voor elke schaduwlaag en pas de kleur, het type, de hoek, de grootte, de afstand en de vervaging aan. Sleep vervolgens de schuifregelaar om de dekking van de schaduw te wijzigen.
  • Wijzig de volgorde van de schaduwlagen door ze omhoog en omlaag te slepen. 

Bij gebruik van een uploadknop:
  • Klik op de schakelaar om in te schakelen.
  • Gebruik de schuifregelaars om de hoek, afstand, grootte en vervaging te bewerken. Gebruik vervolgens de schuifregelaar en het kleurvak om de dekking en kleur te bewerken.
Indeling

Wijzig de indeling van je knop.
  • Klik op de Kies wat je wilt weergeven-dropdown en kies of je de tekst, het pictogram of beide wilt weergeven.
  • Selecteer de uitlijning, positie en afstand van de tekst en/of het pictogram (indien relevant).
  • Stel de opvulling rond de tekst en/of het pictogram in.

Opties voor tekstopmaak

Optie
Uitleg
Hoe te gebruiken
Tekst weergeven
Toon of verberg tekst op je knop.
Klik op de schakelaar om tekst op je knop weer te geven of te verbergen.
Thema
Selecteer het thema voor je knoptekst.
Selecteer een tekstthema in het dropdownmenu.
Lettertypen
Kies het lettertype voor je knoptekst.
Klik op het dropdownmenu en selecteer een lettertype.
Tekstgrootte
Wijzig de grootte van de tekst op je knop.
Sleep de schuifregelaar om de lettergrootte te vergroten of te verkleinen, of voer een waarde in.
Tekstopmaak
Pas opmaak toe op je tekst. 
  • Maak je tekst op met behulp van de opties: vet, cursief, onderstrepen, doorhalen, kleuren, hoofdletters en tekstrichting en uitlijning.
Tekenafstand
Wijzig de afstand tussen de teksttekens.
Sleep de schuifregelaar om de afstand te vergroten of te verkleinen of voer een waarde in.
Schaduwen
Maak schaduwen voor je tekst. Je kunt meer dan één schaduw hebben.
Klik op Schaduw toevoegen om een nieuwe toe te voegen. Klik op het Schaduw aanpassen-pictogram om het te ontwerpen.

Ontwerpopties voor pictogrammen

Optie
Uitleg
Hoe te gebruiken
Pictogram weergeven
Toon of verberg een pictogram op je knop.
Klik op de schakelaar om het pictogram op je knop weer te geven of te verbergen.
Grootte
Wijzig de grootte van je pictogram.
Sleep de schuifregelaar om je pictogram te vergroten of te verkleinen of voer een waarde in.
Kleur
Wijzig de kleur van het pictogram.
Klik op het kleurvak en selecteer een kleur.
Rotatie
Pas de rotatie van het pictogram aan.
Sleep de greep om de rotatie van het pictogram aan te passen of voer de graden in het tekstvak in.

Vond je dit artikel nuttig?

|
In dit artikel
  • Een knop toevoegen
  • Basisknoppen aanpassen
  • Gestylde knoppen aanpassen
  • Ontwerpwoordenlijst
  • Opties voor tekstopmaak
  • Ontwerpopties voor pictogrammen