How to Add Facebook Social Login with Magic

How to Add Facebook Social Login with Magic

Supported Platforms

Web   React Native   iOS   Android You can allow your users to sign up & log in to your web app with their Facebook account.

Facebook Login Button Style your Facebook button however you’d like!

👉 Play with a demo


Facebook Setup

After installing the OAuth extension, you can now enable Facebook Login for your Magic app:

  1. Follow Facebook's instructions to register a Facebook app

  2. When creating your Facebook app, select "For Everything Else" to include Facebook Login

Facebook app registration scenario select screen

  1. On the next screen, you'll be presented with different products you can integrate into your Facebook app. Click "Set Up" in the card representing the Facebook Login capability.

Add Facebook Login capability screen

  1. Skip the "Quick Start" flow and go directly to Settings > Basic

Go to Facebook app basic settings

  1. Obtain the "App ID" and "App Secret"

Facebook app basic settings showing app ID and app secret fields

  1. Go to your Magic Dashboard

  2. Select the Magic app for which you’d like to enable Facebook Login, or create a new app

  3. Navigate to Social Login from the sidebar

  4. Click the toggle for Facebook

  5. Input the App ID and App Secret for your Facebook app

  6. Copy the Redirect URI field from your Magic Dashboard

  7. Return to your Facebook Dashboard and go to Facebook Login > Settings

Go to Facebook Login settings

  1. Paste the Redirect URI you obtained from your Magic Dashboard into the "Valid OAuth Redirect URIs" field

Go to Facebook Login settings

  1. In Magic Dashboard, click “Save” – Done! 🎉
How to Add Facebook Social Login with Magic