Wix Editor: Een pictogramknop toevoegen en instellen

Leestijd 6 minuten
Pictogramknoppen zijn een leuke, visuele manier om bezoekers op je website te helpen navigeren. Om er zeker van te zijn dat ze weten wat je pictogramknop doet, kun je een informatieve tooltip toevoegen die verschijnt als je er met je muisaanwijzer overheen beweegt.
Stel de link op je pictogramknop in en pas het pictogram aan dat wordt weergegeven voor elk van de statussen: standaard en aanwijzen.

Stap 1 | Voeg je pictogramknop toe

Kies om te beginnen een pictogramknop in het Elementen toevoegen-paneel en sleep deze naar je pagina. Er is een scala aan ontwerpen om uit te kiezen, afhankelijk van de actie en de gewenste look. 

Om een pictogramknop aan je website toe te voegen:

  1. Ga naar je Editor.
  2. Klik links in de Editor op Elementen toevoegen.
  3. Klik op Knop.
  4. Klik op Pictogramknoppen.
  5. Klik of sleep de knop om deze aan je pagina toe te voegen.
Het 'Toevoegen'-paneel in de Editor. Het Knoppen-tabblad is geselecteerd en de cursor wijst de pictogramknoppen aan.

Stap 2 | Stel de tekst en het pictogram van je pictogramknop in

Stel in wat je op je knop wilt weergeven. Je kunt een pictogram, tekst of beide weergeven.
Tekst en pictogrammen die op knoppen worden weergegeven, moeten een duidelijke oproep tot actie bevatten en bezoekers laten weten waarnaar ze worden doorverwezen.

Om de tekst en het pictogram van de knop in te stellen:

  1. Klik op je pictogramknop.
  2. Klik op Instellingen.
  3. Klik op Kies wat wordt weergegeven en selecteer een optie in de dropdown: 
    • Tekst en pictogram: Geef zowel tekst als een pictogram weer op de knop. Stel de volgende opties in:
      • Weer te geven tekst: Voer de tekst in die je op de knop wilt weergeven.
      • Kies een pictogram: Klik op het Vervangen-pictogramom een nieuw pictogram voor je knop te kiezen. Je kunt kiezen uit media die beschikbaar gemaakt is door Wix of je eigen media uploaden.
    • Alleen pictogram: Geef alleen een pictogram op de knop weer. Stel de volgende opties in:
      • Kies een pictogram: Klik op het Vervangen-pictogramom een nieuw pictogram voor je knop te kiezen. Je kunt kiezen uit media die beschikbaar gemaakt is door Wix of je eigen media uploaden.
      • Wat is de alt-tekst?: Geef een alt-tekstbeschrijving van het pictogram.
    • Alleen tekst: Geef alleen tekst op de knop weer. Voer de tekst die je op de knop weer wilt geven in onder Weer te geven tekst?
    • Niets: Maak een transparante knop die geen tekst of pictogram weergeeft. Voer een alt-tekstbeschrijving van de knop in onder Wat is de alt-tekst?
Het paneel met knopinstellingen. Het is ingesteld om zowel tekst als een pictogram weer te geven.

Voeg een link toe aan je knop om je websitebezoekers naar de relevante locatie te leiden. Je kunt naar veel verschillende plaatsen linken, waaronder een pagina op je website, een extern webadres, een document of e-mail.

Om een link aan je knop toe te voegen:

  1. Klik op je pictogramknop.
  2. Klik op het Link-pictogram.
  3. Selecteer links een linktype.
  4. Voeg, afhankelijk van het geselecteerde linktype, de relevante informatie toe.
  5. Klik op Klaar.
Let op:
Als je URL-link een niet-ondersteund teken bevat, wordt het volgende foutbericht weergegeven: Controleer de URL en probeer het opnieuw. Om de validatie te omzeilen, kun je een dienst gebruiken voor het inkorten van links, zoals bit.ly of goo.gl
Het linkpaneel in de Editor. Als linktype is een e-mail gekozen, en de relevante informatie is ingevoerd.
Tip:
Lees meer over de soorten links. die je kunt toevoegen.

Stap 4 | Pas je pictogramknop aan

Nadat je een link aan je pictogramknop hebt toegevoegd, kun je deze naar wens aanpassen.Je kunt de achtergrondvulling, het ontwerp van de tekst en nog veel meer kiezen.

Om je pictogramknop aan te passen:

  1. Klik op je pictogramknop.
  2. Klik op het Ontwerp-pictogram.
  3. Selecteer een ander vooraf ingesteld ontwerp of klik op Ontwerp aanpassen om het bestaande ontwerp aan te passen.
  4. Kies onder Ontwerp aanpassen de knopstatus uit het dropdownmenu.
    • Standaard: Hoe de knop wordt weergegeven voordat bezoekers er interactie mee hebben.
    • Aanwijzen: Hoe de knop wordt weergegeven wanneer je er met je muisaanwijzer overheen beweegt.
  5. Pas het ontwerp aan vanaf de volgende tabbladen:
    • Achtergrond: Pas de opvulling van je knop aan. Lees meer
    • Tekst: Pas het ontwerp van de knoptekst aan. Lees meer
    • Randen: Bewerk de breedte en het ontwerp van je randen. Lees meer
    • Hoeken: Pas de straal van de hoeken van de knop aan. Lees meer
    • Schaduwen: Voeg een schaduw toe aan de knop en pas deze aan. Lees meer
    • Indeling: Selecteer wat je op je knop wilt weergeven en pas de uitlijning aan. Lees meer
    • Pictogram: Bewerk het uiterlijk van het pictogram op je knop. Lees meer
Het ontwerppaneel in de Editor. De standaardweergave is geselecteerd en de cursor staat op de Achtergrondoptie.

Vond je dit artikel nuttig?

|