Social Sign In Integration

How to allow guests to sign into the booking widget using social media account credentials

Social Sign In

Social sign in allows you to access websites using your existing social network accounts such as Facebook or Google. For websites that support social sign in, this simplifies the sign up/sign in process by removing the need to create a new account and password specifically for a website.

When using the RoomBoss booking widget, in addition to the traditional sign up/sign in method, optionally, you can allow guests to sign in using their Facebook or Google social media account credentials.

This feature is available for Guest Service and SSMS widget.

Enabling Booking Widget Social Sign In

To enable Facebook Sign-in or Google Sign-in, you need a Facebook App ID and a Google Sign-in Client ID respectively.

If you already have either of these values, you may enter them into RoomBoss, the steps are provided below under Enter Facebook App ID and Google Sign-In Client ID into RoomBoss.

If you would like us to setup social sign in on your behalf please contact us. However, if you would like to do this yourself, instructions on how to create and retrieve the values are provided below.

Create Facebook App ID

  • Navigate to the Facebook Developers page - https://developers.facebook.com/apps/

  • Login or create a new Facebook account

  • For new accounts, click on Get Started to create a new Developers Account or for existing accounts, click My Apps → Add New App

  • Click the + button to add a new app

  • Set the Display Name (This is the name that will appear to the client when asking for permission)

  • Click on Create App ID

  • Scroll down to Add a Product and locate Facebook Login, click Setup

  • Follow the steps to add the Facebook Login

  • Navigate to Facebook Login → Settings

  • Add your domain to the Valid OAuth Redirect URIs field

  • Click Save Changes

  • Navigate to Settings → Basic to retrieve your Facebook App ID

  • Copy your Facebook App ID

Create Google Sign-In Client ID

  • Navigate to the Google API Console - https://console.developers.google.com/apis

  • Login or create a new account

  • Select Project

  • Select New project

  • Set a Project name

  • Navigate to OAuth consent screen

  • Select External for user type, click Create

  • Set application name (this is the name that will appear to the client when asking for permission)

  • Click Save

  • Navigate to the Credentials page

  • Select + CREATE CREDENTIALS → OAuth client ID

  • Select Web Application for Application type

  • Add your URI in the Authorized JavaScript origins field

  • Click Create.

  • The OAuth client created page will display your Your Client ID

  • Copy your Client ID without apps.googleusercontent.com

Enter Facebook App ID and Google Sign-In Client ID into RoomBoss

Inside your RoomBoss account:

  • Navigate to Account → Website Configuration

  • If you have more than one booking widget, locate the desired booking widget listed under Website Configuration

  • Click on the Edit link to the left of your widget

  • Enter your Facebook App ID and/or Google Sign-In Client ID at the bottom of the page

  • Click on the Update Website Configuration button

Booking Widget Facebook and Google Sign Up Customer Experience

The social sign in options are located at the top of the Sign In/Sign Up page. The customer will be taken to this page as part of the booking process.

Click Continue with Facebook or Sign in with Google to use social sign in.

Facebook Sign In Page

Enter Facebook account login credentials and login.

Google Sign In Page

Enter Google account credentials and login.

Once the customer has successfully logged into their social network account, they will be taken to the details form to confirm their details are correct.

Fields will be populated automatically using the existing information (if present) from the customer's Facebook or Google account.

After the customer has confirmed their details are correct, they will click on the Continue button to be taken to the Checkout page.

Last updated