Signing in with an account people already have removes one more reason to abandon your form.
The Login & Signup block in Nexter Blocks Pro adds a Facebook button to your login or registration form.
For every Login & Signup setting in one place, see the Login & Signup block guide.
Before You Start
- Edition: Pro — the Login & Signup block is part of Nexter Blocks Pro.
- Block to enable: Login & Signup, switched on under Nexter > Blocks in your WordPress dashboard.
- A Facebook app with Facebook Login added, created at Facebook for Developers. You need its App ID and App Secret from Settings > Basic.
- Your site in the app’s settings: add the page holding the form under Valid OAuth Redirect URIs, and your domain under Allowed Domains for the JavaScript SDK.
- A live app: Facebook requires a privacy policy URL and the app switched to Live before other people can use it.
Steps
- Add the Login & Signup block to your page and click Design from Scratch.
- In the Forms panel, set Type to Login.
- Choose a Layout: Inline Form shows the form on the page, Button opens it from a toggle button.
- Open the Login tab, click + Add Field and choose Social Login in the Field dropdown.
- Turn on Facebook and paste your Facebook App Id and Facebook App Secret.
- Choose a button Layout, set a Redirect URL and the Alignment, then save.
How It Behaves
- Visitors click the Facebook button, approve the app, and are signed in to your site.
- If their Facebook email matches an existing account, they are signed in to it.
- Your App Secret is stored on your server and is never sent to the browser; only the App ID is.
- The same Social Login field works on login and registration forms.
Limitations
- Pro only.
- The app must be Live in Facebook, otherwise only its own developers and testers can sign in.
- Facebook only allows sign-in from domains listed in the app, so staging sites need their own entries.
- People whose Facebook account has no email address cannot be matched to a WordPress user.
Troubleshooting
Facebook says the app is not available
Switch the app to Live in Facebook and make sure a privacy policy URL is set.
The button appears but sign-in fails
Check the page address is listed under Valid OAuth Redirect URIs and your domain under Allowed Domains for the JavaScript SDK, then copy the App ID and App Secret again.
