O'Reilly logo

Programming Social Applications by Jonathan LeBlanc

Stay ahead with the world's most comprehensive technology and business learning platform.

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, tutorials, and more.

Start Free Trial

No credit card required

Integrating the OpenLike Widget

Now that we understand what OpenLike is and how you can use it, let’s take a look at how to integrate the widget on your own sites. The process is quick and painless, and at a base level, involves only three elements:

  • An HTML page title

  • The script include

  • A JavaScript initialization call

Here’s what the code looks like:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
    "http://www.w3.org/TR/html4/strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en-us" lang="en-us">
<head>
<title>OpenLike Widget Example</title>
</head>
<body>
<!-- include the OpenLike JavaScript -->
<script type="text/javascript" src="http://openlike.org/v1/openlike.js"></script>

<!-- initialize the widget -->
<script type="text/javascript">OPENLIKE.Widget();</script>
<body>
</html>

Basically, we have a simple HTML page that includes the title that we want to use for the like event as the shell. Next, we have the script include that introduces the OpenLike library to the page. The source of the library should be http://openlike.org/v1/openlike.js. Finally, we simply make a call to OPENLIKE.Widget() wherever we want to render the widget.

Once you’ve installed the OpenLike widget, the user can “like” your page through a number of different web sources. Figure 2-4 displays a simple implementation of numerous different sharing mechanisms for the associated sites.

How the OpenLike widget renders

Figure 2-4. How ...

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, interactive tutorials, and more.

Start Free Trial

No credit card required