Contents

How does it work?

User creating an Account for the first time using Sign Up tab

User creating an Account for the first time using Sign In tab

User uses existing Account to sign in using Sign Up tab

User uses existing Account to sign in using Sign In tab

User Signs Up / In with the same email they have used with different provider in past

How do you configure it?

If the market has never set up Social Login, then to set up Google and Apple we need access to their Firebase Apps. For Facebook the market will need to follow the below steps.

Facebook

1. Go to the Facebook Developers site: https://developers.facebook.com/ to create Facebook app for Social Login.

The app needs to be submitted for review and approved by Meta / Facebook!

2. Once logged in, go to My Apps.

3. Click on Create App button. It will lead you to the app creations page.

4. Select "Set up Facebook Login" then click on the Next button to continue.

5. Fill out the App Name, and App Contact Email. Then click the Create App button.

6. You will then get redirected to the App Dashboard page. On the left-side menu, go to Products > Added Products.

7. Click on Quickstart from the Configure drop-down in the Facebook Login product. 

8. Select the Web from the platform to add a Facebook login to our app.

Setting up the app

After you've completed creating the app, head to the app's navigation menu. You need to do the steps below before your app setup is complete.

Go to App Review > Request Permissions and Features

When you click on the  Request Permissions or Features button, you'll be redirected to Facebook Login Use Cases. You can set the permissions for scopes here. Add public_profile and email permission by clicking on the "Add" button. 

Go to Settings > Basic 

This tab contains the App ID and App Secret.

Both must be copied and pasted later into the Ultimate Member> Settings>Extension>Social Login>Facebook Social Connect tab. You must fill in the following information: Privacy Policy URL and Terms of Service URL, and you can also include an app icon to make the app appear more professional.

When you scroll down the page, you will find the Website section. Add your Site URL, then click the "Save Changes" button.

To make the app live, you need to go to the navigation menu and click on "Go Live"

App Setup Complete

After you've done all of that, the app is complete. Add the App ID and App Secret to the Ultimate Member Settings Facebook tab.

Go to Meta for Developers > Settings> Basic  then Copy the App ID and App Secret.

Go to Ultimate Member > Settings > Extension > Social Login > Facebook Social Connect tab, and paste the App ID and App Secret in the Facebook Social Connect App ID and App Secret fields.

Extra App Setup Steps

Enable JS SDK and Allow All Domains

You’ll find this settings page at: https://developers.facebook.com/apps/<APP_ID>/fb-login/settings/

• You’ll need to enable the JS SDK Toggle on the bottom right.

• You’ll need to add all domains related to RBI and production URL in the bottom input field:

  • For example, if it’s Popeyes Spain the list would look like the following:

    Code Block
    poppeyes.es dev-plk-web.es.rbi.tools staging-plk-web.es.rbi.tools qa-plk-web.es.rbi.tools prod-plk-web.es.rbi.tools

Add Allowed Domains to your App:

Similar to the previous step, you also need to add all the allowed domains in the apps configuration page at: https://developers.facebook.com/apps/<APP_ID>/settings/basic/

Lokalise Translation Strings

• signUpWithGoogle (Button to Sign Up with Google)

• signUpWithApple (Button to Sign Up with Apple)

• signUpWithFacebook (Button to Sign Up with Facebook)

• continueWithGoogle (Button to Sign In with Google)

• continueWithApple (Button to Sign In with Apple)

• continueWithFacebook (Button to Sign In with Facebook)

• finishSigningUp (Confirmation screen where user confirms information)

• authErrorDifferentProvider error message when the user registered with Apple but is trying to sign in with Google or vice versa (both using the same email)

• authErrorUserNotFound error message when the email coming from a social provider does not exist (while trying to sign in)

User Consent:

• acceptEmailsAndSpecialOffers.bk (message to user consent if they want to receive special offers and other information from Burger King/Popeyes via email)

• acceptTermsAndPrivacyIntro (message to user consent if they agree to the Privacy Policy and/or Reward Policy for markets which have Loyalty Program in place.)

• agreeCollectionPersonalData (message to user consent: if they agree to collection and use of personal data)

• agreeTransferPersonalDataThirdParty (message to user consent: if they agree to transfer personal data to 3rd party entities)

Optional strings:

• agreeOutsourcingPersonalData (message to user consent: outsourcing of personal data handling)

• agreeTransferPersonalDataOverseas (message to user consent: transfer personal data to an overseas country)

To enable Social Login, LD Flags need to be turned on in Back-end and Front-end:

• enable-social-login

• enable-social-login-apple

• enable-social-login-google

• enable-social-login-facebook

• enable-social-login-apple-native

• enable-social-login-google-native

• enable-social-login-facebook-native