> For the complete documentation index, see [llms.txt](https://one-loop.gitbook.io/help/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://one-loop.gitbook.io/help/plattform/one-loop-plattform/websites-und-leadgewinnung/websites-und-funnels/countdown-timer-auf-externen-websites-einbetten.md). # Countdown-Timer auf externen Websites einbetten Bette einen gespeicherten Countdown mit dem bereitgestellten Code in eine externe Website ein, wähle die passende Zeitlogik und prüfe die Anzeige vor dem Einsatz zuverlässig. ## Welches Problem diese Funktion löst Ein Countdown macht eine zeitliche Frist auf einer externen Website sichtbar, etwa den Beginn eines Webinars, den Anmeldeschluss für einen Termin oder den Ablauf einer Aktion. Dafür kopierst du nach dem Erstellen des Timers einen vorbereiteten Code in den HTML- oder Codebereich der anderen Website. Die Funktion erledigt dabei zwei Dinge: Sie stellt den bereits eingerichteten Timer außerhalb des Standorts dar und übernimmt seine gewählte Darstellung. Der Code ist für Seiten gedacht, die einen eigenen HTML- oder Codebereich anbieten. Für Seiten, die du direkt im Standort bearbeitest, setzt du stattdessen das vorhandene Countdown-Element im Editor ein. Das ist wartungsärmer, weil kein Code übertragen werden muss. ## Vor dem Start Du brauchst: * einen gespeicherten Countdown mit festgelegter Zeitlogik und Gestaltung; * Zugriff auf den HTML- oder Codebereich der externen Website; * die Berechtigung, diese Website zu veröffentlichen; * einen konkreten Testzeitpunkt, an dem du den Ablauf kontrollieren kannst. Entscheide vor dem Kopieren, ob alle Besucher dieselbe Frist sehen sollen oder ob jede Person eine eigene, relative Frist erhalten soll. Auf einer normalen externen Website ist meist ein gemeinsamer Endzeitpunkt sinnvoll. Persönliche Fristen brauchen zusätzliche Angaben und sind vor allem bei E-Mails relevant. > **Wichtig:** Füge den Code nur in einen dafür vorgesehenen HTML- oder Codebereich ein. Ein normaler Textabschnitt zeigt den Code häufig nur als Text an oder entfernt Teile davon. ## Die passende Zeitlogik wählen | Variante | Geeignet für | Erforderliche Zeitangaben | Ergebnis | | ----------------- | --------------------------------------------------------------------- | -------------------------------------------------------------- | ---------------------------------------------------------------------------------- | | **Fest** | Eine Aktion endet für alle zur selben Uhrzeit. | Enddatum und Endzeit | Alle Besucher sehen denselben verbleibenden Zeitraum. | | **Wiederkehrend** | Ein wiederholter Ablauf, zum Beispiel ein regelmäßiges Zeitfenster. | Startzeit, Dauer und Anzahl der Wiederholungen | Der Countdown läuft ab und startet entsprechend der gewählten Wiederholung erneut. | | **Individuell** | Jede Person soll ab ihrem eigenen Start eine separate Frist erhalten. | Dauer und eindeutige Kennung; der Start wird je Person gesetzt | Jede Person kann eine eigene verbleibende Zeit sehen. | Für eine externe Website mit einer öffentlich bekannten Frist verwendest du normalerweise einen **festen** Timer. Ändere den kopierten Website-Code dabei nicht: Die Standardvariante ist bereits auf einen gemeinsamen Zeitpunkt ausgelegt. Ein individueller Timer ist anspruchsvoller. Er braucht eine eindeutige Kennung je Person, damit eine zwischengespeicherte Anzeige nicht versehentlich von mehreren Empfängern geteilt wird. Verwende ihn nur, wenn das externe System die erforderlichen personenbezogenen Platzhalter zuverlässig einsetzen kann. ## Countdown vorbereiten 1. Öffne den gewünschten Countdown. 2. Lege den Typ fest: **fest**, **wiederkehrend** oder **individuell**. 3. Trage die erforderlichen Zeitangaben ein. Bei einem festen Timer sind das Enddatum und Endzeit. 4. Stelle das gewünschte Format ein, zum Beispiel Tage, Stunden, Minuten und Sekunden. 5. Passe das Erscheinungsbild an, damit der Timer zur externen Seite passt. 6. Speichere den Timer vollständig. 7. Öffne anschließend die Funktion **Code kopieren**. Erst der gespeicherte Timer ist eine verlässliche Grundlage für die Einbindung. Ändere den Timer später, prüfe die externe Seite danach erneut: Die Darstellung und die Frist müssen dort weiterhin zum geplanten Einsatz passen. ## Code für eine externe Website einfügen 1. Wähle bei **Code kopieren** die Verwendung **Website**. 2. Wähle die Ausrichtung, die zum vorgesehenen Bereich passt. 3. Kopiere den vollständigen Code. 4. Öffne im externen Website-System die Zielseite. 5. Füge einen HTML- oder Codebereich an der gewünschten Stelle ein. 6. Füge den Code unverändert ein. 7. Speichere und veröffentliche die externe Seite. 8. Öffne die veröffentlichte Seite in einem neuen Browserfenster. Die Ausrichtung steuert, wie der Timer innerhalb seines Bereichs platziert wird. Im Kopierfenster stehen dafür die drei klaren Optionen **links**, **zentriert** und **rechts** zur Auswahl. Wähle sie passend zum Aufbau der Seite, statt Abstände später nur über mehrere Leerzeichen oder manuelle Verschiebungen zu erzwingen. Das Kopierfenster trennt außerdem die Optionen **Website** und **E-Mail**. Wähle immer die Variante für den tatsächlichen Einsatzort, bevor du kopierst. So erhältst du die dazu passende Fassung des Codes. > **Nicht verkürzen:** Kopiere immer den vollständigen bereitgestellten Code. Einzelne ausgelassene Zeichen oder ein abgeschnittener Anfang beziehungsweise Schluss können dazu führen, dass der Timer nicht geladen wird. ### Linkziel während und nach dem Ablauf festlegen In den allgemeinen Timer-Einstellungen können zwei unterschiedliche Linkziele hinterlegt werden: eines für den aktiven Timer und eines für den abgelaufenen Timer. Das ist sinnvoll, wenn der Klick auf die Anzeige vor der Frist zu einer Anmeldung führen soll, nach Ablauf aber zu einer Informations- oder Warteseite. 1. Lege zuerst fest, ob der Timer überhaupt zu einer Seite weiterführen soll. 2. Hinterlege gegebenenfalls das Ziel für die aktive Anzeige. 3. Hinterlege bei Bedarf ein anderes Ziel für die Anzeige nach Ablauf. 4. Erstelle einen kurzen Testtimer und prüfe beide Zustände. Lass die Felder leer, wenn die Anzeige keinen Klick auslösen soll. Verwende nur erreichbare, veröffentlichte Zielseiten; sonst führt ein Klick für Besucher ins Leere. ## Was die Angaben im Code bedeuten Bei einer Website mit gemeinsamer Frist musst du den Code laut Produktquelle normalerweise nicht manuell anpassen. Es hilft trotzdem, die beiden wichtigsten Angaben zu kennen: | Angabe | Bedeutung | Wann bearbeiten? | | ---------------------- | ------------------------------------------------------------------------------------------------------ | ------------------------------------------------------------------------------------------------------------ | | **Startzeit** | Legt fest, ab welchem Zeitpunkt eine relative Frist gerechnet wird. | Bei einem normalen Website-Code mit gemeinsamer Frist nicht manuell ändern. | | **Eindeutige Kennung** | Unterscheidet individuelle Anzeigen, damit nicht mehrere Personen dieselbe gespeicherte Anzeige sehen. | Bei einem festen Website-Countdown nicht erforderlich; bei einer individuellen Frist je Person erforderlich. | In einem externen E-Mail-System gelten andere Regeln: Für eine gemeinsame Frist muss die Startzeit zum Versandzeitpunkt passen. Für einen persönlichen Countdown braucht das E-Mail-System zusätzlich einen aktuellen Zeitwert und eine je Empfänger eindeutige Kennung. Falls der Anbieter diese Platzhalter nicht unterstützt, verwende dort keine individuelle Frist. Zeitwerte müssen vollständig und mit Zeitzonenbezug angegeben sein. Eine übliche internationale Schreibweise sieht zum Beispiel so aus: `2026-10-15T18:00:00Z`. Das abschließende `Z` steht für eine koordinierte Weltzeit. Verwende alternativ nur einen eindeutigen Zeitzonenversatz, wenn er im jeweiligen System korrekt unterstützt wird. ## Veröffentlichung kontrollieren Prüfe nicht nur die Bearbeitungsansicht der externen Website. Entscheidend ist die veröffentlichte Version. 1. Öffne die veröffentlichte Seite in einem privaten Browserfenster. 2. Vergleiche Datum, Uhrzeit und Restzeit mit der geplanten Frist. 3. Prüfe Desktop und Mobilansicht. 4. Stelle sicher, dass der Timer vollständig sichtbar ist und nicht abgeschnitten wird. 5. Teste eine Frist, die zeitnah endet, damit du auch das Verhalten nach Ablauf siehst. 6. Prüfe nach Änderungen am Timer erneut die veröffentlichte Seite. Für eine wichtige Aktion lohnt sich ein zweiter Test durch eine Person in einer anderen Zeitzone oder auf einem anderen Gerät. So fällt schneller auf, wenn der externe Website-Baukasten Inhalte zwischenspeichert oder eine Zeitzone anders behandelt als erwartet. ## Praxisbeispiel: Anmeldeschluss auf einer Partnerseite Ein Veranstalter bewirbt ein Online-Event auf einer extern verwalteten Partnerseite. Die Anmeldung endet am Freitag um 18:00 Uhr. 1. Er erstellt einen **festen** Countdown bis Freitag, 18:00 Uhr. 2. Er wählt die Anzeige mit Tagen, Stunden und Minuten. 3. Nach dem Speichern kopiert er den Code für **Website**. 4. Die Partnerseite erhält im Anmeldebereich einen HTML-Abschnitt; dort fügt er den vollständigen Code ein. 5. Nach der Veröffentlichung prüft er die Seite am Computer und auf dem Smartphone. 6. Einen Tag vor Ablauf kontrolliert er noch einmal, ob die verbleibende Zeit zur geplanten Frist passt. Alle Besucher sehen dadurch dieselbe klare Frist. Der Veranstalter muss nicht für jede Person eine eigene Zeit berechnen oder den Code manuell ändern. ## Häufige Fehler und schnelle Lösungen | Beobachtung | Wahrscheinliche Ursache | Lösung | | ------------------------------------------------------------------ | ------------------------------------------------------------------------------------------------------------------------ | ------------------------------------------------------------------------------------------------------------------------------------------- | | Der Timer erscheint gar nicht. | Der Code wurde in ein Textfeld eingefügt, unvollständig kopiert oder die externe Seite erlaubt keinen ausführbaren Code. | Einen echten HTML- oder Codebereich verwenden, den vollständigen Code neu kopieren und die Vorgaben des Website-Systems prüfen. | | Der Timer startet nicht. | Für eine relative Zeitlogik fehlt eine gültige Startzeit. | Startzeit mit vollständigem Datum, Uhrzeit und Zeitzone prüfen. | | Die angezeigte Uhrzeit ist falsch. | Die eingetragene Zeit enthält keine passende Zeitzone oder die Frist wurde falsch geplant. | Zeitwert und Zeitzone im Timer sowie auf der veröffentlichten Seite vergleichen. | | Mehrere Personen sehen bei einer persönlichen Frist dieselbe Zeit. | Die eindeutige Kennung ist nicht individuell oder fehlt. | Nur ein System verwenden, das pro Empfänger eine eindeutige Kennung einsetzen kann; anschließend mit mindestens zwei Testempfängern prüfen. | | Der Timer ist auf Mobilgeräten abgeschnitten. | Der umgebende Bereich der externen Seite ist zu schmal oder hat feste Abmessungen. | Den HTML-Bereich und die Mobilansicht der externen Seite anpassen; danach erneut veröffentlichen und testen. | ## Grenzen und sinnvolle Alternativen Der Einbindungscode verbindet einen vorhandenen Timer mit einer externen Fläche. Er ersetzt weder die Veröffentlichung der externen Seite noch die Prüfung der dortigen Darstellung. Außerdem kann er keine Einschränkungen des anderen Website-Systems umgehen. Wenn du die Seite im Standort selbst pflegst, wähle das Countdown-Element im Editor statt des Einbindungscodes. Wenn du eine persönliche Frist über ein externes E-Mail-System senden möchtest, kläre zuerst, ob dieses System aktuelle Zeitwerte und individuelle Kennungen unterstützt. Fehlt diese Grundlage, ist ein gemeinsamer fester Countdown die verlässlichere Wahl. Weiterführend: [Countdown-Timer in E-Mails, Websites und Funnels verwenden](https://one-loop.gitbook.io/help/plattform/one-loop-plattform/websites-und-leadgewinnung/websites-und-funnels/countdown-timer-in-e-mails-websites-und-funnels-verwenden). --- # Agent Instructions This documentation is published with GitBook. GitBook is the documentation platform designed so that both humans and AI agents can read, navigate, and reason over technical content effectively. Learn more at gitbook.com. ## Querying This Documentation If you need additional information that is not directly available in this page, you can query the documentation by asking a question. Perform an HTTP GET request on the following URL with the `ask` and `goal` query parameters: ``` GET https://one-loop.gitbook.io/help/plattform/one-loop-plattform/websites-und-leadgewinnung/websites-und-funnels/countdown-timer-auf-externen-websites-einbetten.md?ask=&goal= ``` `ask` is the immediate question: it should be specific, self-contained, and written in natural language. `goal` is what the user is ultimately trying to achieve, the reason they need the answer. Sharing it helps GitBook give you a better, more relevant answer. A goal is most helpful when it describes the outcome the user wants rather than restating the question. For example, with `ask=how do I create an API token`, a goal like `automate deployments from our CI pipeline` lets GitBook tailor the answer to that use case. The response will contain a direct answer to the question and relevant excerpts and sources from the documentation. Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.