Facebook Account Quick Login / Membership Registration | Shopper App

ECSC.pngShopper_App_EN.png

Since the Facebook login setting requires app-related information, please create the Facebook login feature after publishing the app for the first time. As the Facebook login setting requires the use of app-related information, please add the Facebook login feature after the first successful app release.

 

*Please note: If you have already set up the Facebook login for your online store, you can use the same application on the Meta for Developers and follow Steps 4.2~4.2.2 and 8 for app settings.

 

1. Enter Meta for Developers

Please click this link to enter Meta for Developers, log in with your Facebook personal account, and click My Apps > Create App to start creating a Facebook application.

EN1.png

 

In the "Select an app type" pop-up window, please select "Consumer" to create your app and then follow the steps below to finish the setting.

EN2.png

 

2. Create a Facebook app

Enter the App Display Name and App Contact Email. Please note that the "App Display Name" will be shown to customers during the login process, so it is recommended that you fill in your Store/Brand name. If you have a Meta Business Manager, you can also select a platform you use to manage the app in the optional field, then click Create App

EN3.png

A pop-up window will appear. Please re-enter your password, and click Submit to continue.

 

3. Dashboard

Next, you will be taken to the page of creating an application. Please find "Facebook Login" and click Set up.

EN4.png

 

4. Basic settings

4.1 Setups in [Settings] > [Basic] in the left panel

Please enter the fields with the guide below:

Field Instruction

App ID

Generated automatically. You will use this in [Mobile App Management] > [App Publish Settings] in the store Admin.

App secret

Generated automatically.

Display name

The display name is the user-facing name of your app that will be displayed in the App Center. Please use your application name.

Do not use names that include Facebook or FB, or any names of Facebook products such as Oculus, WhatsApp, or Instagram.

App domains

Required.

This field will require a total of 2 URLs (original domain and URL with subdomain). Please follow the methods below to obtain and paste them, and then press "Enter (Window) / Return (Mac)" on your keyboard to type them in the field until the URL turns into a gray box.

  • If your store uses a unique URL, for example, https://www.test123.com
    Please fill in 2 URLs:
    www.test123.com and test123.com respectively

  • If your store uses a free URL, for example, https://test456.shoplineapp.com
    Please fill in 2 URLs:
    test456.shoplineapp.com and shoplineapp.com respectively

Please change the above text in bold red to your store URL links. If you are unsure of your shop's unique URL or free URL, you can go to the front homepage of the store to copy it.

*Note: Please fill in your store URL instead of the official SHOPLINE URL.

Privacy Policy URL

Required.

The privacy policy is a statement on how the website will use the personal data of Internet users. If the website user agrees to the privacy policy statement, it will be effective as a standard form contract. The reveal of "Privacy Terms" in your store is one of the key reviews for applying for payment, Google Advertising, Facebook App, and so on.

 

You are recommended to go to [Online Store Design] > [Pages] in the Admin and edit the default "Privacy Policy" page, or create a "Privacy Policy" page with a text or advanced page, then paste the page link to this field.

  • If your store uses a unique URL, you will get a similar URL like:
    https://www.test123.com/pages/privacy-policy
  • If your store uses a free URL, you will get a similar URL like:
    https://test456.shoplineapp.com/pages/privacy-policy 

Please change the above text in bold red to your store URL links. If you are unsure of your shop's unique URL or free URL, you can go to the front homepage of the store to copy it.

*Note: Please fill in your store URL instead of the official SHOPLINE URL.

Terms of Service URL

Recommended.

This URL link will be displayed in the "App Terms" of the Facebook login application window. We will advise you to edit your store's default "Terms and Conditions" page and describe your service policy and transaction details based on your situation. Then, paste the page URL in this field.

App icon

Required.
Category

Required.

Please select the appropriate option from the menu according to the type of store or services offered in your store. 

Verifications

(Skip)

Data Protection Officer contact information

Please fill in the actual information.

 

4.2 Add iOS and Android platforms

Scroll down the page and click + Add platform. Select iOS and/or Android and click Next.

EN5.png

 

When selecting "Android", please select Google Play in the drop-down menu.

EN6.png

 

4.2.1 App set-up guide for iOS

Field Instruction

Bundle ID

You can copy it from "App Information" in Apple Store Connect.

bundle_ID_EN.png

iPhone Store ID

You can copy the Apple ID from "App Information" in Apple Store Connect.

Apple_ID_EN.png

URL Scheme Suffix

(Empty)

iPad Store ID

Please leave it empty since the feature currently does not support iPad

Shared secret

(Empty)

Deep Linking

Off by default

Log-in app events automatically (recommended)

On by default

Confirm mobile app ownership

(Skip it for now)

EN7.png

 

4.2.2 App set-up guide for Android

Field Instruction

Key hashes

  1. Please obtain SHA-1 certificate fingerprint in Google Play Console > [Setup] > App integrity.SHA1_EN.png
  2. Go to a decoder website to convert the certified fingerprint into base64 code. The content in "Output" is the key hashes for the Meta for Developer.
    ZH10.png

Deep Linking

Off by default

Log in-app events automatically (recommended)

On by default

Google Play credentials

Off by default

Package Names

Please copy the name in bracket after "package name:" in Google Play Console [Setup] > [App integrity] > [Digital Asset Links JSON]

package_name_EN.png

Please ignore it if there is a verification error prompt.

Class Name

(Empty)

Confirm mobile app ownership

(Skip it for now)

Install Referrer Decryption Key

Uneditable 

EN8.png

 

5. Advanced settings

Please move on to [Settings] > [Basic] in the left panel to enter the fields with the guide below.

All the fields filled on the page are default values and do not need to be modified. The "Client token" is automatically generated. Please copy the token to the [Mobile App Management] > App Publish Settings] > [Third-party Integration Settings] section.

EN9.png

 

6. Facebook login setup

Please go to [Facebook Login] > [Settings] in the left panel to set up according to the guide below:

Section

Field

Instruction

Client OAuth settings

Client OAuth login

Yes by default

Web OAuth login

Yes by default

Enforce HTTPS

Yes by default

Force Web OAuth reauthentication

No by default

Embedded Browser OAuth Login

No by default

Use Strict Mode for redirect URIs

Yes by default

Valid OAuth Redirect URIs

You can leave this field blank if your store only enables the third-party login function in the App.

If your store also enables third-party login in the online store, please enter the Valid OAuth Redirect URI from your settings for Facebook Account Quick Registration / Member Login.

Login from Devices

No by default

Login with the JavaScript SDK

No by default

Allowed Domains for the JavaScript SDK

(Skip)

EN10.png

 

Guides to set up the sections below are as follows:

Section

Field

Instruction

Deauthorize

Deauthorize callback URL

(Skip)

Data Deletion Requests

Data Deletion Request URL

Please select "Data deletion callback URL" from the drop-down menu. If the field is blank, please enter the store homepage URL, e.g., https://www.test123.com or  https://www.test123.com.tw

Please make sure to fill in the securely encrypted URL starting with https: //

Login Connect with Messenger

Page ID

 

Click Add at the top right and enter the Page ID in the pop-up window.

EN11.png

Redirect URI Validator

Redirect URI to Check

(Skip)

 

7. App review

Before you request a review

Before you request permissions or features, please make sure you have filled in the Privacy Policy URL and Terms of Service URL in the Basic settings and the Data Deletion Request URL in the [Facebook Login] > [Settings]

 

Confirm application data authorization status

Please go to [App Review] > [Permissions and Features] to confirm and enable the email and public_profile options to obtain advanced access permissions.

*Note: If your application is disabled by Facebook, you will need to complete the Facebook review before you can turn on the advanced access authorization. Please confirm that the application settings are correct and then submit it for re-review to Facebook for confirmation.

EN12.png

 

Obtain permission successfully

You will find the access levels for the two permissions that have turned into "Advanced Access."EN13.png 

Confirm application status

Please check the toggle switch next to the "Application ID" at the top of the App page. The switch should be "Live" so that the application can be used. (If the switch is off, it will show "In Development" status.)

If the application is turned off, customers will not be able to log in to the store with their Facebook account.

EN14.png

 

8. Admin setup

Step 1

Proceed to SHOPLINE Admin > [Mobile App Management] > [App Publish Settings], click the "Add third-party services" drop-down menu and select Facebook Login.

EN15.png

 

Step 2. Fill in the Facebook app info

Paste the App ID from Basic settings and Client token from Advanced settings in Meta for Developers to the fields in the pop-up window. Check the box to confirm and click Save.

EN16.png

 

Step 3

Click Submit an app publish review to update the app. 

After adding the Facebook Login feature, you need to publish an app update. After the platform receives the publish application, the new app version will be released within 5-7 working days.

EN17.png

 

 

 

 

 

Have more questions? Submit a request

Comments