Social 2 Web In-Game-Overlay

« Developer Documentation Index

Table Of Contents

Social 2 Web In-Game-Overlay

  1. 1. Prerequisites
  2. 2. Setup
    1. (a) Unique Application Identifier
    2. (b) Javascript and CSS Includes
    3. (c) Opening the In-Game-Overlay In-game
  3. 3. Example Code
  4. 4. Additional Help

Documentation

1. Prerequisites:

To use the Social 2 Web In-Game-Overlay (IGO), you must complete the following steps if you have not already done so:

  1. 1. If you don't already have one, create a SuperRewards Publisher account on www.srpoints.com
  2. 2. Log in to your Publisher account and create an application if you have not already done so.
  3. 3. Email your account manager with your desired game url, some reward text like "get free currency" or "get a free gift", and an optional image to display on the In-Game-Overlay.

The In-Game-Overlay will display a button with your reward text that will link to your game url, with the parameter "wh=1" appended to the end of the url. You may use the "wh" parameter to detect when a user has come to your game from the In-Game-Overlay and reward them with currency or an item. You can also use the "wh" parameter to track reward history on your server and deturman which users should see the In-Game-Overlay in the future (do decide whether to include the IGO display code or not for a particular user).


2. Setup:

You will need the Unique Application Identifier for your specific application:

(a) Unique Application Identifier:

The unique application identifier (h) is the encrypted string that identifies the application that is making the Social 2 Web In-Game-Overlay request. An identifier is created for each application your add to your SuperRewards Publisher account.

To find your application's unique identifier (h), log in to your SuperRewards Publisher account and edit the application that will display the Social 2 Web In-Game-Overlay. There is an "edit" link located next each or your applications on the list. On the "Edit Application" page, you will see a box that appears like Figure 2a below. The unique application identifier is the h parameter located in the query string of the iframe (highlighted in bold red font).

<iframe src="http://www.superrewards-offers.com/super/offers?h=xxxxx.xxxxxxxxxxx&uid=[USER ID]" frameborder="0" width="728" height="2400" scrolling="no"></iframe>
Figure 2a: Locating your application's unique identifier.

(b) Javascript and CSS Includes:

In order to include the Social 2 Web In-Game-Overlay within your application, you must include the following set of CSS and Javascript includes in your application.

JavaScript Library includes:

<link rel="stylesheet" type="text/css" href="http://cdn.superrewards-offers.com/css/tools/interstitial/adk.s2wigo.01.01.css" />
<link rel="stylesheet" type="text/css" href="http://cdn.superrewards-offers.com/css/jquery.fancybox-1.3.1.css" />
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.3/jquery.min.js" type="text/javascript"></script>
<script src="http://cdn.superrewards-offers.com/js/fancybox/jquery.fancybox-1.3.1.js"></script>
<script src="http://cdn.superrewards-offers.com/js/tools/interstitial/adk.s2wigo.jquery.01.02.js"></script>

(c) Opening the In-Game-Overlay In-game:

The in-game code are the lines of code that will be used to display the Social 2 Web In-Game-Overlay at any desired point in your game. The in-game code calls the Social 2 Web In-Game-Overlay Javascript library that you copied into your project to preload and launch the Overlay.

In order to display the Social 2 Web In-Game-Overlay in your application, you must call the adk_show_s2w_igo('your-apps-unique-identifier-h-value') method, which accepts the following parameter:

  1. h: This is the Unique Application Identifier described above.

3. Example Code:

Figure 4a is an example of how to display the Social 2 Web In-Game-Overlay on page load.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<title>Offer Demo</title>

<link rel="stylesheet" type="text/css" href="http://cdn.superrewards-offers.com/css/tools/interstitial/adk.s2wigo.01.01.css" />
<link rel="stylesheet" type="text/css" href="http://cdn.superrewards-offers.com/css/jquery.fancybox-1.3.1.css" />
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.3/jquery.min.js" type="text/javascript"></script>
<script src="http://cdn.superrewards-offers.com/js/fancybox/jquery.fancybox-1.3.1.js"></script>
<script src="http://cdn.superrewards-offers.com/js/tools/interstitial/adk.s2wigo.jquery.01.02.js"></script>
</head>

<body>

<script type="text/javascript">
  /* User Defined Params - START */
  var h = [Unique Application Identifier];
  /* User Defined Params - END */
  
  $(document).ready(function() { adk_show_s2w_igo(h); });
</script>
</body>
</html>
Figure 4a: HTML Example - Opening the Social 2 Web In-Game-Overlay on page load without click.


4. Additional Help:

For more help regarding the setup of the Social 2 Web In-Game-Overlay, please contact your Account Manager.