DataFirefly Social Connect — Komplette Anleitung

Übersicht

DataFirefly Social Connect fügt Ihrem WooCommerce-Shop eine soziale Anmeldung mit einem Klick über sechs Anbieter hinzu (Google, Apple, Facebook, Microsoft, LinkedIn und X), ein vollständiges Statistik-Dashboard, die Zuordnung von Bestellungen zum Ursprungsanbieter, einen A/B-Test der Buttons, einen Betrugsschutz und native DSGVO-Konformität.

Das Plugin verwendet keine externen CDN-Bibliotheken: Die Dashboard-Diagramme werden mit nativem HTML5-Canvas gerendert, und die OAuth-2.0- / OpenID-Connect-Flows sind direkt im Modul implementiert (vollständige JWKS-Signaturprüfung für Google One-Tap, On-the-fly-ES256-Signierung für Apple, appsecret_proof-Absicherung für Facebook, S256-PKCE für X).

Installation

1. Laden Sie die ZIP-Datei des Plugins aus Ihrem DataFirefly-Kundenbereich herunter.
2. Gehen Sie in WordPress zu Plugins → Installieren → Plugin hochladen.
3. Wählen Sie die ZIP-Datei und klicken Sie auf Jetzt installieren.
4. Klicken Sie auf Aktivieren. WooCommerce muss zum Zeitpunkt der Aktivierung aktiv sein, sonst verweigert das Plugin die Installation.
5. In der Admin-Seitenleiste erscheint ein neues Menü Social Connect mit zwei Unterseiten: Statistiken und Einstellungen.

Bei der Aktivierung werden zwei SQL-Tabellen erstellt: wp_dfsc_connections (verknüpfte Konten) und wp_dfsc_events (Ereignisprotokoll für die Statistik). Die Standardoptionen werden in dfsc_settings geschrieben.

Anbieterkonfiguration

Jeder Anbieter hat seine eigene Karte im Tab Anbieter der Einstellungen. Für jeden wird oben auf der Karte die Redirect-URI angezeigt, die Sie in die Konsole des Anbieters kopieren müssen. Diese Einstellung autorisiert Ihre Website, den Authentifizierungsrückruf zu empfangen.

Google (mit One-Tap)

1. Gehen Sie zur Google Cloud Console und erstellen (oder wählen) Sie ein Projekt.
2. Konfigurieren Sie unter APIs & Services → OAuth consent screen den Zustimmungsbildschirm (Typ External für einen öffentlichen Shop, fügen Sie Ihre Domain zu den autorisierten Domains hinzu).
3. Wählen Sie unter Credentials → Create credentials → OAuth client ID Web application.
4. Fügen Sie unter Authorized redirect URIs die in der Google-Karte von Social Connect angezeigte URI ein (Form: https://ihre-domain.de/?dfsc_action=callback&dfsc_provider=google).
5. Um Google One-Tap zu aktivieren, fügen Sie Ihre Root-Domain auch in Authorized JavaScript origins hinzu.
6. Kopieren Sie die Client ID und das Client Secret in die entsprechenden Felder der Google-Karte, aktivieren Sie den Schalter des Anbieters und setzen Sie das Häkchen bei One-Tap-Einladung nicht angemeldeten Besuchern anzeigen, falls gewünscht.

Apple (Sign in with Apple)

1. Gehen Sie auf Apple Developer (kostenpflichtiges Konto erforderlich) zu Certificates, Identifiers & Profiles → Identifiers.
2. Erstellen Sie eine App ID mit aktivierter Capability Sign In with Apple.
3. Erstellen Sie anschließend eine Services ID (dies ist die Kennung, die Sie als „Client ID“ in Social Connect verwenden werden). Konfigurieren Sie deren Sign In with Apple: Fügen Sie Ihre Domain in Domains hinzu und die in der Apple-Karte angezeigte Redirect-URI in Return URLs.
4. Erstellen Sie einen privaten Schlüssel (Keys → +) mit angekreuztem Sign In with Apple, verknüpft mit Ihrer App ID. Laden Sie die .p8-Datei herunter (Sie können sie nur einmal herunterladen).
5. Tragen Sie in der Apple-Karte die Services ID, Ihre Team ID (oben rechts im Portal sichtbar), die Key ID (neben dem erstellten Schlüssel angezeigt) ein und fügen Sie den vollständigen Inhalt der .p8-Datei in das Feld Privater Schlüssel ein (einschließlich der -----BEGIN PRIVATE KEY------Zeilen).

Facebook

1. Erstellen Sie auf Meta for Developers eine Anwendung vom Typ Consumer.
2. Fügen Sie in der Anwendung das Produkt Facebook Login → Web hinzu.
3. Fügen Sie in den Facebook-Login-Einstellungen die in der Facebook-Karte angezeigte Redirect-URI zu Valid OAuth Redirect URIs hinzu.
4. Holen Sie sich die App ID und das App Secret aus Settings → Basic und fügen Sie sie in die Facebook-Karte ein.

Das Plugin sichert jeden Graph-API-Aufruf mit appsecret_proof (HMAC-SHA256 des mit Ihrem App Secret signierten Tokens), gemäß den Best Practices von Meta.

Microsoft

1. Gehen Sie auf Microsoft Entra (ehemals Azure AD) zu App registrations → New registration.
2. Benennen Sie Ihre Anwendung. Wählen Sie für Supported account types Accounts in any organizational directory and personal Microsoft accounts, wenn Sie beide akzeptieren wollen (verwendet den Tenant common).
3. Wählen Sie unter Redirect URI Web und fügen Sie die in der Microsoft-Karte angezeigte URI ein.
4. Kopieren Sie nach der Erstellung die Application (client) ID in das entsprechende Feld.
5. Erstellen Sie unter Certificates & secrets ein New client secret, kopieren Sie den Wert sofort (er wird danach nicht mehr sichtbar sein) in das Feld Client Secret.
6. Belassen Sie das Feld Tenant auf common, um sowohl persönliche als auch Geschäftskonten zu akzeptieren, oder geben Sie Ihre Tenant-ID ein, um auf eine Organisation zu beschränken.

LinkedIn

1. Erstellen Sie auf LinkedIn Developers eine mit Ihrer Unternehmensseite verknüpfte Anwendung.
2. Beantragen Sie im Tab Products die Aktivierung von Sign In with LinkedIn using OpenID Connect. Die Genehmigung erfolgt automatisch.
3. Fügen Sie im Tab Auth die in der LinkedIn-Karte angezeigte Redirect-URI zu Authorized redirect URLs hinzu.
4. Kopieren Sie die Client ID und das Client Secret aus dem Tab Auth in Social Connect.

X (Twitter)

1. Erstellen Sie im X-Entwicklerportal ein Projekt und dann eine Anwendung.
2. Aktivieren Sie unter User authentication settings OAuth 2.0, wählen Sie den Typ Confidential client (empfohlen) und fügen Sie die in der X-Karte angezeigte Redirect-URI in Callback URI / Redirect URL ein.
3. Geben Sie Ihre Website URL (Startseite Ihres Shops) ein.
4. Kopieren Sie die Client ID und das Client Secret in Social Connect.

Platzierungen und Erscheinungsbild

Im Tab Erscheinungsbild wählen Sie, wo die Buttons angezeigt werden:

• WooCommerce-Login-Formular (Mein-Konto-Seite ohne Anmeldung).
• WooCommerce-Registrierungsformular.
• Checkout-Seite, oberhalb des Formulars.
• Mein-Konto-Dashboard, mit der Liste der verknüpften Konten und manuellen Verknüpfungsbuttons.

Sie können die Buttons auch beliebig über den Shortcode einfügen:

[datafirefly_social_connect]
[datafirefly_social_connect context="login" heading="yes" providers="google,apple"]
[datafirefly_social_connect context="custom" redirect="https://ihre-seite/ziel/"]

Das Erscheinungsbild ist über vier Achsen konfigurierbar:

• Stil: gefüllt (Markenfarben), Kontur (weißer Hintergrund, farbiger Rand), minimal (hellgrauer Hintergrund).
• Form: abgerundet, Pille, Quadrat.
• Layout: gestapelt oder inline.
• Beschriftung: „Weiter mit…“, „Anmelden mit…“ oder nur Symbol.

Statistik-Dashboard

Das Dashboard (Menü Social Connect → Statistiken) bündelt die gesamte soziale Anmeldeaktivität Ihres Shops.

KPIs und Diagramme

Zeitraumauswahl oben rechts: 7, 30, 90 oder 365 Tage. Die sechs angezeigten KPIs umfassen:

• Anmeldungen — Gesamtzahl der Authentifizierungen im Zeitraum.
• Registrierungen — neue Konten, die per sozialer Anmeldung erstellt wurden.
• Verknüpfte Konten (gesamt) — kumulierte Anzahl sozialer Identitäten, die Benutzern zugeordnet sind.
• Zugeordnete Bestellungen und zugeordneter Umsatz — siehe nächsten Abschnitt.
• Konversionsrate — Verhältnis Bestellungen / Anmeldungen.

Vier Diagramme ergänzen die KPIs: eine Zeitreihe pro Anbieter, ein Donut für die Anbieterverteilung, ein Donut für die Gerätetypverteilung (Computer, Mobil, Tablet) und eine durch die Geolokalisierung gespeiste „Top-Länder“-Karte.

Bestellzuordnung

Jede WooCommerce-Bestellung, die von einem über soziale Anmeldung eingetretenen Benutzer aufgegeben wird, wird seinem Ursprungsanbieter zugeordnet. Die Zuordnung stützt sich auf das Benutzer-Meta _dfsc_registered_via und ersatzweise auf die erste aktive soziale Verknüpfung des Benutzers.

Die Hooks woocommerce_checkout_order_processed und woocommerce_store_api_checkout_order_processed werden beide abgehört, was sowohl den klassischen als auch den Block-Checkout abdeckt.

A/B-Test der Buttons

Aktivieren Sie im Tab Erscheinungsbild den Block A/B-Test der Buttons und konfigurieren Sie Variante B (Stil, Form, Layout, Beschriftung). Ab diesem Zeitpunkt erhält jeder Besucher zufällig Variante A (Ihre Grundeinstellungen) oder Variante B (Cookie dfsc_ab, 50/50, 30 Tage aufbewahrt).

Eine Impression wird einmal pro Besuchersitzung gezählt (Cookie dfsc_ab_imp), um das Volumen nicht zu inflationieren. Konversionen werden bei Anmelde-, Registrierungs-, Verknüpfungs- und Bestellereignissen gemessen und in der A/B-Test-Karte des Dashboards mit Impressionen, Konversionen, zugeordneten Bestellungen, Rate pro Variante und automatischer Gewinner-Designation berichtet.

Betrugsschutz — Anmelde-Geschwindigkeit

Im Tab Datenschutz können Sie die Geschwindigkeitsbegrenzung pro IP-Adresse aktivieren. Drei Schwellenwerte sind konfigurierbar:

• Maximale Versuche — Standardmäßig 8.
• Fenster (Minuten) — Standardmäßig 5.
• Sperrdauer (Minuten) — Standardmäßig 15.

Sobald das Limit überschritten ist, wird die IP für die konfigurierte Dauer gesperrt. Ein Ereignis vom Typ blocked wird protokolliert und erscheint in der jüngsten Aktivität. Der Schutz gilt sowohl für klassische OAuth-Weiterleitungen als auch für den Google-One-Tap-Flow.

Unabhängig davon pflegt das Plugin eine Liste von Wegwerf-E-Mail-Domains (Mailinator, Yopmail, 10MinuteMail usw.), die bei der Registrierung gesperrt werden können. Die Liste ist über den Filter dfsc_disposable_domains erweiterbar.

Geolokalisierung

Aktivieren Sie die Geolokalisierung im Tab Datenschutz. Das Plugin verwendet die MaxMind-Datenbank, die bereits von WooCommerce eingebettet ist — kein externer Dienst wird aufgerufen. Wenn Sie die Geolokalisierung auf WooCommerce-Seite noch nicht aktiviert haben, gehen Sie zu WooCommerce → Einstellungen → Allgemein und aktivieren Sie die Standard-Geolokalisierungsoption (WooCommerce lädt die Datenbank dann automatisch herunter).

Nach der Aktivierung wird das Land jeder Anmeldung aufgelöst und speist die Top-Länder-Karte des Dashboards sowie die Spalte „Land“ des CSV-Exports.

CSV-Export

Die Schaltfläche Als CSV exportieren oben im Dashboard exportiert alle Ereignisse des ausgewählten Zeitraums. Die Datei enthält eine Spalte für jedes relevante Feld (UTC-Datum, Ereignis, Anbieter, Kontext, Land, Gerät, A/B-Variante, Benutzer, Bestellung, Betrag, Meldung). Ein UTF-8-BOM wird am Anfang hinzugefügt, damit Excel und LibreOffice Calc Akzente korrekt anzeigen.

Kontoverknüpfung

Drei Mechanismen koexistieren, um eine soziale Identität mit einem WordPress-Konto zu verknüpfen:

1. Bekannte Identität — der Benutzer hat diesen Anbieter bereits verwendet, seine Anmeldung erfolgt sofort.
2. Automatische Verknüpfung per E-Mail — es existiert bereits ein WordPress-Benutzer mit derselben E-Mail-Adresse wie der vom Anbieter zurückgegebenen. Wenn die E-Mail vom Anbieter verifiziert ist (und die Option E-Mail-Verifizierung erforderlich aktiviert ist), erfolgt die Verknüpfung automatisch.
3. Manuelle Verknüpfung — vom Mein-Konto-Dashboard aus kann ein angemeldeter Kunde jeden Anbieter über das Verbundene Konten-Panel verknüpfen oder trennen.

DSGVO und Datenschutz

Drei IP-Speichermodi sind im Tab Datenschutz verfügbar:

• Gehasht (Standard) — HMAC-SHA256 mit wp_salt, nicht umkehrbar.
• Vollständig — IP im Klartext (nur verwenden, wenn Ihre Datenschutzerklärung dies ausdrücklich erwähnt).
• Keine — die IP wird überhaupt nicht gespeichert.

Das Plugin meldet einen Exporter und einen Eraser beim nativen DSGVO-System von WordPress an (Werkzeuge → Persoenliche Daten exportieren / loeschen). Wird ein Benutzer gelöscht, werden auch seine verknüpften Konten und Ereignisse gelöscht (oder bei Löschung anonymisiert).

Shortcode und erweiterte Integration

Der Shortcode [datafirefly_social_connect] akzeptiert folgende Attribute:

• context — login, register, checkout oder custom.
• heading — yes oder no, um den Titel „Schnelle Anmeldung“ über den Buttons anzuzeigen.
• providers — durch Kommas getrennte Liste zur Einschränkung der Anzeige (z. B. google,apple).
• redirect — absolute Weiterleitungs-URL nach der Anmeldung (überschreibt die globale Einstellung).

Sie können das Rendering auch direkt in PHP aufrufen:

echo do_shortcode('[datafirefly_social_connect context="custom" providers="google,microsoft"]');

Hooks und Filter für Entwickler

• dfsc_disposable_domains (Filter) — erweitert oder ersetzt die Liste der Wegwerf-E-Mail-Domains.
• dfsc_user_registered (Aktion) — wird unmittelbar nach der Erstellung eines Kontos per sozialer Anmeldung ausgelöst, mit der Benutzer-ID und dem normalisierten Profil.
• dfsc_after_login (Aktion) — wird nach jeder erfolgreichen Anmeldung ausgelöst.
• dfsc_welcome_subject und dfsc_welcome_body (Filter) — passen Betreff und Text der Willkommens-E-Mail an.
• dfsc_placeholder_email_domain (Filter) — ändert die für technische E-Mails verwendete Domain (Apple Hide My Email abgelehnt, X).

Eine schreibgeschützte REST-API stellt aggregierte Statistiken unter /wp-json/datafirefly-social-connect/v1/stats?days=30 bereit (Berechtigung manage_woocommerce erforderlich). Aktivieren Sie sie im Tab Datenschutz.

Kompatibilität

• WooCommerce HPOS — die custom_order_tables-Kompatibilität wird bei der Aktivierung deklariert; der High-Performance Order Storage wird vollständig unterstützt.
• Checkout-Blöcke — der Hook woocommerce_store_api_checkout_order_processed wird parallel zum klassischen abgehört, sodass die Bestellzuordnung auf beiden Checkouts funktioniert.
• Polylang und WPML — die Oberflächenstrings sind über die mitgelieferte .pot-Datei übersetzbar (FR, EN, ES, DE, IT). Inhalte (Willkommens-E-Mail usw.) sind mit beiden mehrsprachigen Plugins kompatibel.
• Multisite — jede Site des Netzwerks hat eigene Tabellen und Optionen. Die Deinstallation bereinigt jede Site.

Deinstallation

Beim Löschen des Plugins aus Plugins wird die Datei uninstall.php automatisch ausgeführt. Sie entfernt:

• Die Tabellen wp_dfsc_connections und wp_dfsc_events.
• Die Optionen dfsc_settings und dfsc_db_version.
• Verwandte Transients (Google-JWKS-Cache, Apple-Client-Secret-Cache, Zustandstoken).
• Benutzer-Meta (_dfsc_provider, _dfsc_registered_via, _dfsc_avatar_id usw.).

Ihre WordPress-Benutzer und WooCommerce-Bestellungen werden nie angetastet. Im Multisite-Betrieb durchläuft die Deinstallation jede Site des Netzwerks.

FAQ und Fehlerbehebung

Der Google-Button zeigt „redirect_uri_mismatch“

Die in die Google Cloud Console eingefügte Redirect-URI stimmt nicht exakt mit der in der Google-Karte von Social Connect angezeigten überein. Prüfen Sie, ob Sie die vollständige URI kopiert haben (mit https://, dem abschließenden Schrägstrich und den Parametern ?dfsc_action=callback&dfsc_provider=google).

Apple gibt „invalid_client“ zurück

Drei mögliche Ursachen: Die eingegebene Services ID ist keine Services ID, sondern eine App ID; die Team ID ist falsch; oder der Inhalt des privaten .p8-Schlüssels ist unvollständig (fehlende -----BEGIN PRIVATE KEY------Zeilen). Prüfen Sie alle drei und leeren Sie den Apple-Client-Secret-Cache durch erneutes Speichern der Einstellungen.

Facebook gibt einen appsecret_proof-Fehler zurück

Das eingegebene App Secret ist falsch oder wurde auf Meta-Seite regeneriert, ohne hier aktualisiert zu werden. Gehen Sie zu Meta for Developers, kopieren Sie das Secret erneut und fügen Sie es in die Facebook-Karte ein.

X / Twitter gibt beim Rückruf „invalid_request“ zurück

Die Callback URI wurde im X-Entwicklerportal nicht korrekt eingegeben, oder der App-Typ ist nicht Confidential client, obwohl ein Client Secret zwingend erforderlich ist. Überprüfen Sie das Portal erneut.

Das Dashboard ist leer, obwohl ich Anmeldungen hatte

Prüfen Sie, ob der ausgewählte Zeitraum tatsächlich Ihre Anmeldungen abdeckt (Standard 30 Tage). Wenn Sie das Plugin gerade aktiviert haben, warten Sie, bis Sie einige Ereignisse haben, bevor die Diagramme zum Leben erwachen.

Der A/B-Test zeigt Raten von 0 %

Sie brauchen ein Minimum an Impressionen und Konversionen, damit die Raten aussagekräftig werden. Zählen Sie einige hundert Impressionen pro Variante, bevor Sie die Ergebnisse interpretieren.

Die Geolokalisierung liefert kein Land zurück

Prüfen Sie, ob WooCommerce die MaxMind-Datenbank tatsächlich heruntergeladen hat. Gehen Sie zu WooCommerce → Einstellungen → Allgemein, aktivieren Sie die Standard-Geolokalisierung und warten Sie einige Minuten. WooCommerce hält die Datenbank danach automatisch aktuell.

Wie erzwinge ich die Trennung eines Kontos administrativ?

Gehen Sie zur Tabelle wp_dfsc_connections und löschen Sie die entsprechende Zeile. Bei der nächsten Anmeldung des Benutzers über diesen Anbieter wird er als neue Identität behandelt (und per E-Mail wieder mit seinem WordPress-Konto verknüpft, wenn die automatische Verknüpfung aktiv ist).