In order to create your own custom ShareThis button you must first turn off our output of the button by setting the “button” API option to “false”. Then you can create your own button out of HTML and then bind our SHARETHIS.addEntry code to it.
You may modify the ShareThis button icon to use different colors or sizes but the shape and look should be maintained. You can get the ShareThis icon image files here.
Below is an example of this ShareThis API procedure:
<script language="javascript" type="text/javascript">
//Create your sharelet with desired properties and set button element to false
var object = SHARETHIS.addEntry({
title:'share',
summary: 'Sharing is good for the soul.'},
{button:false});
//Output your customized button
document.write('<span id="share"><a href="javascript:void(0);"><img src="/my_share_icon.gif" />Share!</a></span>');
//Tie customized button to ShareThis button functionality.
var element = document.getElementById("share");
object.attachButton(element);
</script>
Popularity: 23%
This is achieved by setting the “popup” JavaScript element to true (default is false):
<script language=”javascript” type=”text/javascript”>
SHARETHIS.addEntry({
title:’My Share Object!’,
summary:’Sharing is good for the soul.’
},{popup:true});
</script>
*Note: There is a global solution at http://support.sharethis.com/publishers/publishers-faq/configuration/69
Popularity: 9%
In order to allow embedded elements to be visible, the “embeds” JavaScript element must be set to true.
This JavaScript element (embeds) defaults to false due to possible display problems where flash will sometimes display through the widget iFrame. If you set “embeds” to true but encounter problems with Flash, another alternative is to use the the “popup” JavaScript element where the ShareThis widget will instead display in a new popup window.
Below is an example of the ShareThis API procedure which includes the “embeds” JavaScript element:
<script language=”javascript” type=”text/javascript”>< br/>
SHARETHIS.addEntry({
title:’My Share Object!’,
summary:’Sharing is good for the soul.’},
{embeds:true});
</script>
Below is an example of the ShareThis API procedure which includes the “popup” JavaScript element:
<script language=”javascript” type=”text/javascript”>
SHARETHIS.addEntry({
title:’My Share Object!’,
summary:’Sharing is good for the soul.’},
{popup:true});
</script>
*Note: There is a global solution at http://support.sharethis.com/publishers/publishers-faq/configuration/70
Popularity: 9%
To tie a custom function to the ShareThis button, you must set the JavaScript element “onclick” to the name of your custom function:
Below is an example of this ShareThis API procedure:
<script language=”javascript” type=”text/javascript”>
//Use a customized callback routine. For example:
function custom(sharelet){
alert(sharelet.properties.title);
//Return true to continue share event
return true;};
//Create a sharelet with button element set to false and the custom handler
var object = SHARETHIS.addEntry({
title:’share’,
summary: ‘Sharing is good for the soul’},
{button:false, onclick:custom};
//Create customized button and attach it to the share object
document.write(‘<span id=”share”><ahref=”javascript:void(0);”>Share!</a></span>’);
var element = document.getElementById(“share”);
object.attachButton(element);
</script>
Popularity: 10%
If Flash is showing through the ShareThis widget iFrame, you can either:
1) Disable the Flash while the ShareThis widget is in use by setting the “embeds” JavaScript element to false (default is false).Or…
2)Use the the “popup” JavaScript element where the ShareThis widget will instead display in a new popup window.
Below is an example of the ShareThis API procedure which includes the “embeds” JavaScript element:
<script language=”javascript” type=”text/javascript”>
SHARETHIS.addEntry({
title:’My Share Object!’,
summary:’Sharing is good for the soul.’},
{embeds:false});
</script>
Below is an example of the ShareThis API procedure which includes the “popup” JavaScript element:
<script language=”javascript” type=”text/javascript”>
SHARETHIS.addEntry({
title:’My Share Object!’,
summary:’Sharing is good for the soul.’},
{popup:true});
</script>
Popularity: 9%
The ShareThis widget is defaulted to appear at the bottom-right of the ShareThis button link. This positioning can be changed by assigning integer values to the “offsetLeft” and “offsetTop” JavaScript Elements. The integer values assigned to these JavaScript Elements are relative to the default location of the top-left corner of the ShareThis widget. For example, for the widget to appear at the bottom-left of the ShareThis button link, assign the following values:
<script language=”javascript” type=”text/javascript”>
//Create your sharelet with desired properties
SHARETHIS.addEntry({
title:’share’,
summary: ‘Sharing is good for the soul.’},
//Assign integer values specifying the desired positioning of the ShareThis widget
{offsetLeft: -349, offsetTop: 10});
</script>
*The width of the ShareThis button link is dependent on the font styling of the label so this example may not work for your site.
Popularity: 9%
The following 5 steps explain how to use ShareThis within Flash.
Step 1: Customize the look and feel of your ShareThis widget and grab the widget code by using the
customization tool located at: http://sharethis.com/publisher.
Step 2: Paste this code within the of your site. For example:
<head>
…
<script src=”http://w.sharethis.com/widget/?tabs=web%2Cemail&charset=utf-8&…” type=”text/javascript”></script>
</head>
Step 3: Create your shareable object. This code creates a JavaScript object using a function call.
The code is placed anywhere before the object tag. Later you will output this object to call the function within the Flash.
<script language=”JavaScript” type=”text/javascript”>//<![CDATA[
/*
* The click event does not get passed to the container in Safari
* so our popup gets blocked. There is a workaraound in the flex
* script but we need to know if this is Safari.
*/
function checkBrowser() { var value = navigator.userAgent; return value; }
/*
* Create a sharelet that does not display a button,
* and will generate a popup on share.
*/
var ShareObj = SHARETHIS.addEntry({}, {button:false, popup:true});
/*
* Functions called from mx:Script to update elements
* in the sharelet.
*/
function ShareThis_set(el, val){
ShareObj.properties[el] = val;
}
/*
* The share event executed from mx:Script.
*/
function ShareThis_share(){
var browser = checkBrowser();
if (browser.indexOf(”Safari”) > 1) {
/*
* Safari will take a moment to launch the new window.
*/
setTimeout(ShareObj.popup, 500);
} else {
ShareObj.popup();
}
}
//]]></script>
Step 4: Define your share object’s properties. You can further customize your individual shareable objects
by assigning properties about the object. For example you may define the title, a brief summary, and a thumbnail
to your shareable object. For a complete list of assignable object properties, go here: http://sharethis.com/publisher?type=stapi.
NB: We have to use navigateToURL() instead of window.open() on Safari in order to bypass the popup blockers.
<mx:Script>
<![CDATA[
public function share() : void {
ExternalInterface.call(”ShareThis_set”, “title”, “My Page”);
ExternalInterface.call(”ShareThis_set”, “url”, “http://mysite.com”);
ExternalInterface.call(”ShareThis_set”, “icon”, “http://mysite.com/images/mythumb.jpg”);
ExternalInterface.call(”ShareThis_set”, “summary”, “My Summary”);
ExternalInterface.call(”ShareThis_set”, “content”, “<span>My content</span>”)
var browser:String = ExternalInterface.call(”checkBrowser”);
if (browser.indexOf(”Safari”) > 1) {
navigateToURL(new URLRequest(”http://w.sharethis.com/widget/safari”), “stframe”);
}
ExternalInterface.call(”ShareThis_share”);
}
]]>
</mx:Script>
Step 5: Create the mx:LinkButton and bind the share(); function to the onclick handler in Flash.
You will have to create your own ShareThis mx:LinkButton in Flash (the ShareThis share icons are located at: http://shareicons.com).
The share(); function will call the object and the ShareThis functionality you defined in the previous steps.
Popularity: 11%
