Socialid.login.renderConnectWidget

Description

Renders the Social Connect widget within a DOM element.

This widget can trigger the following events:

• socialid.events.onConnectStart
• socialid.events.onConnectSuccess
• socialid.events.onConnectCancel
• socialid.events.onConnectError
• socialid.events.onLoginSuccess
• socialid.events.onDisconnectSuccess
• socialid.events.onDisconnectError

This widget allows to add credentials from different social networks to the same Social Login user. For example, an user can log in with its Facebook and add its Twitter credential, so the next time this user can choose to log in with its Facebook or Twitter account and be referenced as the same user by the website integrating with the Social Login platform.

This widget works as follows:

• if there is an user already logged in the current session, the new credential is added to the user account and the event socialid.events.onConnectSuccess is triggered.
• if there is no user logged in the current session, a new login is created (same behavior as the login widget) and the event socialid.events.onLoginSuccess is triggered.

In summary, it's important to handle these two events. In case of socialid.events.onLoginSuccess it's important to check the login token via server-side to certificate that the user logged in is the same associated to the current website session.

Usage

 socialid.login.renderConnectWidget(containerId, options)

Parameters

containerId	obrigatório	id do elemento DOM onde será inserido o widget
options	opcional	um objeto contendo parâmetros adicionais
theme	opcional	Pode ser "icons", "bricks" ou "labeled_icons". Especifica que tema será usado para montar o widget. Default: "icons".
providers	opcional	Array contendo um ou mais provedores disponíveis para os usuários fazerem login. Atualmente são suportados: "facebook", "twitter", "linkedin" e "gplus". Default: [] (nenhum provedor).
language	opcional	Pode ser "pt_br" ou "en". Define que tradução será usada nos widgets. Default: "en".
showSocialIdLink	opcional	Pode ser true ou false (boolean). Especifica se o link "Powered by Social-ID NOW" será automaticamente mostrado ou não. Default: true.
loadCss	opcional	Pode ser true ou false (boolean). Especifica se o arquivo CSS de temas será automaticamente inserido no documento como um <link>. Default: true.
cssUrl	opcional	Especifica a url do arquivo CSS de temas que será automaticamente inserido no documento como um <link> caso loadCss seja true. Default: "https://app.socialidnow.com/assets/api/themes.css".

Example

Renderiza em "socialid_connect_container" um widget do Social Connect em português ("pt_br"), com Facebook, Twitter, LinkedIn e Google+ disponíveis para serem adicionados como nova conexão ao usuário logado atualmente no Social Login:

 socialid.login.init(1);
 socialid.login.renderConnectWidget("socialid_connect_container", {
   theme: "bricks", 
   providers: ["facebook", "gplus", "twitter", "linkedin"],
   language: "pt_br",
   showSocialIdLink: true,
   loadCss: true
 });

Teste os parâmetros em nosso playground: https://sid-examples.herokuapp.com/social_logins/playground