RealHomes Social Login Setup

In this step by step guide, we will show how to setup login/register with social networks Facebook, Google and Twitter in a RealHomes website as you can see in the following screenshot.

Prerequisites: ensure the RealHomes theme and Easy Real Estate plugin is installed and activated on your website before you follow this guide.

This post will take you through the following sections.

  1. Social Login Settings
  2. Facebook Login Setup
  3. Google Login Setup
  4. Twitter Login Setup

Social Login Settings

For the social login settings navigate to the Dashboard > Easy Real Estate > Settings > Social tab and look for the Social Login Settings section.

Facebook Login Setup

This section allows you to Enable/Disable the login/register with Facebook on login forms and set the App ID* and App Secret* values.

Get your Facebook App Keys

You would need to create a Facebook Login App. Login to the Facebook Developer account using your Facebook account access credentials. After logging in go to the Facebook Apps page and click on Add a New App button.

Provide the Display name and Contact Email address then press the Create App ID button.

There might be a reCaptcha security check to ensure you are not a robot 🙂 Once you pass that check, it will redirect you to the Add Products page.

Click on the Set Up button of the Facebook Login product.

Skip the Quickstart and simply click on the Settings button of the Facebook Login product. Provide your website URL in the Valid OAuth Redirect URIs field and click on the Save Changes button.

Now go to the Facebook App Settings > Basic and provide Privacy Policy URL, Terms of Services URL, App Domain and Choose a Category then click the Save Changes button. After that click on the button next to In development label to make your Facebook App Live as guided in the following screenshot.

Now copy the App ID and App Secret to the Facebook Login settings on your website.

Google Login Setup

This section allows you to Enable/Disable the login/register with Google on login forms and set the API Key*, Client ID* and Client Secret* values.

Get your Google API and Client Keys

You would need to create a Google Project. Login to Google Developer Console with your Gmail account access credentials. Go to the Cloud Resource Manager page and click on the CREATE PROJECT button.

Enter the Project name then select an Organization and Location for your project and press the CREATE button.

Once the project is created, select it and go to its OAuth consent screen page. Select External and press the CREATE button.

Enter the Application name, select Support email, and add Scopes for Google APIs. Ensure required scopes email, profile, and openid are added.

Scroll to the very bottom and add your domain name in Authorized domains. Also, add the Application Homepage link, Application Privacy Policy link and Application Terms of Service link then click the save button.

Now go to the Credentials page and click on the CREATE CREDENTIALS > API key button.

An API Key will be created and you can copy it to the Facebook Login settings on your website.

After that click on the CREATE CREDENTIALS > OAuth client ID button.

Select the Application type as Web application and enter Name. Then set Authorized JavaScript origins and Authorized redirect URIs to your website URL and press the CREATE button.

Client ID and Client Secret will be created and you can copy these keys to the Google Login settings on your website and test login/register with Google from the frontend side of your website.

Twitter Login Setup

This section allows you to Enable/Disable the login/register with Twitter on login forms, set Consumer Key* and Consumer Secret* values.

Get your Twitter App Keys

You would need to create a Twitter App and for that purpose, you must have an approved Twitter Developer account which will take 1 to 2 weeks to get an approved Developer account. For more details, read and follow the Developer application process.

Login to your approved Twitter Developer account using your Twitter account access credentials. Go to the Twitter Apps page and click on the Create an app button.

Provide the fields information of the App details that are pointed in the following screenshot then press the Create/Save button.

Go to the Details of the App you just created and click on the Edit permissions button.

Ensure App permissions are set correctly according to the screenshot given below.

Now go to the Keys and tokens tab and copy the Consumer API Keys to the Twitter Login settings on your website and test login/register with Twitter from the frontend side of your website.

If you follow the above guide properly and still need further assistance regarding any step/section, you can reach our dedicated support team through our support website by clicking here.

Or if you got any feedback about this feature or guide improvement you can share it with us via feedback form by clicking here.