• Topic 主题 トピック Topic Topic
  • Sign in

Enabling Customer Login with Facebook Account

 

SHOPLINE lets customers log in to your store with their Facebook account for quicker one-click checkout, alongside email and phone number registration. This feature requires a Facebook app installed on your store. Since creating a Facebook app is a separate process, set one up before configuring it in the SHOPLINE admin panel.

This guide provides step-by-step instructions for creating the app on Facebook and enabling quick login within your SHOPLINE admin panel.

 

In This Article

 


 

Create a Facebook App and Get Credentials

This section guides you through creating a Facebook app and obtaining the App ID and App Secret needed to enable Facebook login for your SHOPLINE store.

 

Creating a Facebook App 

  1. Log in to Facebook for Developers using your personal account.
    1.1.1_facebook developers.png
    Note: If you don't already have a Meta for Developers account, click Get Started and follow the steps to create one.

 

  1. Click My Apps to access the app settings page.
    1.1.2_facebook developers My Apps.png
  2. Click Create App.
    1.1.3_ facebook developers create app.png
  3. In the "Add use case" step, select Authenticate and request data from users with Facebook Login and click Next.
    1.1.4_authenticate FB login.png
  4. On the "Login type" page, select No, I'm not building a game and click Next.
    1.1.5_not build a game.png

  5. On the "App details" page, enter your desired app name and email address for contact, then click Create app.
    1.1.6_app created.png

 

Setting Up App Permissions and Review

  1. Access the Dashboard page and select Customize adding a Facebook Login button.
    1.2.1_Customize adding a Facebook Login button.png
  2. On the customization page, locate Facebook Login > Settings and click Go to Settings.
    1.2.2_go to settings.png
  3. Proceed with the Client OAuth settings by enabling the following features:
    1.2.3_Client OAuth settings.png
    • Client OAuth login
    • Web OAuth login
    • Use Strict Mode for redirect URIs
    • Enforce HTTPS
  1. Enter your store's URL in the Valid OAuth Redirect URIs field.
    1.2.4_Valid OAuth Redirect URIs.png
    • If your store uses a unique URL, such as https://www.xxx.com, copy and paste the following URL into this field: https://www.xxx.com/user/signIn and replace "xxx" with your store’s handle.
    • If your store uses a free URL, such as https://xxx.shoplineapp.com, copy and paste the following URL into this field: https://xxx.shoplineapp.com/user/signIn and replace "xxx" with your store’s handle.
      Note: If you are unsure whether your store has a unique URL or a free one, you can go to the store homepage and simply copy the URL.
  1. After completing the setup, click Save changes.
    Note: After submission, double-check that Use Strict Mode for redirect URIs is enabled, and save again if necessary.


  2. Return to the app customization page and locate Permissions > Email. Click Add to grant your app permission to access user emails.
    1.2.6_Permissions Email Add.png

  3. (Optional) Submit your app for review if you want to enforce stricter login requirements. Go to Review > Testing and/or Verification to complete the testing and company verification steps as instructed.
    1.2.7_Review Testing.png

 

Configuring Basic Settings & Getting Credentials

  1. Fill out the required details in App settings > Basic based on your store's information.
    1.3.1_App settings Basic.png
    Note: In the Privacy Policy URL field, Enter your store's unique Privacy Policy URL, not SHOPLINE's official URL. 
  2. Once finished, copy the App ID and App secret. You'll need them to complete the Facebook login setup in your SHOPLINE admin panel.
    1.3.2_App ID and App secret.png

 


 

Enable Login with Facebook in the Admin Panel

 

Steps in SHOPLINE Admin

  1. In your SHOPLINE admin panel, go to Settings > Customer account.
    2.1.1_Settings Customer account.png
  2. Locate Sign in through third-party accounts under the "Classic customer account" section and click Edit.
    2.1.2_Sign in through third-party accounts.png
  3. On the Facebook login option, click Link.
    2.1.3_link fb login.png
  4. Enter the copied App ID and App Secret in the pop-up window and click Save.
    2.1.4_Enter the copied App ID and App Secret.png

Congratulations! You've completed the setup. Now, test the feature on your store.

 

Testing Facebook Login 

Access the sign-up/login page of your store and click the Facebook Sign-Up/Login icon. This will prompt customers to log in to their Facebook accounts and grant authorization to your app (the app name and icon will appear).
2.2.1_display.png

Note: Customers must grant access to their Facebook profile to use the login feature.

 

Have more questions? Submit a request

Comments