You are not logged in.   Log in | Register

Socialize Module for Drupal

From $1

 

Introduction

Gigya Socialize Module for Drupal provides a single API that aggregates authentication and social APIs from Facebook Connect, MySpace ID, Twitter, Yahoo and OpenID providers including Google, AOL and WordPress. The Gigya module for Drupal is fully configurable, requiring little time to install.

Gigya’s Socialize Module for Drupal makes it easy for Drupal site owners to:

  1. Authenticate users via Facebook, MySpace, Twitter and other OpenID providers, thereby increasing site registration rate by over 30%.
  2. Increase user acquisition by enabling users to invite friends to the site, or to share site content or a specific event.
  3. Increase site traffic by sending user status updates, tweets and newsfeed events to social networks. Drupal site owners can couple user actions on the site with sending social network status updates, tweets, and publishing newsfeed items.
  4. Customize the user experience by making it easy for sites to integrate user profile and social graph data
  5. Easily configure user experience, design, and module functionality using the Drupal administration panel.

 

We invite you to watch our webinar, which provides a walkthrough of the Gigya Socialize Module and tips for implementing it on your Drupal site.

Installing the Gigya Socialize Module

Installing the Gigya Socialize module requires a bit more than downloading and enabling the module. Please follow the Gigya Module installation steps:

  1. Download the module here and install, following to the usual module installation process.
     
  2. Sign up for an account on the Gigya website.
     
  3. Configure your site details in the Site setup section of the Gigya website. The Socialize Setup wiki page provides detailed instructions and steps for setting up your site, as well as specific directions for setting up applications in Facebook, MySpace, Twitter and Yahoo. Administrators can either setup applications on the social networks or have Gigya provide these applications for your site.
    Note: please make sure you have enabled status updates in Facebook as part of your setup process.
     
  4. Copy the Gigya API Key and the Secret Key from Gigya's Site setup page:

    SiteSetup_Keys.png 

    On your Drupal site, go to Administer->Site Configuration->Gigya and paste the Gigya API Key and the Secret Key in the corresponding text fields at the top of the page:

    Drupal_ConfiguringKeys.gif 

     

Note: Please make sure you have installed the preliminary required modules, which are defined in the Dependencies section on the Gigya Socialize Module page on drupal.org

 

Configuring the Gigya Socialize Module

To configure the Gigya Socialize Module, login as Site Administrator and then go to Administer->Site Configuration->Gigya. Your configuration options are:

 

Networks available to socialize

Select the social networks that you wish to make available for user authentication:

Drupal_ConfNetworks.gif 

Your selection will affect the user interface of the Gigya Login Component, which will now display the icons of the selected social networks:

Drupal_Login.gif

 

Share with a friend settings

This feature enables the user to send a direct message ("notification") in Facebook and Twitter, telling friends about a particular content item and driving traffic back to your site via the link in the notification. Enabling this feature will add a link to the links area at the bottom of each content item. When the user clicks the link, a popup dialog opens, in which the user can select friends and send them a message about the related content item. You may configure the "Share with friends" feature in the following ways:

  • Specify the text of the link.
  • Determine which content types will include this feature. For example, if you select "Story", a "Share with friends" link will appear at the bottom of each Story in your site.
  • Specify the default text message that will be suggested to the user.

In the following example, we specify the following configuration: the link text will be "Share with friends" and the link will appear at the bottom of each Page but not at the bottom of each Story. You may also see the specified text for the suggested message:

 Drupal_ConfShare.gif

This is a screenshot of the outcome - a "Share with friends" link at the bottom of a Page:

Drupal_Share1.gif

When a user clicks the link, a popup opens enabling the user to select friends. The popup displays the "suggested message" text previously specified. Pressing the "OK" button will send a notification to all selected friends.

Drupal_Share2.gif

 

Socialize status update options

The "status update" feature enables the user to automatically post status updates to his social network profile when creating or editing content on the Drupal site.

If you choose to do so, you may add a small "Post update to Social Network" sub-form to the bottom of the Node-Add and Note-Edit forms, as shown in the following screenshot:

Drupal_SetStatus.gif

Using this sub-form, the user may edit the default suggested status text and select whether or not to post it. If the user decides to post, her status will be updated automatically when pressing the "Save" button. The user's status will be updated on all the social networks to which the user is currently connected and which support status updates. The following social networks currently support status updates: Facebook, Myspace, Twitter, Yahoo.

 

You may configure the status update feature by:

  • Determining which content types will include this feature. For example, if you select "Page", the "Post update to Social Networks" sub-form will appear at the bottom of the "Create Page" and the Page>Edit forms.
  • Specifying the default text that will be suggested to the user to be the status text. The text may include the following replacement texts: !url, !url-alias, !tinyurl, !title and !user. 

 

In the following example, we chose to add the "Post update to Social Networks" sub-form only to Story related forms. We have also edited the suggested status text:

Drupal_ConfStatus.gif

This is a screenshot of the outcome - a "Post update to Social Networks" sub-form at the bottom of a Create Story form. Please note, too, that we have specified a suggested status text:

Drupal_SetStatus.gif

 

When the user clicks the "Save" button, his status will be automatically updated on all the social networks to which he is connected. The following screenshot shows the new status posted on Facebook:

Drupal_SetStatusFB.gif

Please note the translation of !user, !title and !tinyurl in the status text.

 

Parameters for Login UIConfig

In this section you may configure the user interface of the Login block area.

Drupal_LoginBlock.png 

Login configuration options are:

Required capabilities for login providers

Drupal_ConfLogin-Capabilities.png

"Provider" refers to a social network or an OpenID provider, such as Facebook, Myspace, Yahoo, Gmail, etc, which is used for authentication and social services.

Each checkbox represents capabilities which the provider may possess. Not all the providers possess the entire list of capabilities. The following list specifies the capabilities of each currently supported provider:

  • login - supported by all the providers.
  • notifications - currently supported by Facebook and Twitter.
  • friends - currently supported by Facebook, MySpace, Twitter and Yahoo.
  • status - currently supported by Facebook, MySpace, Twitter and Yahoo.
  • newsfeed - currently supported by Facebook and Yahoo.

For example, if you check the "friends" checkbox, your Socialize Login component will include only providers which support friends. This currently means that your Socialize Login component will include only Facebook, MySpace, Twitter and Yahoo buttons. In the future, however, if more providers support "friends" these providers will automatically figure on the Login component.

Suppress Drupal login

If you check the following checkbox, your Login block area will include only the Gigya Socialize Login component and exclude Drupal's standard login.

Drupal_ConfLogin-SuppressDrupal.png        Drupal_ConfLogin-SuppressDrupal2.png

 

Note: Adding "/user" to your site's URL points to a page that includes the standard Drupal login. If you disable the standard Drupal login, the site administrator will be able to log in via the "/user" page.

 

Allow Public Registrations

This section is an extension and refinement of Drupal's standard "User" settings->"Public Registration" section. We have introduced a new option: whether or not to allow users to create regular Drupal accounts outside Socialize.

Drupal_ConfLogin-PublicRegistration.png

 

The first option, which is a new option that is not offered by the standard Drupal "User" settings, means that users can create new accounts only via Socialize registration. This option should be used in conjunction with checking the "Suppress Drupal login" checkbox above.

The second and third options allow users to create Drupal accounts directly, without using Socialize. This is possible only if the "Suppress Drupal login" checkbox above is not checked.

Component Design

This following configuration section provides several parameters for configuring the look-and-feel of the Gigya Socialize Login component. You can specify captions, sizes and colors:

Drupal_ConfLogin-Look-n-Feel.png       Drupal_ConfLogin-Look-n-Feel2.png

Advanced Settings

The following section provides some options for advanced UI configuration:

Drupal_ConfLogin-Advanced.png 

URL redirect after login

This field provides the option of specifying the URL to which users will be redirected after they log in. The default setting redirects the user to the "user" page. The URL you enter in this field should be relative to your site URL and should not contain an initial or final slash. Please do not enter the entire URL. For example, let's assume your site's URL is "www.yoursite.com" and you enter "node/add" in this field. In this case, your users will be redirected to "www.yoursite.com/node/add" after logging in.

Custom Login Icons URL

This field lets you replace the icons of the social network buttons on the Login UI.

 

Drupal_ConfLogin-CustomIcons2.png         Drupal_ConfLogin-CustomIcons.png 

 

To replace the icons, first create a resource library SWF file which contains your custom icons (for guidance, please consult the Create a SWF file which contains your custom icons section), then enter the URL of your SWF file in this field.

LoginUI container ID

In this field, you can define an alternative container in which the Gigya Login Component will be displayed. By default, the component is placed in divConnect, which is Drupal's standard Login block area.

Use Facebook Connect

When this checkbox is checked, Gigya Socialize will pop-up the Facebook Connect UI when logging in the user using her Facebook account (i.e., when the user presses the Facebook button on the Login UI). For more information, please refer to Using Facebook Connect

Login UIConfig Advanced coding

The Gigya website features a Login Component Setup Wizard. This Setup Wizard allows you to modify some settings, while previewing the changes as you make them. The Wizard then generates code which is based on your modifications. You may grab the generated code and paste it into the "Login UIConfig Advanced coding" textbox. The settings which the code in this textbox provides override the corresponding Login UI settings that are defined in this page.

Gigya's Login Component Setup Wizard:

LoginSetupWizard.png

 

Drupal_ConfLogin-AdvancedCoding.png

Parameters for friends UIConfig

The Gigya Socialize Friends Selection component appears inside a popup whenever a user clicks a "Share with Friends" link. The component presents the user's list of friends from all the social networks to which he is connected. The component lets users browse and select a group of friends to whom they can send messages (you can find a screenshot of the Friends Selection component in the Share with a friend settings section above).

This configuration section provides several options for configuring the look-and-feel of the Gigya Socialize Friends Selection component.

You may specify caption, sizes and colors:

 

Drupal_ConfFriends-basic.png    Drupal_ConfFriends-basic2.png

 

Advanced Settings

The following section provides some options for advanced UI configuration:

FriendsUI container ID

In this field, you can define an alternative container in which the Gigya Friend Selection Component will be displayed

Friends UIConfig Advanced coding

The Gigya website provides a Friend Selection Component Setup Wizard. The Setup Wizard lets you modify some settings, while previewing the changes as you make them. The Wizard generates code which is based on your modifications. You may grab the generated code and paste it into the "Friends UIConfig Advanced coding" textbox. The settings provided by the code in this textbox overrides the Friends UI settings above.

 

Parameters for editConnections UIConfig

The Gigya Socialize Edit Connections component enables ones to establish connections to additional social networks and disconnect existing connections. In addition to being able to login using a specific social network,  users can connect to additional social networks so they can send status updates, share with friends, etc. on multiple social networks. This also applies to regular Drupal logged in users. So, users who logged in using the standard Drupal login can now connect to one or more social networks and see their friends, send status updates, etc.

The Gigya Socialize Edit Connections component appears in My Account -> Edit -> Social Networks:

Drupal_editConnections.png

The component displays user information from each social network to which the user is connected. It also provides a disconnect option and enables the user to connect to all the social networks to which she is not connected.

The configuration section provides several parameters for configuring the look-and-feel of the Gigya Socialize Edit Connections component.

Required services for socialize connect

Drupal_ConfConnections-Capabilities.png 

In this section you can determine which social networks will be available for the user to connect to, using the Edit Connections component.

Each of the checkboxes represents a Social Network capability. Not all the Social Networks possess the entire list of capabilities. The following list specifies the capabilities of the currently supported providers:

  • login - supported by all the Social Networks.
  • notifications - currently supported only by Facebook.
  • friends - currently supported by Facebook, MySpace, Twitter and Yahoo.
  • status - currently supported by Facebook, MySpace, Twitter and Yahoo.
  • newsfeed - currently supported by Facebook and Yahoo.

For example, if you check the "newsfeed" checkbox, your Edit Connections component will include only social networks which support newsfeeds. Currently this means that your Edit Connections component will include only Facebook and Yahoo buttons. In the future, however, if more social networks support newsfeeds they will automatically appear in the Edit Connections component.

Design customization

You may specify caption, sizes and colors for the Edit Connections component. This is done in the same way as for the Friend Selector and Login Components.

Advanced Settings

The following section provides some advanced UI configuration settings:

editConnectionsUI container ID

In this field you may define an alternative container in which you want to display the Gigya Friend Selection Component.

editConnectionsUI UIConfig Advanced coding

This textbox is for advanced UI customizations. It employs Gigya's UIConfig parameter, which is an XML string that provides detailed control over the look-and-feel of the component. The settings provided by the code in this textbox override the Edit Connections UI settings above.

Gigya <=> Drupal Profile Mappings

This section enables one to configure the mapping between user information fields that Gigya provides (by pulling from social networks) and profile fields in the Drupal website. The mapping configuration is used in the user registration - the registration form will be pre-populated with data pulled from the user's social network.

This configuration section includes the list of profile fields defined in your Drupal website. Each profile field includes a dropdown with fields that Gigya can provide. The list of fields that Gigya can provide depends on which social network the user is connected to and what information he has provided on that network.

Drupal_ConfMapping.png

 

Socialize Actions and Triggers

The option of using Actions and Triggers constitutes a significant part of the customizable abilities which the Gigya Socialize Module features.

The Gigya Socialize Module provides two Drupal advanced actions:

  1. Post to Gigya Socialize Newsfeed Action
  2. Update Social Network Status with Gigya Socialize Action

These actions need to be created and configured first before they may be used.

Once you have configured the Gigya Module Actions, the next step is to proceed to the Triggers Module page and assign these actions to system events.

 

This section explains how to create and configure the Gigya Socialize Actions, and provides a walkthrough example for each Action.

 

Post to Gigya Socialize Newsfeed Action

This action generates and posts a Newsfeed. The Newsfeed feature is currently supported by Facebook and Yahoo. The configuration options for this Action are:

  • Edit the Description text, so as to make this action easily identifiable.
  • The Action Template is provided by default. This field defines the structure of the Newsfeed message. In most cases there is no need thto edit this field. The default structure is "{actor} {action} {thing}", where:
    • {actor} is translated to the user name
    • {action} is populated with the text that you define in the Default Action (Verb) Message field below.
    • {thing} is translated to the title of the content element that the user acts upon
  • Define the action text in the Default Action (Verb) Message field. A few examples of relevant texts for this field: "has posted", "is viewing", "has commented on" and so on.
    Hint: the message text is typically related to the Trigger to which we wish to assign this action. For example, if we want to assign this action to the "After saving a new post" Trigger, then a proper text for this field would be: "has posted".
  • Restrict newsfeed items to the following content types - Select the content types in the context of which this action will be triggered.

 

Walkthrough Example

In this example, we would like to have a Newsfeed posted each time a user comments on a Story. 

Step 1: Create a new "Post to Gigya Socialize Newsfeed" Action. 

Step 2: Configure the Action:

  • Edit the Description text: we have concatenated "- Comment" to the default text (as shown in the screenshot below).
  • In the Default Action (Verb) Message field, type the text: "has commented on".
  • Select "Story" in the Restrict newsfeed items to the following content types field.

Drupal_ActionNewsfeed.png

  • Hit the "Save" button.

 

Step 3: Assign Action to Trigger

  • Proceed to the Comments Triggers page:  Administer->Site Building->Triggers->Comments.
  • Find the relevant Trigger: "After saving a new comment".
  • Select the relevant Action: "Post to Gigya Socialize News Feed - Comment".
  • Press the "Assign" button.

Drupal_ActionNewsfeed-Assign.png

 

That's it! From now on, each time a user comments on a Story, a new Action will automatically be added to his Facebook Newsfeed and Yahoo Updates, as shown below:

 

Drupal_ActionNewsfeed3.png

 

The above screenshot is of a generated Newsfeed as it appears on Facebook, where:

"Assaften" is the user name.

"has commented on" is the Default Action (Verb) Message we had defined in step 2.

"Sunday Story..." is the title of the Story that the user ("Assaften") has commented on.

Update Social Network Status with Gigya Socialize Action

When this Action is triggered, the user will be presented with a popup which gives her the option to update her status on her social networks. The configuration options for this Action are:

  • Edit the Description text, so as to make this action easily identifiable.
  • Restrict status updates to the following content types - select the content types in the context of which this Action will be triggered.

      The following configuration fields are relevant if this Action is triggered by a "Users" Trigger (e.g., "Trigger: After a user account has been created"):

  • User status update description - the description which will be presented to the user on the update status popup. 
  • User default message - the default text which will be suggested to the user as the status text.

      The following configuration fields are relevant, if this Action is triggered by a "Content / Comments" Trigger (e.g., "Trigger: After saving a new comment"):

  • Node/comment status update description - the description which will be presented to the user on the update status popup. 
  • Node/comment default message - the default text which will be suggested to the user as the status text.

 

Walkthrough Example

In this example, we would like to update the user's Status each time he creates a new Story.

Step 1: Create a new "Update Social Networking Status with Gigya Socialize" Action.

Step 2: Configure the Action:

  • Edit the Description text: we have altered the default text to be "Update Social Networking Status - Post Story"  (as shown in the screenshot below).
  • Select "Story" in the Restrict status popup items to the following content types field.
  • Optional - edit the Node/comment status update description and the Node/comment default message text fields. These two fields are relevant in this case, since this Action is going to be triggered by a Content related Trigger. In our example, we have altered the default message to be: "I have posted !title, come take a look: !tinyurl" (as shown in the screenshot below).

Drupal_ActionStatus.png

 

Step 3: Assign Action to Trigger

  • Proceed to the Content Triggers page:  Administer->Site Building->Triggers->Content.
  • Find the relevant Trigger: "After saving a new post".
  • Select the relevant Action: "Update Social Networking Status - Post Story".
  • Press the "Assign" button.

Drupal_ActionStatus-Assign.png

 

That's it! From now on, each time a user creates and saves a new Story, he will be presented with the following popup:

Drupal_ActionStatus-popup.png

Please note the default Update Status message that is suggested to the user (hint - this is the text that we have entered in the Node/comment default message text field in Step 2).

If the user chooses to press the "Save" button, his status will be updated on all the Social Networks to which he is connected.

Please note the "Never Show this Again" checkbox. If the user decides to check this checkbox, this popup will not be presented to him again.

Tags:
Files (0)