Gigya Job Openings

Share Plugin Demo

Skip to end of metadata
Go to start of metadata

 

See it in Action

 

Please click on one of the buttons below to open the "Share" dialog:

  

 

Read More

Developer Guide

UserAction Object

API Reference

Check Out the Code

 

<html>
<head>
    <style>
	 body {font-family:Arial;font-size: 12px; background-color:#fff; line-height:20px}
	</style>
	<SCRIPT type="text/javascript" lang="javascript" 
	   src="http://cdn.gigya.com/js/gigya.js?apikey=2_Y82PzwJ_chSFImHXaIDJClnLyJzmk-VFOavSsaNTzl6m901s_NNxRAS0xJ3bd3_N">
	</SCRIPT>
    <script type="text/javascript">
        // Create and Publish User's Action
        // This method is associated with the "btnPublishAction" click
        function showShareUI(operationMode) {
		    // Constructing a UserAction Object
		    var act = new gigya.socialize.UserAction();
		    // Setting the title and description 
		    // (will be presented in the preview on the Share UI)
		    act.setTitle("Gigya - Make your site social.");
		    act.setSubtitle("An overview video");
		    act.setDescription("Gigya's technology makes websites social, integrating online businesses with"
		        + " the top social networks using Facebook Connect, Twitter for Websites, " 
		        + "LinkedIn, Foursquare and more.");
            // Setting a link back to the publishing source
		    act.setLinkBack("http://info.gigya.com/GigyaVideoOverviewForm.html");
		    // Adding Action Link
		    act.addActionLink("Gigya site", "http://www.gigya.com");
			// Adding an image (will be presented in the preview on the Share UI)
	        var image = {
	            src: 'http://info.gigya.com/rs/gigya/images/gigyaN-logo.gif',
	            href: 'http://info.gigya.com/GigyaVideoOverviewForm.html',
	            type: 'image'
	        };
			act.addMediaItem(image);
			// Parameters for the showShareUI method, including the UserAction object
			var params = 
			{
			    userAction: act  // The UserAction object enfolding the newsfeed data.	
				,operationMode: operationMode// Opens the Share Plugin either in Simple or Multiselect mode according to the user connection status. 
			    ,snapToElementID: "btnShare" // Snaps the Simple Share Plugin to the share button
				,onError: onError  // onError method will be summoned if an error occurs. 
			    ,onSendDone: onSendDone // onError method will be summoned after 
			                        // Gigya finishes the publishing process.
				,context: operationMode			
				,showMoreButton: true // Enable the "More" button and screen
				,showEmailButton: true // Enable the "Email" button and screen
			};
			// Show the "Share" dialog
			gigya.socialize.showShareUI(params);
		}
		// onError event handler
		function onError(event) {
		    alert('An error has occured' + ': ' + event.errorCode + '; ' + event.errorMessage);
		}
		// onSendDone event handler. 
		// Displays in the status field, the list of providers to which the newsfeed has been 
		// successfully published.
		function onSendDone(event)
		{
		    document.getElementById('status').style.color = "green";
			switch(event.context)
			{
				case 'multiSelect':
					document.getElementById('status').innerHTML = 'The newsfeed has been posted to: '  + event.providers;
					break;
				case 'simpleShare':
					document.getElementById('status').innerHTML = 'Clicked '  + event.providers;
					break;
				default:
					document.getElementById('status').innerHTML = 'Share onSendDone' ;
			}
		}
    </script>
</head>
<body>
    <h4>Please click on one of the buttons below to open the "Share" dialog:</h4>
    <input type=button id="btnShare" onclick="javascript:showShareUI('multiSelect')" value="Advanced Share" />&nbsp;&nbsp;
	<input type=button id="btnShare" onclick="javascript:showShareUI('simpleShare')" value="Simple Share" />
    <div id="status"></div>
</body>
</html>

Notes:

In order to make the above code work in your environment, please note:

  • The API key in the sample will only work on http://localhost/...
  • To load the page from your domain, modify the value of the "APIKey" field in the code to your own Gigya API Key. A Gigya API Key can be obtained from the Site Dashboard page on Gigya's website. Please make sure that the domain from which you are loading the page is the same domain name that you used for generating the API Key.
  • If you are using https, be sure to further adjust the JS API url to: https://cdns.gigya.com/js/gigya.js?apikey=<Your_API_Key>.