Een pop-upcampagne bestaat uit twee delen: de pop-up zelf en een optionele teaser. De teaser is een kleine banner op je site, zoals "Draai en win 🎁", die de pop-up opent als erop wordt geklikt.
Type en positie van de pop-up
Open in de editor Plaatsing onder Lay-out:
- Type: een standaard pop-up, een balk boven of onder in het scherm, een slider in de hoek, of een volledige pagina. Balk, slider en volledige pagina horen bij de hogere abonnementen.
- Uitlijning: waar de pop-up staat. Balken kunnen boven of onder staan, sliders links of rechts, en standaard pop-ups overal op een raster van 3 × 3.
De eerste keer dat je een nieuwe pop-up opent, vraagt Scratcher op welk domein hij wordt getoond. Je kunt dit later wijzigen onder Domein.
De pop-up stylen
Klik op Pop-upinstellingen boven de pagina, of klik op de rand van de pop-up. Op het tabblad Stijlen:
- Pop-up: Achtergrond, Achtergrondoverlay (de gedimde laag achter de pop-up), Rand, Grootte, Vorm, Uitlijning van de inhoud en Marge.
- Sluitknop: de Achtergrond, de kleur van het Icoon, de Grootte, de hoek (Uitlijning) en de Marge.
Kies op het tabblad Effecten hoe de pop-up opent en sluit, bijvoorbeeld Vervagen of Schuiven.
Pop-up-add-ons:
- Teaser verbergen bij sluiten: verberg ook de teaser als iemand de pop-up sluit.
- Verbergen na verzenden van formulier: toon de pop-up niet opnieuw aan bezoekers die zich er al in hebben aangemeld.
De teaser
Onder Flow zet je met de rij Teaser de teaser aan en uit. Klik op Instellingen in het menu ervan om hem in te stellen:
- Actie: Pop-up tonen, Link of Geen.
- Verbergen op desktop, Verbergen op tablet, Verbergen op mobiel.
- Stijlen: de Achtergrond, Rand, Grootte, Vorm, hoek (Uitlijning) en Marge van de teaser, en een eigen sluitknop.
De teaser verschijnt zodra de pagina is geladen; de triggers onder Weergave gelden alleen voor de pop-up. Ontwerp de teaser net als een pagina, en sla hem op met Teaser opslaan als template om hem te hergebruiken.
Achtergrondafbeelding in pop-ups
Pop-ups hebben een element Afbeeldingsachtergrond dat één kant van de pop-up vult met een afbeelding. Stel de Hoogte op mobiel in om te bepalen hoeveel van het scherm hij op telefoons inneemt.
Een pop-up openen met je eigen knop
Met de trigger-add-on Kliktrigger opent de pop-up als iemand op een element op je website klikt. Vul de CSS-selector van het element in, bijvoorbeeld .open-competition. Vraag je webontwikkelaar om hulp als je het niet zeker weet.