Wix Editor: Een lightbox aanpassen
Leestijd 7 minuten
Pas je lightbox zodat deze er precies zo uit ziet als jij wilt. Je kunt een overlay kiezen om de pagina rond de lightbox te bedekken, de positie van de lightbox instellen en de achtergrond wijzigen om een ontwerp te maken dat uniek is voor jouw merk.
In dit artikel lees je hoe je:
De indeling van een lightbox aanpassen
Stel in waar de lightbox op de pagina verschijnt. Je kunt een hoek van de pagina kiezen en de afstand tot de randen van het scherm aanpassen.
Om de indeling voor je lightbox te kiezen:
- Open de betreffende lightbox vanuit het Menu's en pagina's-paneel.
- Klik op de lightbox.
- Klik op het Indeling-pictogram
. - Kies hoe je de indeling wilt aanpassen:
- Positie: Kies de positie van je lightbox op de pagina.
- Horizontale verschuiving: Verplaats de lightbox naar links of rechts.
- Verticale verschuiving: Verplaats de lightbox omhoog of omlaag.
De overlay van de lightbox wijzigen
Een overlay is de ruimte rond de lightbox die de rest van je website afschermt. Dit helpt bezoekers zich te concentreren op de boodschap van je lightbox. Je kunt een kleur, afbeelding of video-achtergrond kiezen voor je overlay en deze naar wens aanpassen.
Om de overlay te wijzigen:
- Open de betreffende lightbox vanuit het Menu's en pagina's-paneel.
- Klik op de overlay (de ruimte rond je lightbox).
- Klik op Achtergrond overlay wijzigen.
- Kies het type overlay dat je op je lightbox wilt:
- Kleur of kleurovergang: Klik op Kleur om een kleur te selecteren uit de kleurenkiezer of voeg een kleurovergang toe en pas deze aan. Klik hier om te lezen hoe je kleurovergangen toevoegt en aanpast
- Afbeelding: Selecteer je eigen afbeelding, een van Wix of Shutterstock.
- Video: Selecteer een gratis Wix-video of upload je eigen video.
- (Optioneel) Klik op Instellingen om de overlay naar wens aan te passen.
Tip:
We raden je aan om je overlay enigszins transparant te maken, zodat je bezoekers de pagina achter de lightbox nog steeds kunnen zien, maar begrijpen dat deze is afgeschermd.
Let op:
- Je kunt je lightbox-overlay niet bewerken op de mobiele versie van je website.
- Als je een kleur- of afbeeldingsoverlay toevoegt op desktop, wordt dit automatisch toegepast op je mobiele website. Als je echter een video-overlay toevoegt, wordt deze geconverteerd naar een stilstaand beeld van de video op de mobiele versie van je website.
De achtergrond van de lightbox instellen
Kies of je een kleur, afbeelding of video-achtergrond voor je lightbox wilt hebben. Afhankelijk van het type dat je kiest, kun je ook instellingen als de zichtbaarheid en de schaal aanpassen.
Om een achtergrond voor je lightbox te kiezen:
- Open de betreffende lightbox vanuit het Menu's en pagina's-paneel.
- Klik op de lightbox.
- Klik op het Ontwerp-pictogram
. - Klik op het type achtergrond dat je voor je lightbox wilt:
- Kleur of Kleurovergang: Klik op Kleur om een kleur te selecteren uit de kleurenkiezer of voeg een kleurovergang toe en pas deze aan.
- Afbeelding: Selecteer je eigen afbeelding, een van Wix of Shutterstock.
- Video: Selecteer een gratis Wix-video of upload je eigen video.
- (Optioneel) Klik op Instellingen om de overlay naar wens aan te passen.
De Sluiten-knop van de lightbox aanpassen
Pas het uiterlijk en de indeling aan van de knop waar bezoekers op klikken om je lightbox te sluiten. Je kunt de tekst kiezen, de uitlijning van de knoptekst instellen, en het ontwerp aanpassen voor de standaard en aanwijs-weergave om het op te laten vallen.
Om de knoptekst te bewerken en uit te lijnen:
- Open de betreffende lightbox vanuit het Menu's en pagina's-paneel.
- Klik op de knop.
- Wijzig de tekst die op de knop verschijnt:
- Klik op Tekst wijzigen.
- Voer de tekst in het veld in.
- Druk op Enter op je toetsenbord.
- Pas de tekstuitlijning op de knop aan:
- Klik op het Indeling-pictogram
.
- Kies hoe de tekst wordt uitgelijnd: links, in het midden of rechts van de knop.
- Klik op het Indeling-pictogram
Om de Sluiten-knop van de lightbox te ontwerpen:
- Open de betreffende lightbox vanuit het Menu's en pagina's-paneel.
- Klik op de knop.
- Klik op het Ontwerp-pictogram
.
- Kies een ontwerp en klik op Ontwerp aanpassen om verdere wijzigingen in het ontwerp aan te brengen.
- Klik bovenaan op een voorinstelling.
- Selecteer de status waarvoor je het ontwerp wilt aanpassen:
- Standaard: Hoe de knop eruitziet voordat een bezoeker er iets mee doet.
- Aanwijzen: Hoe de knop eruitziet wanneer een gebruiker deze aanwijst met de cursor.
- Kies wat je aan wilt passen:
- Kleur en opvulling:
: Kies een achtergrondkleur voor de knop en pas de zichtbaarheid ervan aan.
- Rand
: Voeg randen toe aan de knop om een contrast te creëren met je lightbox. Kies een kleur en stel de breedte zo groot of zo klein in als je wilt. - Hoeken
: Kies hoe je wilt dat de hoeken van je knop eruit zien. Je kunt elke hoek anders instellen en ze ronder of vierkanter maken. - Schaduw
: Voeg schaduwen toe aan je knop voor een cool 3D-effect. Je kunt de grootte, zichtbaarheid, hoek en meer instellen om het meer impact te geven. - Tekst
: Pas de tekst van de knop aan met instellingen zoals lettertype, grootte en afstand. Je kunt ook opmaak toevoegen zoals vet en cursief, en de kleur kiezen.
Let op:
De beschikbare aanpassingsopties zijn afhankelijk van:
- De voorinstelling die je voor het ontwerp kiest
- De status waarvoor je kiest om te ontwerpen (standaard of aanwijzen).
Het X-pictogram aanpassen
Als je een X-pictogram (lightbox sluiten) hebt ingeschakeld, pas dan het uiterlijk ervan aan aan je lightbox en overlay. Kies uit een reeks ontwerpen en pas de kleur, zichtbaarheid en rand aan.
Om het X-pictogram aan te passen:
- Open de relevante lightbox in het Menu's en pagina's-paneel.
- Klik op het X-pictogram.
- Klik op het Ontwerp-pictogram
- Kies hoe je je X-pictogram wilt aanpassen:
- Selecteer een nieuw ontwerp: Klik op een voorinstelling in het paneel om een nieuw ontwerp voor het pictogram in te stellen.
- Pas het pictogram aan: Klik op Ontwerp aanpassen en bewerk het pictogram zoals jij wilt:
- Kleur en opvulling: Selecteer de kleur voor het pictogram in de kleurenkiezer en gebruik de schuifregelaar om het meer of minder zichtbaar te maken.
- Rand: Kies een kleur voor de rand van het pictogram en stel de breedte in (in pixels).
Vond je dit artikel nuttig?
|