Social Options

You need to install and activate the Traveler Social Login plugin in Theme Settings > Extensions to use those functions

1. Facebook

You need to create an App to login into Facebook then input the App ID in Theme Settings

On the Facebook tab, enable the Facebook Login to allow the user log-in/sign-up with the Facebook account. Copy the Facebook App ID on the Facebook Developer Account to this box

2. Google

Same as Facebook, create an app to get the Client ID and Client Secret

On the Google tab, enable the Google Login to allow the user log-in/sign-up with the Google account. Copy the Client ID and Client Secret on the Google Developer Console to this box

2.1. Create an app

  1. Log in with your Google credentials if you are not logged in.

  2. If you don't have a project yet, you'll need to create one. You can do this by clicking on the blue "Create Project" text on the right side! ( If you already have a project, then in the top bar click on the name of your project instead, which will bring up a modal and click "New Project". )

  3. Name your project and then click on the "Create" button again!

  4. Once you have a project, you'll end up in the dashboard. ( If earlier you have already had a Project, then make sure you select the created project in the top bar! )

  5. Click the “OAuth consent screen” button on the left hand side.

  6. Choose a User Type according to your needs and press "Create". If you want to enable the social login with Google for any users with a Google account, then pick the "External" option! Note: We don't use sensitive or restricted scopes either. But if you will use this App for other purposes too, then you may need to go through an Independent security review!

  7. Enter a name for your App to the "App name" field, which will appear as the name of the app asking for consent.

  8. For the "User support email" field, select an email address that users can use to contact you with questions about their consent.

  9. Under the "Authorized domains" section press the "Add Domain" button and enter your domain name, probably: localhost without subdomains!

  10. At the "Developer contact information" section, enter an email address that Google can use to notify you about any changes to your project.

  11. Press "Save and Continue" then press it again on the "Scopes", "Test users" pages, too!

  12. On the left side, click on the "Credentials" menu point, then click the "+ Create Credentials" button in the top bar.

  13. Choose the "OAuth client ID" option.

  14. Select the "Web application" under Application type.

  15. Enter a "Name" for your OAuth client ID.

  16. Under the "Authorised redirect URIs" section click "Add URI" and add the following URL: https://yourdomain/wp-admin/admin-ajax.php?action=st_googleplus

  17. Click on the "Create" button

  18. A modal should pop up with your credentials. If that doesn't happen, go to the Credentials in the left hand menu and select your app by clicking on its name and you'll be able to copy-paste the "Client ID" and "Client Secret" from there.

  19. Currently your App is in Testing mode, so only limited number of people can use it. To allow this App for any user with a Google Account, click on the "OAuth consent screen" option on the left side, then click the "PUBLISH APP" button under the "Publishing status" section, and press the "Confirm" button.

OAuth API verification FAQs

3. Twitter

3.1. Create Twitter Developer Account

3.2. Create New Project and App

3.3. Edit Your App

Click on your app (eg Traveler Twitter) and edit it in Settings

  • App Name: your app name - Traveler Twitter

  • App Icon: your app icon

  • Description: this app was created to use the Twitter API

  • App Permission: Read Only

  • 3-legged OAuth: set enabled

  • Callback URL: use this suffix after your domain URL /social-login/twitter/callback. For example https://yourdomain.com/social-login/twitter/callback

  • Website URL: your full website URL

  • Organization name: None

  • Organization Website URL: None

  • Terms of service URL: this URL for the term of service page

  • Privacy policy URL: this URL for the privacy policy page

Open your website, navigate to Theme Settings > Social Options. On the Twitter tab, enable the Twitter Login to allow the user login to the Twitter account. Copy the consumer key and consumer secret on the Client ID and Client Secret on the Twitter Developer

Last updated