Key Benefits
Reibung vermindern
We already have lots of passwords to keep track of, let your members use their Facebook account and save them from remembering one more password.
Verbesserung der Benutzerfreundlichkeit
Mitglieder können sich in Sekundenschnelle anmelden!
Erhöhtes Engagement der Nutzer
Social Login kann es den Nutzern erleichtern, sich auf Ihrer Website zu engagieren, da sie sich schnell und einfach über ihre bevorzugte Plattform anmelden können.
So richten Sie die Facebook-Anmeldung in Webflow ein
Teil 1: Das Backend
Hier ist ein Link zur Facebook-Entwicklerseite.
Wenn Sie sich das obige Video ansehen und Ihre Website testen, werden Sie bei der Anmeldung höchstwahrscheinlich ein Banner mit der Aufschrift "Submit for Login Review" sehen. Um dieses Banner zu entfernen und in den Live-Modus zu wechseln...
- Du musst eine gültige URL für die Datenschutzrichtlinien und eine URL für die Datenlöschungsanweisungen angeben. Sie können diese beiden Eingaben in den Grundeinstellungen auf dem Facebook-App-Dashboard aktualisieren.
- Die URL für die Datenlöschungsanweisungen ist eine Seite auf Ihrer Website, über die Mitglieder die Löschung ihrer Daten beantragen können. - Click "Get Advanced Access" for email and public_profile.
- I had quite a bit of trouble getting the Facebook UI to load properly. If you experience difficulties, I recommend trying again in a private or incognito browser. - Sie müssen einen Data Use Checkup durchführen.
- Schalten Sie Ihre App vom Testmodus in den Live-Modus um.
Teil 2: Das Frontend
Wenn Sie die vorgefertigte Anmelde-, Login- oder Profil-UI von Memberstack verwenden, sind Sie bereits fertig. Aktivierte Social-Auth-Anbieter werden automatisch in der vorgefertigten Benutzeroberfläche angezeigt.
Wenn Sie Ihrem Webflow-Projekt eine Social-Authentifizierungs-Schaltfläche hinzufügen möchten, ist dieser Abschnitt für Sie.
Anmelde- und Login-Formulare
Ich empfehle, eine unserer Webflow-Schaltflächen für die soziale Authentifizierung zu kopieren. Sie sind zu 100 % in Webflow integriert, haben bereits die Attribute, die Sie benötigen, und lassen sich leicht anpassen:
A) Facebook-Schaltfläche mit hellem Thema
B) Facebook-Schaltfläche mit dunklem Thema.
Sie können Ihr eigenes Produkt von Grund auf neu erstellen:
- Überprüfe die Markenrichtlinien von Facebook für Anmeldeschaltflächen.
- Erstellen Sie einen Link-Block mit dem Attribut data-ms-auth-provider="facebook".
- Fügen Sie das Facebook-Logo hinzu.
- Fügen Sie den Text Ihrer Schaltfläche hinzu. Wir empfehlen etwas wie "Weiter mit Facebook".
Das war's mit den Schaltflächen für Anmeldung und Login. Profilschaltflächen haben ein paar zusätzliche Elemente.
Profil-Formulare
In diesem anderen Tutorial werden wir eine Benutzeroberfläche für Mitglieder erstellen, um Anbieter zu verbinden, zuvor verbundene Anbieter anzuzeigen und (optional) Anbieter zu trennen.
