Social Webform Javascript API

From Social ID Developers
(Difference between revisions)
Jump to: navigation, search
(→Example)
 
(10 intermediate revisions by 3 users not shown)
Line 1: Line 1:
 +
<span style="color: red; font-weight: bold">Deprecation notice:</span> this API is deprecated since July 19, 2018.
 +
 
== Description ==
 
== Description ==
  
−
Renderiza o widget do Social Webform em um elemento do DOM.
+
Renders the Social Webform widget in a DOM element.
  
 
== Usage ==
 
== Usage ==
Line 11: Line 13:
 
{|
 
{|
 
! align="left" width="200px" | elementId
 
! align="left" width="200px" | elementId
−
| width="200px" | obrigatório
+
| width="200px" | required
−
| id do elemento DOM onde será inserido o widget.
+
| Id of the DOM element where the widget will be rendered.
 
|+
 
|+
 
! align="left" width="200px" | campaign_id
 
! align="left" width="200px" | campaign_id
−
| width="200px" | obrigatório
+
| width="200px" | required
−
| o identificador numérico do Webform.
+
| Webform numeric identifier.
 
|+
 
|+
 
! align="left" width="200px" | app_id
 
! align="left" width="200px" | app_id
−
| width="200px" | opcional (*)
+
| width="200px" | optional (*)
−
| o identificador numérico da aplicação de Social Login. (*) Para Webforms integrados ao Social Login esta opção é obrigatória.
+
| Social Login numeric identifier. (*) This option is required for Social Login-integrated Webforms.
 
|+
 
|+
 
! align="left" width="200px" | mode
 
! align="left" width="200px" | mode
−
| width="200px" | opcional
+
| width="200px" | optional
−
| pode ser "modal" ou "embedded". Especifica o modo de renderização do widget. "Modal" abre um diálogo modal ao se clicar no elementId. "Embedded" renderiza o widget do Social Webform dentro do elementId. Default: "modal".
+
| Can be "modal" or "embedded". Specifies how the widget will be rendered: "modal" opens a modal dialog after a click at the element; "embeddeed" renders the widget inside the element. Default: "modal".
 
|+
 
|+
 
! align="left" width="200px" | closeLinkLabel
 
! align="left" width="200px" | closeLinkLabel
−
| width="200px" | opcional
+
| width="200px" | optional
−
| link mostrado no canto superior direito do diálogo que, ao ser clicado, fecha o diálogo. Default: "Close".
+
| link, shown at the upper right side of the dialog, that when clicked closes the dialog. Default: "Close".
 
|+
 
|+
 
! align="left" width="200px" | style
 
! align="left" width="200px" | style
−
| width="200px" | opcional
+
| width="200px" | optional
−
| objeto que pode ser usado para customizar o layout dos elementos criados para mostrar o webform em modo diálogo (overlay, content, closeLink e iframe) ou embedded (iframe). Veja a estrutura HTML do widget e o source do Javascript inserido pelo widget para maiores detalhes sobre esta customização.
+
| Object that can be used to customize the layout of the elements created by the webform in "modal" (overlay, content, closeLink e iframe) or "embedded" mode (iframe). Refer to the HTML structure for the widget and the JavaScript source code for more details.
 +
|+
 +
! align="left" width="200px" | view
 +
| width="200px" | optional
 +
| A JavaScript function responsible for rendering the widget. The default function is determined by the option "mode", but it is possible to use a custom function. Refer to the JavaScript source code for more details.
 
|+
 
|+
 
! align="left" width="200px" | doc
 
! align="left" width="200px" | doc
 
| width="200px" | <span style="color: red">deprecated</span>
 
| width="200px" | <span style="color: red">deprecated</span>
−
| uma referência ao documento onde estão os elementos a serem manipulados. Default: window.document.
+
| A reference to the document that contains the elements to be manipulated. Default: window.document.
 +
|+
 +
! align="left" width="200px" | url
 +
| width="200px" | <span style="color: red">deprecated</span>
 +
| Url to be loaded inside the iframe created by the Widget.
 
|+
 
|+
 
! align="left" width="200px" | connection_id
 
! align="left" width="200px" | connection_id
 
| width="200px" | <span style="color: red">deprecated</span>
 
| width="200px" | <span style="color: red">deprecated</span>
−
| o identificador de uma conexão ativa de um usuário para Webforms integrados ao Social Login. Esta opção não é mais utilizada atualmente, o connection_id é identificado automaticamente a partir da sessão do usuário logado ao Social Login.
+
| Numeric identifier of an active connection for Social Login-integrated Webforms. This is no longer used, since the connection_id is automatically identified from the current session.
 
|}
 
|}
  
 
== Example ==
 
== Example ==
  
−
Renderiza em "socialid_webform_container" um widget do Social Webform em modo "modal":
+
Renders a Social Webform widget in "modal" mode at the element "socialid_webform_login_container":
  
 
   SocialId.Campaign.init({
 
   SocialId.Campaign.init({
Line 54: Line 64:
 
   });
 
   });
  
−
Renderiza em "socialid_webform_login_container" um widget do Social Webform integrado ao Social Login em modo "embedded", com dimensões customizadas em 400x800 px:
+
Renders a Social Webform widget integrated with Social Login in "embedded" mode with custom dimensions at the element "socialid_webform_login_container":
  
 
   SocialId.Campaign.init({
 
   SocialId.Campaign.init({
Line 69: Line 79:
 
   });
 
   });
  
−
Veja exemplos de webforms em: https://sid-examples.herokuapp.com/campaigns/
+
See webform examples at: https://sid-examples.herokuapp.com/campaigns/
 +
 
 +
== Javascript Source ==
 +
 
 +
The source code for this API is available at the following URLs:
 +
 
 +
  https://app.socialidnow.com/assets/marketing/registration_widget.js
 +
  https://app.socialidnow.com/javascripts/marketing/registration_widget.js

Latest revision as of 16:03, 29 October 2018

Deprecation notice: this API is deprecated since July 19, 2018.

Contents

Description

Renders the Social Webform widget in a DOM element.

Usage 

 SocialId.Campaign.init(options)

Options

elementId required Id of the DOM element where the widget will be rendered.
campaign_id required Webform numeric identifier.
app_id optional (*) Social Login numeric identifier. (*) This option is required for Social Login-integrated Webforms.
mode optional Can be "modal" or "embedded". Specifies how the widget will be rendered: "modal" opens a modal dialog after a click at the element; "embeddeed" renders the widget inside the element. Default: "modal".
closeLinkLabel optional link, shown at the upper right side of the dialog, that when clicked closes the dialog. Default: "Close".
style optional Object that can be used to customize the layout of the elements created by the webform in "modal" (overlay, content, closeLink e iframe) or "embedded" mode (iframe). Refer to the HTML structure for the widget and the JavaScript source code for more details.
view optional A JavaScript function responsible for rendering the widget. The default function is determined by the option "mode", but it is possible to use a custom function. Refer to the JavaScript source code for more details.
doc deprecated A reference to the document that contains the elements to be manipulated. Default: window.document.
url deprecated Url to be loaded inside the iframe created by the Widget.
connection_id deprecated Numeric identifier of an active connection for Social Login-integrated Webforms. This is no longer used, since the connection_id is automatically identified from the current session.

Example

Renders a Social Webform widget in "modal" mode at the element "socialid_webform_login_container": 

 SocialId.Campaign.init({
    campaign_id: 153,
    closeLinkLabel: 'Close',
    elementId: 'socialid_webform_container',
    mode: 'modal'
 });

Renders a Social Webform widget integrated with Social Login in "embedded" mode with custom dimensions at the element "socialid_webform_login_container": 

 SocialId.Campaign.init({
    campaign_id: 117,
    app_id: 54,
    elementId: 'socialid_webform_login_container',
    mode: 'embedded',
    style: {
       iframe: {
          width: '400px',
          height: '800px'
       }
    }
 });

See webform examples at: https://sid-examples.herokuapp.com/campaigns/

Javascript Source

The source code for this API is available at the following URLs: 

  https://app.socialidnow.com/assets/marketing/registration_widget.js
  https://app.socialidnow.com/javascripts/marketing/registration_widget.js
Retrieved from "https://dev.socialidnow.com/index.php?title=Social_Webform_Javascript_API&oldid=2670"
Personal tools
Namespaces
Variants
Actions
Navigation
Toolbox