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 ...

Get Programming Social Applications now with the O’Reilly learning platform.

O’Reilly members experience books, live events, courses curated by job role, and more from O’Reilly and nearly 200 top publishers.

Start your free trial