# Pop-ups

**Hoe je een popup maakt, ontwerpt en bouwt**

In deze gids leer je:

* [Hoe je een nieuwe popup maakt](#how-to-create-a-new-popup)
* [Waar je je popups kunt vinden](#where-to-find-your-popups)
* [Popup Builder: Hoe je een popup ontwerpt en bewerkt](#popup-builder-how-to-design-and-edit-a-popup)
* [Popup-instellingen: Hoe je de positie, naam en andere weergaveopties van een popup wijzigt/aanpast](#popup-settings-how-to-change-adjust-a-popup-position-name-and-other-display-options)
* [Hoe je selecteert op welke pagina's een popup moet verschijnen of zichtbaar moet zijn](#how-to-select-on-what-pages-a-popup-should-show-or-be-visible)

### Hoe je een nieuwe popup maakt <a href="#how-to-create-a-new-popup" id="how-to-create-a-new-popup"></a>

Om een nieuwe popup te maken, ga naar **Pagina's -> Nieuw toevoegen -> Popup**

<figure><img src="https://content.gitbook.com/content/e72ThyzkOdxFPyh3rXde/blobs/EJBaBkQhfjoJmtih6mD4/Group%201171280967.png" alt=""><figcaption></figcaption></figure>

Bij het toevoegen van een **popup**, heb je twee opties:

* **Vooraf gemaakte popup** – Selecteer een **bewerkbare template**, waarmee je snel kunt aanpassen.
* **Lege popup** – Begin vanaf nul met een lege popup, waardoor je volledige controle hebt over ontwerp en functionaliteit.

Deze flexibiliteit zorgt ervoor dat je popups kunt maken **geschikt voor je specifieke behoeften**, of het nu gaat om promoties, aankondigingen of engagementtools!

<figure><img src="https://content.gitbook.com/content/e72ThyzkOdxFPyh3rXde/blobs/wwZjq7ULWec2ZdVY8kHs/sdssads55.PNG" alt=""><figcaption></figcaption></figure>

### Waar je je popups kunt vinden

Om de **popups** die je hebt gemaakt te vinden en te beheren:

* **Ga naar Pagina's** – Toegang tot de **Pagina's & Popups** sectie.
* **Selecteer "Popups"** – Dit toont alle eerder gemaakte popups voor bewerking of activatie.

<figure><img src="https://content.gitbook.com/content/e72ThyzkOdxFPyh3rXde/blobs/54vqW5h5YeE35S6LqFOF/Group%201171280967%20(1).png" alt=""><figcaption></figcaption></figure>

### Popup Builder: Hoe je een popup ontwerpt en bewerkt

De popup builder ziet eruit en werkt precies zoals de normale paginabuilder.

<div align="left"><figure><img src="https://content.gitbook.com/content/e72ThyzkOdxFPyh3rXde/blobs/6QJiwYtHDB1HsY6jpB5S/sdsdasdasdaa.PNG" alt=""><figcaption></figcaption></figure></div>

Elke [widget](https://buildersupport.gitbook.io/help-docs/nl/platform/widgets), ongeacht het type, kan volledig worden gesleept in een popup-interface. Zodra hij in de popup is geplaatst, behoudt de widget al zijn functionaliteiten, waardoor het kan worden aangepast, herschikt en gepersonaliseerd zoals in de standaard paginabuilderomgeving.

Dit zorgt voor een naadloze en veelzijdige bewerkingservaring en geeft gebruikers de flexibiliteit om hun inhoud te optimaliseren en te personaliseren zonder functionele beperkingen of concessies.

<figure><img src="https://content.gitbook.com/content/e72ThyzkOdxFPyh3rXde/blobs/4fqZxJplJmeZNim7xkR6/Group%201171280967%20(2).png" alt=""><figcaption></figcaption></figure>

### Popup-instellingen: Hoe je de positie, naam en andere weergaveopties van een popup wijzigt/aanpast

Om de algemene instellingen voor de popup te openen, klik je ofwel op het "**Tandwielpictogram**" naast de pop-upnaam en selecteer je "**Instellingen tonen**" of open je de popup door op de naam te klikken en selecteer je "**Popup-instellingen**".

In de Popup-instellingen vind je de 6 beschikbare lay-outs voor de popup. Je kunt ermee spelen om degene te kiezen die je leuk vindt.

**Je kunt ook bewerken:**

* Popup-naam (Makkelijker de popup te vinden als je ernaar linkt)
* Opties voor wanneer de popup moet worden geactiveerd (als een knop/link klikken het niet activeert)
* Hoe vaak de popup moet worden getoond
* Ten slotte welke animatie er wordt getoond

<figure><img src="https://content.gitbook.com/content/e72ThyzkOdxFPyh3rXde/blobs/vCUjo1RM94FQWrsM85Eu/dsdf454.PNG" alt=""><figcaption></figcaption></figure>

### Hoe je selecteert op welke pagina's een popup moet verschijnen of zichtbaar moet zijn

Als de popup automatisch wordt geactiveerd, kun je selecteren op welke pagina's deze moet worden weergegeven.

Om te selecteren op welke pagina van je website een popup moet verschijnen, open je de popup en selecteer je de "**Toon op**" optie. Hier kun je selecteren op welke pagina je popup wordt weergegeven.

<figure><img src="https://content.gitbook.com/content/e72ThyzkOdxFPyh3rXde/blobs/zUnamZuAj155y29vnRRS/Group%201171280967%20(3).png" alt=""><figcaption></figcaption></figure>

Om de inhoud en lay-out van je popup te stijlen, klik je op de pop-upnaam om deze te openen.

Klik daarna op het penseel-"Stijl"-pictogram.

Dit opent het instellingenvenster voor de inhoudsindeling van de popup.

In de inhoudsindeling van de popup zie je de optie waar de afbeelding moet worden weergegeven. Als je de middelste optie selecteert, verschijnt er geen afbeelding.

**Je kunt ook aanpassen:**

* Achtergrondkleur voor de hele popup
* Kleur van de achtergrondoverlay onder de hele popup
* Kleur van de sluitknop
* Ten slotte de marge (padding) van het popupvenster

<figure><img src="https://content.gitbook.com/content/e72ThyzkOdxFPyh3rXde/blobs/JdA1XgrsUB5pcmkSjYjR/SDF554.PNG" alt=""><figcaption></figcaption></figure>
