EmailSubscribe

<EmailSubscribe> platziert ein E-Mail-Anmeldeformular inline auf einer Dokumentationsseite. Mit einem im Dashboard verbundenen Anbieter wird ein von Jamdesk gehostetes Formular angezeigt, das neue Abonnenten zu Ihrer Zielgruppe hinzufügt. Ohne Anbieter kann es das Einfügen-Embed eines anderen Dienstes hosten. Verwenden Sie es auf Changelog- und Release-Notes-Seiten.

Schnellstart

Verbinden Sie einen Anbieter im Dashboard. Fügen Sie dann das Tag mit der ID dieses Anbieters hinzu:

<EmailSubscribe provider="resend" />

Dies rendert ein beschriftetes E-Mail-Feld und eine Schaltfläche Subscribe. Jamdesk fügt jede übermittelte Adresse der verbundenen Zielgruppe hinzu. Dasselbe Tag funktioniert für jeden verbundenen nativen Anbieter (mailchimp, kit, loops, beehiiv, brevo oder sendgrid).

Fügen Sie eine optionale Überschrift und eine ergänzende Zeile hinzu:

<EmailSubscribe
  provider="resend"
  title="Get release notes"
  description="One email when we ship something new. No spam."
/>

Props

Native Anbieter und Einbettungen

Der übergebene provider bestimmt, wie sich das Formular verhält:

• Native Anbieter (resend, mailchimp, kit, loops, beehiiv, brevo, sendgrid) rendern ein von Jamdesk gehostetes Formular. Jamdesk erfasst die Adresse und fügt sie über Ihren verbundenen Schlüssel hinzu. Dafür muss ein Anbieter im Dashboard verbunden sein.
• Nur-Einbettungs-Anbieter (buttondown, substack) rendern das eigene Formular oder iframe des Dienstes. Sie verbinden keinen Schlüssel. Übergeben Sie Ihren username. Der Besucher sendet direkt an den Anbieter.

Anbieter, die ausschließlich Einbettungen unterstützen

Buttondown und Substack funktionieren ohne Verbindung im Dashboard. Übergeben Sie Ihren Kontobenutzernamen:

<EmailSubscribe provider="buttondown" username="acme" />
<EmailSubscribe provider="substack" username="acme" />

Ausweichoption: beliebige Einbettung einfügen

Fügen Sie den Einbettungscode eines beliebigen Anbieters in snippet ein. Er wird auf der veröffentlichten Seite unverändert gerendert:

<EmailSubscribe snippet={`<form action="https://example.com/subscribe">...</form>`} />

Kompakter Modus

Setzen Sie collapsed, um das native Formular als Schaltfläche Subscribe zu starten. Ein Klick öffnet das vollständige Feld inline, ohne Neuladen der Seite:

<EmailSubscribe provider="resend" collapsed title="Subscribe to updates" />

Die Beschriftung der Schaltfläche stammt aus title. Der Standard ist „Subscribe to updates“. Der Kompaktmodus gilt nur für native Anbieter. Einbettungs-Anbieter rendern ihren eigenen Code.

Bereits abonnierte Leser

Der Browser merkt sich einen Leser, der sich über ein natives Formular angemeldet hat. Beim nächsten Besuch sieht der Leser statt des Formulars eine kurze Zeile: You're subscribed to the newsletter.

Die Zeile enthält eine Steuerung „Use a different email?“, die das vollständige Formular wieder öffnet. Die Erinnerung gilt pro Browser. Sie liegt in localStorage, nicht in Ihrer Zielgruppe. Das Löschen der Website-Daten oder ein Browserwechsel zeigt das Formular erneut. Native Formulare tun dies ohne Konfiguration.

Automatisch auf Changelog-Seiten platzieren

Binden Sie das Formular auf Changelog-Seiten ein, ohne das Tag von Hand hinzuzufügen. Setzen Sie placement der Newsletter-Integration in docs.json auf changelog:

{
  "integrations": {
    "newsletter": {
      "provider": "resend",
      "title": "Get release notes",
      "placement": "changelog"
    }
  }
}

Das Formular wird dann auf jeder Changelog-Seite eingebunden (jeder Seite mit rss: true). Lassen Sie es auf einer Seite aus, indem Sie newsletter: false im Frontmatter dieser Seite setzen. Eine Seite mit einem manuell platzierten <EmailSubscribe> erhält kein zweites Formular.

Der vollständige Block integrations.newsletter akzeptiert dieselben Felder wie die Komponente (provider, title, description, collapsed, username, snippet, height) sowie placement (none, der Standard, oder changelog).

Wie geht es weiter?