Social Sharing Quick Start Guide

This widget has been deprecated.

When creating new sharing widgets, use the Social Sharing Widget.

Janrain’s new Social Sharing Widget was released in June of 2012 and provides many new features and performance improvements. To learn about the new Sharing Widget, visit the Social Sharing Widget page.

It is Janrain’s policy to maintain and support legacy UI widgets for 12 months following the release of new replacement widgets. When the 12 month support period expires, Janrain will no longer add features or provide maintenance updates for the legacy widget, such as support for new versions of web browsers. Support for the legacy Social Sharing Widget will end on June 1st, 2013.

FAQ ¶

Q: Does this mean that my old Sharing Widget will stop working on June 1st, 2013?

A: No. Your widget will continue to work, and support all the browser versions that were previously supported, however it may not work with the latest browser version.

Q: Is it hard to switch to the new Sharing Widget?

A: No, it is very straight forward and we have instructions for you to get started on the Social Sharing Migration Guide page.

Social Sharing allows users to share what they’re doing on your website with their extended social networks.

The purpose of this quick start guide is to implement a no-frills version of Social Sharing on your website. When completed, the destination website will launch a pop-up window, offering to share a link, as shown in Figure 1.

Figure 1: Social Sharing Modal Pop-up Window

Adding the Social Sharing Widget takes these steps:

• Add the Code — Use the Dashboard to generate the code to add the widget to a website.
• Configure a Provider — Identity Providers require that users of this feature complete a developer application.

Add the Code ¶

1. Launch your Janrain Engage application at rpxnow.com. If you have not created an application yet, follow the onscreen instructions, or refer to the Creating Applications page.
2. When presented with your Dashboard, use the Deployment menu from the top navigation bar to select Social Sharing for Web.
3. On the Get the Widget page, click the Download button to download the rpx_xdcomm.html file. (See Figure 2, Section A.)
4. Using an FTP program, place the rpx_xdcomm.html file in the root directory of your website. This file will facilitate the communication between the domain and Janrain.
5. Create, or designate a webpage on which to place the widget.
6. Copy the first script on the Get the Widget page, and paste it into your destination page. (See Figure 2, Section B.)
7. Copy the second script on the Get the Widget page, and paste it into your destination page. (See Figure 2, Section C.)
8. Click the Next button on the bottom of the Get the Widget page.

Figure 2: Get the Widget Page

Configure a Provider ¶

Once you have put the code in place, use the Dashboard to configure an Identity Provider for the widget. Otherwise, the modal pop-up window will return an error reporting that no Identity Providers are present.

To use the Social Sharing service, Identity Providers require that users register with their developer networks. Janrain Engage streamlines this process so you can complete most of it from the Dashboard. The registration is different for each provider; for the purposes of this Quick Start Guide, we describe the Yahoo! process.

1. On the Choose Providers screen, click the gear icon next to Yahoo! (See Figure 3.)

Figure 3: Choose Providers Screen

A modal pop-up window appears on the Dashboard, and asks to begin the process of generating a Yahoo! developer application (see Figure 4). Click the Generate button to begin the application process.

Figure 4: Generate a Yahoo! Application

Completing a Yahoo! Application ¶

1. A dialog box asks to allow permission to create a Yahoo! application. Click the Allow button.
2. The Janrain servers create a Yahoo! developer application for you. Click the Close button.
3. Back on the Dashboard, click the Next button.
4. The next step verifies the newly created Yahoo! developer application. Select the domain verification page link.
5. The link launches the Manage Your Domains page on the Yahoo! Developer Network site. Click the Verify button next to your domain.
6. A pop-up window appears. Select and copy the name of the temporary file that Yahoo! provides. Instead of transferring this file to a server yourself, the Dashboard will do this for you.
7. Return to the Dashboard tab. Paste the name of the temporary file in the text box provided.
8. Click the Create File button.
9. Return to the Manage Your Domain page and click the Verify Domain button.
10. If successful, click the Close button and return to the Dashboard.
11. Click the Done button.

Now that Yahoo! is configured, the gear icon is now green on the Configure Providers screen. Drag the Yahoo! icon into an open position of the widget design. Click the Save button.

Testing the Widget ¶

If successful, visiting the web page launches a dialog box, which asks to share a comment with the Yahoo! Connect social network.

Next Steps ¶

Naturally, with a full implementation, the administrator will want to add scripts to place and trigger the widget where needed. See the Sharing Widget page for more information.