> ## Documentation Index > Fetch the complete documentation index at: https://docs.landerlab.io/llms.txt > Use this file to discover all available pages before exploring further. # Pop-ups über die Popup-API steuern > Öffnen, schließen und schalten Sie LanderLab-Pop-ups über Schaltflächen, Links und Custom Code. Vollständige Referenz der JavaScript-API und der No-Code-Links. Mit der Popup-API steuern Sie jedes Pop-up per Code, statt sich nur auf die integrierten Trigger (Seitenaufruf, Verzögerung, Scrollen, Exit-Intent) zu verlassen. Rufen Sie `window.llPopupsApi` aus einem Custom-Code-Element oder einem beliebigen Skript auf, um ein Pop-up über eine Schaltfläche zu öffnen, es nach dem Absenden eines Formulars zu schließen oder Pop-ups in Ihre eigenen Integrationen einzubinden. **Verwenden Sie die ID des Pop-ups, nicht seinen Namen.** Alles in der API spricht ein Pop-up über seine `id` an. Der **Name** des Pop-ups (die lesbare Bezeichnung im Editor) sind lediglich Metadaten für Analysen und Anzeige – er wird nie zur Adressierung genutzt. Sprechen Sie ein Pop-up über den Namen an, passiert nichts. *** ## Schritt 1 – Das Pop-up vorbereiten Bevor Sie ein Pop-up per Code steuern können, richten Sie es so ein, dass es Ihren Triggern nicht in die Quere kommt, und notieren Sie sich eine ID, auf die Sie verweisen können. Setzen Sie im Tab **Popup** der rechten Seitenleiste den **Trigger** auf **Manual** (nur per Schaltfläche). Das Pop-up öffnet sich dann nie automatisch, sondern nur, wenn Ihr Link oder Skript es öffnet. Sie **müssen** Manual nicht verwenden. Die API funktioniert unabhängig vom Trigger bei jedem Pop-up. Manual stellt lediglich sicher, dass das Pop-up geschlossen bleibt, bis Sie es selbst öffnen. Jedes Pop-up hat bereits eine eindeutige ID. Um sie zu finden, öffnen Sie in der linken Seitenleiste das Panel **Popups**, klicken Sie neben Ihrem Pop-up auf die **drei Punkte (Aktionen)** und wählen Sie **Copy ID**. Fügen Sie diesen Wert überall dort ein, wo die API die Popup-ID verlangt. Image 35 *** ## Die JavaScript-API (`window.llPopupsApi`) Rufen Sie das globale Objekt `window.llPopupsApi` auf, um ein Pop-up zu öffnen, zu schließen oder umzuschalten – bei einem eigenen Event, nach einer selbst gesteuerten Verzögerung oder aus einem anderen Skript heraus. Fügen Sie den Code in ein **Custom-Code**-Element auf Ihrer Seite ein. ```javascript theme={null} // Ein bestimmtes Pop-up öffnen window.llPopupsApi.open('promo-popup-id'); ``` ### Adressierung: Die ID ist optional Jede Methode nimmt eine **optionale** Popup-ID entgegen: * **ID übergeben** → die Aktion betrifft genau dieses Pop-up. * **ID weglassen** → die Aktion betrifft **alle Pop-ups** auf der Seite. ```javascript theme={null} window.llPopupsApi.close('promo-popup-id'); // ein Pop-up schließen window.llPopupsApi.close(); // alle Pop-ups der Seite schließen ``` ### Methoden | Methode | Was sie bewirkt | | -------------- | -------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | | `open(id?)` | Erzwingt das Öffnen des Pop-ups. Öffnet es auch dann erneut, wenn der Besucher es zuvor in der Sitzung geschlossen hat (Ihr expliziter Aufruf hat Vorrang). | | `close(id?)` | Schließt das Pop-up samt Animation. Setzt **kein** „Stay Dismissed“-Cookie – das Pop-up kann erneut ausgelöst werden. | | `dismiss(id?)` | Schließt das Pop-up **und** sperrt es: setzt das 30-Tage-Cookie, wenn **Stay Dismissed** aktiv ist, oder das Sitzungs-Flag, wenn **Show Once** aktiv ist. Genau das tut die eingebaute Schließen-Schaltfläche. | | `toggle(id?)` | Öffnet das Pop-up, wenn es geschlossen ist, und schließt es, wenn es geöffnet ist. (Das Öffnen per Toggle erzwingt das Öffnen, genau wie `open`.) | | `get(id?)` | Gibt das HTML-Element des Pop-ups zurück, wenn Sie eine ID übergeben (oder `null`, wenn keines gefunden wurde), oder ein Array aller Popup-Elemente, wenn Sie die ID weglassen. | **`close` und `dismiss` im Vergleich.** `close()` ist ein temporäres Schließen – automatische Trigger wie Exit-Intent können weiterhin auslösen. `dismiss()` gilt dauerhaft für die Sitzung (und mit **Stay Dismissed** bis zu 30 Tage). Nutzen Sie `close()` für „vielleicht später“ und `dismiss()` für „nicht erneut anzeigen“. ### Beispiele ```javascript Über eine Schaltfläche öffnen theme={null} // Warten, bis die Seite bereit ist, bevor alles verdrahtet wird. // DOMContentLoaded stellt sicher, dass sowohl Ihre Schaltfläche als auch llPopupsApi existieren. document.addEventListener('DOMContentLoaded', function () { const button = document.getElementById('my-button'); button.addEventListener('click', function () { window.llPopupsApi.open('promo-popup-id'); }); }); ``` ```javascript Nach einer Verzögerung schließen theme={null} // Das Pop-up 5 Sekunden nach dem Öffnen automatisch schließen window.llPopupsApi.open('promo-popup-id'); setTimeout(function () { window.llPopupsApi.close('promo-popup-id'); }, 5000); ``` ```javascript Umschalten / alle schließen theme={null} // Ein einzelnes Pop-up umschalten window.llPopupsApi.toggle('promo-popup-id'); // Alle Pop-ups der Seite auf einmal schließen window.llPopupsApi.close(); ``` ```javascript Ein Popup-Element abrufen theme={null} // Eine ID übergeben, um ein Element zu erhalten (oder null, wenn keines gefunden wurde) const popup = window.llPopupsApi.get('promo-popup-id'); // Die ID weglassen, um ein Array aller Pop-ups der Seite zu erhalten const allPopups = window.llPopupsApi.get(); ``` *** ## Gut zu wissen * **Führen Sie Ihren Code erst aus, wenn die Seite bereit ist.** `window.llPopupsApi` existiert erst, sobald das Popup-Skript geladen wurde. Kapseln Sie Ihre Aufrufe in einen `DOMContentLoaded`-Listener – wie im Beispiel **Über eine Schaltfläche öffnen** oben –, damit die API beim Aufruf verfügbar ist. * **Vorschaumodus.** Auf Vorschau-URLs werden das „Stay Dismissed“-Cookie und das „Show Once“-Flag weder gelesen noch geschrieben, sodass das Pop-up beim Testen immer erscheint. * **Mit ESC schließen.** Ist **Close on ESC** für das Pop-up aktiviert, schließt die Taste Esc das oberste geöffnete Pop-up – ganz ohne Code. * **Öffnen hat Vorrang vor dem Schließen.** Ein Aufruf von `open()` öffnet ein Pop-up auch dann erneut, wenn ein Besucher es geschlossen hat. Die automatischen Trigger des Pop-ups respektieren die Schließung jedoch weiterhin. Nutzen Sie `dismiss()`, wenn Sie es wieder sperren möchten.