Page History

Versions Compared

Key

  • This line was added.
  • This line was removed.
  • Formatting was changed.

...

  • The size of the add-on.
  • Which providers' logos it displays, out of the available providers:
    Include Page
    Template_gs All Login Providers 5.3 Uppercase
    Template_gs All Login Providers 5.3 Uppercase
    .
  • The size of the logo buttons.
  • The style of the logo buttons (you can select one of the predefined styles).
  • Whether the add-on is shown as a popup (default) or embedded in the web page.
  • Colors: add-on background, frame, text, link, navigation arrow, caption background, caption text, button text.
  • Anchor
    loginV2
    Version - Version 2 of the login add-on introduced improved and responsive design for the add-on. While new add-on implementations are automated to version 2, it is also possible to upgrade to version 2 by passing the version parameter to the Socialize.showLoginUI method, or through the 'properties' section of the UI Builder. Note that upgrading to version 2 may change the add-on's layout.

...

In this example we add Media ID as the new custom SAML  provider:

HTML
<!--<iframe src="httphttps://s3.amazonaws.com/wikifiles.gigya.com/Socialize/LoginUI_SAML.htm" style="width: 850px; height: 150px;"></iframe>-->

<div id="mediaIdDiv"></div>
<script>
var params3 =
{
    customButton: {
        "type": "saml",
		"providerName":"Media-ID",
		"idpName":"media-id",
		"iconURL": "https://iconsdevelopers.iconarchivegigya.com/iconsdownload/chrisbanks2/cold-fusion-hd/128/mickey-mouse-iconattachments/8563756/loginButton.png",
		"logoURL": "https://iconsdevelopers.iconarchivegigya.com/iconsdownload/chrisbanks2/cold-fusion-hd/128/boid-iconattachments/8563756/loginButton.png",
		"lastLoginIconURL":"https://iconsdevelopers.iconarchivegigya.com/iconsdownload/pinoattachments/disney/32/Mickey-Mouse-1-icon8563756/loginButton.png",
		"position":"4"
    },
    "showTermsLink":false, // 'terms' link is hidden
    "containerID":"mediaIdDiv", // The component will embed itself inside the "loginDiv" DIV (will not be a popup),
	width:200,
	disabledProviders: 'wechat'
}
gigya.socialize.showLoginUI(params3);
</script>

...

Code Block
languagexml
linenumberstrue
<html>
<head>

<!-- including the gigya.social.js script -->
<style>
    body {font-family:arial;font-size:11px}
</style>
<SCRIPT type="text/javascript" lang="javascript"
    src="https://cdns.gigya.com/JS/gigya.js?apikey=2_Y82PzwJ_chSFImHXaIDJClnLyJzmk-VFOavSsaNTzl6m901s_NNxRAS0xJ3bd3_N">
        {
            enabledProviders: 'facebook,twitter,googleplus,linkedin,saml,yahoo,messenger,aol,foursquare,vkontakte,renren,QQ,Sina'
        }
</SCRIPT>
<script type="text/javascript">

// Adding Media ID as a SAML login provider using the 'params' object:
customButtons= [
    { 
	    "type": "saml",
    	"providerName":"Media-ID",
        "idpName":"media-id",
        "iconURL": "https://iconsdevelopers.iconarchivegigya.com/iconsdownload/chrisbanks2/cold-fusion-hd/128/mickey-mouse-iconattachments/8563756/loginButton.png",
        "logoURL": "https://iconsdevelopers.iconarchivegigya.com/iconsdownload/chrisbanks2/cold-fusion-hd/128/boid-iconattachments/8563756/loginButton.png",
        "lastLoginIconURL":"https://iconsdevelopers.iconarchivegigya.com/iconsdownload/pinoattachments/disney/32/Mickey-Mouse-1-icon8563756/loginButton.png",
        "position":"4"
    }
];
var params =
{
    customButtons, // Includes the customButtons array
    "showTermsLink":false, // 'terms' link is hidden
    "containerID":"loginDiv", // The component will embed itself inside the "loginDiv" DIV (will not be a popup),
    width:200
}
</script>
</head>
<body>
<div id="loginDiv"></div>
<script type="text/javascript">
    gigya.socialize.showLoginUI(params);
</script>
</body>
</html>

...