Zum Hauptinhalt springen

Embed-Code-Generator

Fügen Sie in wenigen Minuten ein Society Speaks-Abstimmungs-Widget zu Ihrem Artikel hinzu. Entwickler erhalten ein sauberes iframe mit Anpassungsoptionen. Redakteure bekommen strukturierte Einblicke statt Comment-Chaos.

API-Referenz Kontakt

Embeds sind für native Society Speaks-Diskussionen verfügbar.

Implementierungs-Checkliste

  • Bestätigen Sie, dass Ihre Domain auf der Allowlist steht
  • Generieren Sie das iframe unten
  • Aktivieren Sie automatische Größenänderung für nahtloses UX

Nutzen Sie das Partner Portal für Production-Onboarding

Erstellen Sie Ihre Test-Keys, verifizieren Sie Domains und aktivieren Sie Live-Keys über <a href="/for-publishers/portal/signup" class="underline">Partnerportal</a>. Für größere Deployments verwenden Sie die API, um Diskussionen zu erstellen und die zurückgegebene Discussion ID in Ihrem CMS zu speichern. Siehe <a href="/for-publishers/api" class="underline">API-Referenz</a> für den programmatischen Workflow.

Für Entwickler

Ein leichtes iframe, vorhersehbare Parameter und postMessage-Resize-Hooks.

Für Redakteure

Strukturierte Beteiligung, klare Konsens-Signale und nachprüfbare Methodik.

Für Publikum

Abstimmen in Sekunden, sehen Sie, wo die Öffentlichkeit ausgerichtet ist, und erkunden Sie tiefere Analysen.

Ablauf im großen Maßstab

1) Nach Artikel-URL suchen, 2) erstellen falls fehlend, 3) Discussion ID speichern.

Was ist eine Discussion ID?

Eine eindeutige Kennung, die die API bei der Erstellung oder Suche einer Diskussion zurückgibt.

Noch keine Diskussion?

Rufen Sie POST /api/partner/discussions auf, um eine zu erstellen, dann betten Sie sofort ein.

1. Finden Sie Ihre Diskussion

oder

Wird von der API bei der Erstellung oder Suche einer Diskussion zurückgegeben.

2. Wählen Sie ein Theme

Oder passen Sie die Farben an:

3. Ihre Referenz hinzufügen (Optional)

Wird für Analysen verwendet. Kleinbuchstaben, keine Leerzeichen.

Vorschau

Geben Sie eine Diskussions-ID ein oder suchen Sie eine Artikel-URL auf, um eine Vorschau anzuzeigen

Embed-Code

<!-- Geben Sie eine Diskussions-ID ein, um Embed-Code zu generieren -->

Auto-Resize-Snippet

<script>
window.addEventListener('message', (event) => {
  if (event.data && event.data.type === 'societyspeaks:embed:resize') {
    const iframe = document.getElementById('societyspeaks-embed');
    if (iframe) iframe.style.height = event.data.height + 'px';
  }
});
</script>

Performance-Tipps

<link rel="preconnect" href="https://societyspeaks.io">
<link rel="dns-prefetch" href="https://societyspeaks.io">

Tipps

  • Stellen Sie die iframe-Breite auf 100% für responsive Embeds ein
  • Die Standardhöhe beträgt 600 Pixel; passen Sie sie basierend auf der Anzahl der Aussagen an
  • Fügen Sie ref hinzu, um die Beteiligung von Ihrer Website zu verfolgen
  • Das Embed sendet seine Höhe über postMessage für dynamische Größenanpassung
  • Fügen Sie das Auto-Resize-Snippet hinzu, um Scrollbalken zu vermeiden
  • Verwenden Sie preconnect-Hinweise, um das erste Rendering zu beschleunigen