Anmeldeformulare – Fehlerbehebung

Wenn dein Formular in Klaviyo veröffentlicht ist, aber nicht angezeigt wird:

• Stelle sicher, dass dein Formular live ist. Im Tab Anmeldeformulare solltest du unter der Spalte Statusfür dein Formular „ Live“ mit einem grünen Pfeil sehen.
  • Wie oben erwähnt, werden Klaviyo-Anmeldeformulare in Internet Explorer nicht angezeigt.
• Vergewissere dich, dass du alle Anweisungen befolgt hast, um das Klaviyo.js Onsite-Code-Fragment zu installieren und zu aktivieren (auch als „Active on Site“-Tracking bekannt).
• Wenn du ein eingebettetes Formular verwendest, überprüfe, ob du den richtigen Einbettungscode genau so, wie er im Installationsmodell angezeigt wird, in den Code deiner Website eingefügt hast.
• Sieh dir den Abschnitt Targeting und Verhalten im Anmeldeformular-Editor an:
  • Stell unter Targetingsicher, dass das Formular so konfiguriert ist, dass es auf der URL angezeigt wird, die du dir ansiehst, oder dass du eine eindeutige E-Mail-Adresse verwendest (wie im Testtipp oben beschrieben).
  • Stelle unter Anzeigezeitpunkt sicher, dass die Einstellungen für den Anzeigezeitpunkt nicht zu restriktiv sind. Wenn das Formular auf Basierend auf Regeln anzeigen eingestellt ist, müssen alle Kriterien erfüllt sein, damit das Formular angezeigt wird. Wenn beispielsweise sowohl „Anzeigen, wenn Besucher*innen die Seite verlassen“ als auch „Nach Scrollen durch 60 % der Seite anzeigen“ ausgewählt sind, müssen Besucher*innen durch 60 % der Seite scrollen und eine Verlassensabsicht zeigen, damit das Formular angezeigt wird.
• Führe den Test in einem neuen Fenster im Inkognito-/Privatmodus erneut durch. Möglicherweise hast du das Popup bereits geschlossen, weshalb es nicht erneut angezeigt wird. Wir setzen 1 Jahr lang Cookies im Browser, sodass jemand, der ein Popup schließt, dasselbe Popup für ein weiteres Jahr nicht wieder sieht (es sei denn, die Cookies werden gelöscht).
• Wenn du ein eingebettetes Formular verwendest, vergewissere dich, dass der Einbettungscode des Formulars exakt so hinzugefügt wurde, wie er im Installationsmodal angezeigt wird, und dass er korrekt in den Code deiner Website eingefügt wurde.
• Bestätige, dass nur ein Klaviyo-Konto mit deiner Website integriert ist. Wenn du mehrere Klaviyo-Konten für 1 Store hast, deaktiviere in allen bis auf 1 Konto die Option Klaviyo Onsite JavaScript automatisch hinzufügen. Wenn du Klaviyos .js manuell installiert hast, Stelle sicher, dass du das Snippet nur aus 1 Konto installiert hast.
• Für Shopify-Shops: Basierend auf deinen Einstellungen zum Kund*innendatenschutz in Shopify kann Klaviyo möglicherweise keine Onsite-Events (und damit bestimmte Arten von Formular-Targeting nicht anwenden) für Besucher*innen deines Shopify-Shops in der EU, dem EWR, Großbritannien und der Schweiz tracken, es sei denn, sie haben ihre Einwilligung erteilt.
• Besucher*innen, die keine Einwilligung abgegeben haben und ansonsten gemäß den Targeting-Anforderungen einbezogen worden wären, sehen das Formular nicht, weil sie nicht identifiziert werden. Das Targeting für diese Besucher*innen wird wie folgt angewendet:
• • Wenn du „Nicht für bestehende Klaviyo-Profile anzeigen“ auswählst, sehen diese Besucher*innen das Formular trotzdem, da sie nicht als bestehende Profile identifiziert werden.
  • Wenn du „Besucher in einer Liste oder einem Segment ansprechen“ auswählst, wird dem Besucher das Formular nicht angezeigt (selbst wenn er sich andernfalls in der Liste oder im Segment befindet), da er nicht identifiziert wird. Wenn du „Für alle Besucher anzeigen“ auswählst, wird es diesen Besucher*innen angezeigt.
  • Wenn du „Vorhandenem Profil anzeigen“, „Nur für E-Mail-Abonnent*innen anzeigen“ oder „Nur für SMS-Abonnent*innen anzeigen“ auswählst, sieht die Besucher*in das Formular nicht, weil sie nur als vorhandenes Profil bzw. als E-Mail- oder SMS-Abonnent*in identifiziert wird.
  • Bestimmte benutzerdefinierte Auslöser, die auf Cookie-Informationen und Benutzereigenschaften basieren, werden aufgrund einer fehlenden Identifizierung nicht ausgelöst.
  • Das Targeting nach Standort ist davon nicht betroffen.
  • Das Targeting auf den Gerätetyp (Desktop, Mobilgerät) ist davon nicht betroffen.

Wenn dein Formular nicht gesendet wird, wenn du auf die Schaltfläche Senden klickst:

• Vergewissere dich, dass die Liste, mit der das Formular verbunden ist, nicht gelöscht wurde.
• Verifiziere, dass die Schaltfläche eine Senden-Schaltfläche ist und keine Schließen-Schaltfläche. Klicke in der Formular-Editor-Vorschau auf die Schaltfläche, um das zu sehen.
• Sieh in deinem Posteingang nach einer Bestätigungs-E-Mail. Wenn deine Liste auf Double Opt-in eingestellt ist, wirst du erst hinzugefügt, nachdem du dein Abonnement bestätigt hast.

Klaviyo-Anmeldeformulare sollten auf deiner Website so angezeigt werden, wie sie im Klaviyo-Formular-Editor gestaltet wurden. Wenn es anders aussieht, überschreibt das CSS deiner Website das Styling des Formulars. So führst du die Fehlerbehebung durch:

• Suche in deinem CSS nach !important-Tags und entferne diese nach Möglichkeit.
• Dein Entwicklerteam kann außerdem die Entwicklertools deines Browsers verwenden, um den Code der Website zu untersuchen und das problematische CSS zu identifizieren. Wenn du weiterhin Probleme hast, findest du hier Hilfe.

Beachte, dass für alle Klaviyo-Formulare, die E-Mail-Adressen erfassen, SMS-Einwilligungen einholen oder einen Gutschein enthalten, standardmäßig Bot-Schutz aktiviert ist. Wenn Klaviyo verdächtiges Verhalten oder frühere Bot-Aktivitäten von der IP-Adresse von Website-Besucher*innen erkennt, werden diese aufgefordert, ein CAPTCHA zu lösen, bevor sie das Formular absenden.

Wenn Personen dein Formular ausfüllen, du aber nicht siehst, dass sie der Liste hinzugefügt werden, mit der dein Formular verbunden ist:

• Klicke in der Vorschau des Formular-Editors auf die Schaltfläche und stelle sicher, dass du eine Liste zum Senden ausgewählt hast.
• Prüfe die Opt-in-Einstellungen deiner Liste. Wenn die Liste auf Double Opt-in eingestellt ist (empfohlen), dann haben die fehlenden Abonnent*innen den Bestätigungsschritt wahrscheinlich nicht abgeschlossen.

Wenn die Anzahl der Formularübermittlungen nicht mit der Anzahl der Personen in deiner Liste übereinstimmt:

• Abonnent*innen haben den Bestätigungsschritt möglicherweise nicht abgeschlossen (wenn deine Liste auf Double Opt-in eingestellt ist).
• Es könnte auch auf doppelte Einträge hinweisen. Wenn ein*e Abonnent*in ein Formular wiederholt ausfüllt, zählt jeder Eintrag in deiner Formularanalyse als eine „Übermittlung“, aber er*sie wird nur 1-mal in deiner Liste angezeigt.
• Es ist auch möglich, dass einige Einsendungen von Bots oder List Bombers stammten. Klaviyo verfügt über Schutzmaßnahmen gegen List Bombing, um dich vor diesen Cyberangriffen zu schützen.

Möglicherweise erhältst du die Fehlermeldung „Es kann nicht erkannt werden, dass Anmeldeformulare erfolgreich auf deiner Website installiert sind. Bitte sieh dir die Installationsdokumentation an.“, obwohl du das Installations-Snippet korrekt zu deiner Website hinzugefügt hast (oder eine vorgefertigte Integrationen verwendest, die das automatisch erledigt). Das kann angezeigt werden, wenn du eine Tag-Management-Plattform verwendest (z. B. Google Tag Manager) oder eine andere Methode, um das Snippet beim Laden der Seite an deine Website zu liefern.

Diese Meldung verhindert nicht, dass ein Formular veröffentlicht wird. Wenn das Snippet korrekt auf der Website installiert ist, kannst du sie also ignorieren. Wenn weiterhin Probleme auftreten, kontaktiere uns.

Bitte beachte, dass JAWS, ein Bildschirmleserprogramm für Microsoft Windows, möglicherweise keine Anmeldeformulare auf deiner Website erkennt, die in Klaviyo erstellt wurden. Damit Website-Besucher*innen, die JAWS verwenden, weiterhin mit Anmeldeformularen auf deiner Website interagieren können, empfehlen wir, deiner Website ein zusätzliches Code-Snippet hinzuzufügen, das sie für JAWS zugänglicher macht.

Kopiere das folgende Code-Fragment und füge es in die Haupt-Theme-Datei deiner Website ein, damit JAWS deine Klaviyo-Anmeldeformulare erkennt und vorliest:

 {
  const ariaHiddenValue = $el ? $el.getAttribute('aria-hidden') : null;
  return ariaHiddenValue === 'true';
};

const isHTMLElement = (node) => {
  return node.nodeType === Node.ELEMENT_NODE;
};

const isModal = (node) => {
  if (node.children.length !== 1) return false;
  const modalContainer = Array.from(node.children[0].classList).some((cls) => cls.startsWith('kl-private-reset'));

  return modalContainer;
};

const getTopLevelDomElements = () => {
  const body = document.body;

  // Use the children property to get all top-level elements
  const topLevelNodes = Array.from(body.children).filter((node) => {
    if (isHTMLElement(node)) {
      const tagName = node.tagName.toLowerCase();

      console.log('isModal: ', isModal);

      // Filter out specific tags
      return (
        tagName !== 'script' &&
        tagName !== 'link' &&
        tagName !== 'iframe' &&
        tagName !== 'style' &&
        !isModal(node)
      );
    }
    return false;
  });

  return topLevelNodes;
};

const a11yHideTopLevelElements = () => {
  const $elements = getTopLevelDomElements();

  $elements.forEach(($el) => {
    if (!isAriaHiddenTrue($el)) {
      $el.setAttribute('kl-aria-hidden', 'true');
      $el.setAttribute('aria-hidden', 'true');
    }
  });
};

const a11yShowTopLevelElements = () => {
  const $elements = getTopLevelDomElements();

  $elements.forEach(($el) => {
    if ($el.hasAttribute('kl-aria-hidden')) {
      $el.removeAttribute('kl-aria-hidden');
      $el.removeAttribute('aria-hidden');