# Social Login

{% hint style="info" %}

<pre data-overflow="wrap"><code>You'll need to import the javascript file in your website before starting from this <a data-footnote-ref href="#user-content-fn-1">link</a>.
</code></pre>

{% endhint %}

{% tabs %}
{% tab title="Plain Javascript" %}

```
const { facebook, google, apple } = WTN.socialLogin;

//Login Commands
facebook.login({
  callback : function(value){
    console.log(value)
  }
});

google.login({
  callback : function(value){
    console.log(value)
  }
});

apple.login({
  callback : function(value){
    console.log(value)
  }
})

//Logout Commands
facebook.logout({
  callback : function(value){
    console.log(value)
  }
});

google.logout({
  callback : function(value){
    console.log(value)
  }
});
```

{% endtab %}

{% tab title="ES5+" %}

```
import { 
  login as loginFacebook, 
  logout as logoutFacebook 
} from "webtonative/SocialLogin/facebook"
import { 
  login as loginGoogle, 
  logout as logoutGoogle 
} from "webtonative/SocialLogin/google"
import { 
  login as loginApple 
} from "webtonative/SocialLogin/apple"

//Login Commands
loginFacebook({
  callback : function(value){
    console.log(value)
  }
});

loginGoogle({
  callback : function(value){
    console.log(value)
  }
});

loginApple({
  callback : function(value){
    console.log(value)
  }
})

//Logout Commands
logoutFacebook({
  callback : function(value){
    console.log(value)
  }
});

logoutGoogle({
  callback : function(value){
    console.log(value)
  }
});
```

{% endtab %}

{% tab title="Wordpress Plugin" %}
We  have wordpress plugin for social login integration. Kindly find webtonative wordpress plugin from below link. [**https://wordpress.org/plugins/webtonative/**](https://wordpress.org/plugins/webtonative/)
{% endtab %}
{% endtabs %}

**Callback parameter object**

{% tabs %}
{% tab title="Facebook" %}
Login :-&#x20;

```
{
    "isSuccess":true,
    "accessToken":"EXXXXXQ0iSXpNGVOCMVi000ZAnlslBJIHgXXX2dfkW4HtGLUAuuZCcESjfZXXXQZBZBV",
    "userId":"1XXXXXXXXX519425",
    "type":"fbLoginToken"
}
```

Login Error :-

```
{
    "isSuccess":false,
    "error":"Error message for logout",
    "type":"fbLoginToken"
}
```

Logout :-

```
{
    "isSuccess":true,
    "message":"Logout Success",
    "type":"fbLogOut"
}
```

{% endtab %}

{% tab title="Google" %}
Login :-&#x20;

```
{
    "isSuccess":true,
    "idToken":"EXXXXXQ0iSXpNGVOCMVi000ZHgXXX2dfkW4HtGLUAuuXXXQZBZBV",
    "type":"googleLoginToken"
}
```

Login Error :-

```
{
    "isSuccess":false,
    "error":"Error message for logout",
    "type":"googleLoginToken"
}
```

Logout :-

```
{
    "isSuccess":true,
    "message":"Logout Success",
    "type":"googleLogOut"
}
```

Logout Error:-

```
{
    "isSuccess":false,
    "error":"Error message for logout",
    "type":"googleLogOut"
}
```

{% endtab %}

{% tab title="Apple" %}
Login :-&#x20;

```
{
    "isSuccess":true,
    "idToken":"********",
    "code":"***********",
    "type":"appleLoginToken",
    *"firstName":"FirstNameHere",
    *"lastName":"LastNameHere",
    *"emailId":"support@webtonative.com"
}

```

* \*Apple only returns the user's information the first time the user authorizes the app. Persist this information from your app; subsequent authorization requests won’t contain this information.
* Once you have the user’s token(idToken), you can decode it using any general-purpose JWT library to retrieve user's information.
  {% endtab %}
  {% endtabs %}

**Wordpress plugin:** We  have wordpress plugin for social login integration. Kindly find webtonative wordpress plugin from below link. [**https://wordpress.org/plugins/webtonative/**](https://wordpress.org/plugins/webtonative/)

**Shopify plugin**: We have shopify plugin for social login integration. \
<https://apps.shopify.com/social-login-webtonative>

Note:-

Apple Login is available only in iOS.

[^1]: <https://docs.webtonative.com/javascript-apis/getting-started>


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://docs.webtonative.com/javascript-apis/social-login.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.