|How can I integrate social networks into my item files?
Insertion blocks in your item files allow you to easily display links to social networks in your item descriptions. Before reading this document, we recommend first consulting the following help topic: Inserstion Blocks in Items Files.
There are different ways to propose share buttons:
| Method 1: Using script provided by a social network|
| Method 2 (recommended): Using a sharing service|
Certain sites, like Twitter, impose heavy technical constraints for advanced integration of this type of button. There are a multitude of service providers...and the list gets longer every month!
Therefore, we suggest using a sharing service to propose these links. A sharing service is an application hosted by a site (generally free of charge) that proposes simplified submit buttons for your pages to social networks. Here are several examples of sites that offer this type of application: AddThis, AddToAny et ShareThis.
The buttons of these sharing services also integrate many other functionalities, such as add to favorites or print page.
Here are three examples of integration with AddThis
For the experts out there, the complete list of functionalities offered by AddThis is available here: http://www.addthis.com/help/menu-api
Note that using encoded variables is generally not necessary with sharing services.
This is a single button that gives access to all of the sharing services.
- Selection of Buttons
The idea is to create a button for each service you want to propose on your site.
This is an example displaying 2 rows. One with share buttons: Twitter, Facebook, Myspace, Google Buzz and share by email. The other with a selection of tools for saving the page: "Add to Google Favorites", "Add to Favorites" and "Print Page".
We suggest deleting or adding links according to your needs. The link that allows you to access a service looks like this:
<a class="addthis_button_service" addthis:url="#OXPDTURL#" addthis:title="#OXPDTNAME#" Title="Tooltip Text"></a>
The complete list of services supported by AddThis is available here: http://www.addthis.com/services/list
- Selection of Buttons with your Own Logos.
The idea is the same as the previous example with the addition of a customized URL for the logo image of each service.
<a class="addthis_button_service" addthis:url="#OXPDTURL#" addthis:title="#OXPDTNAME#" Title="Tooltip Text"><img src="URL-of-your-image.gif"/></a>
Refer to the following help topic How do I find the URL address of the images in my site? to find the URL to enter here.
Here is a short example including Twitter and Facebook. You can refer to the previous section to see how to add or delete buttons. The size of the images is defined by the parameter "width: 30px;" of the style defined at the beginning of the script.