Share Properties and Sharing Custom Information

 

There are three ways to specify how your share is sent - i) by specifying additional parameters in tags ii) by using Open Graph Protocol tags in your content and iii) by dynamically modifying the shared object through JavaScript.

 

Properties in <Span> Tags

You can specify the URL, title, and image to be shared.

Name Definition Default Requirement
st_url Specifies URL (can be shortened URL) that you would like shared null Optional
st_title Specifies title that you would like shared null Optional
st_image Specifies link to image you would like displayed in the shared content null Optional
st_summary Specifies summary text/description you wish to share null Optional

Example
This button is set to share the ShareThis home page with the title "Sharing is great!"

<span class="st_sharethis" st_url="http://sharethis.com" st_title="Sharing is great!"></span>

<script type="text/javascript" src="http://w.sharethis.com/button/buttons.js"></script>
<script type="text/javascript">
        stLight.options({
                publisher:'12345',
        });
</script>

Example of using custom URL shorteners
This button will share a shortened url (can be shar.es, bit.ly, t.co, fb.me or any other url shortener) instead of the longer standard url.

<span class="st_sharethis" st_url="http://shar.es/p5TTF" st_title="Sharing is great!"></span>

<script type="text/javascript" src="http://w.sharethis.com/button/buttons.js"></script>
<script type="text/javascript">
        stLight.options({
                publisher:'12345',
        });
</script>


 

Open Graph Tags

You will want to add these tags to the header of your page.

Name Definition Default Requirement
og:title Specifies title that you would like shared null Optional
og:type Specifies type of page that is being shared null Optional
og:url Specifies URL that you would like shared null Optional
og:image Specifies image/thumbnail that you would like shared null Optional
og:description Specifies summary that you would like shared null Optional
og:site_name Specifies site that content is shared from null Optional

Example
This button is set to share the ShareThis home

<head>
<meta property="og:title" content="ShareThis Homepage" />
<meta property="og:type" content="Sharing Widgets" />
<meta property="og:url" content="http://sharethis.com" />
<meta property="og:image" content="http://sharethis.com/images/logo.jpg" />
<meta property="og:description" content="Sharing is great!" />
<meta property="og:site_name" content="ShareThis" />

<script type="text/javascript" src="http://w.sharethis.com/button/buttons.js"></script>
<script type="text/javascript">
        stLight.options({
                publisher:'12345',
        });
</script>
</head>
<body>
<span class="st_sharethis"></span>

 

Dynamic Specification through JavaScript

You can modify the stWidget JavaScript object's properties dynamically to specify the content that is shared.
Property List

Name Definition Requirement
service Specifies the social destination to share to Required
element Specifies which sharing button on page. Usually this is the id of span id of the HTML element containing the button Required
url Specifies URL that you would like shared Required
title Specifies title string that is shared Required
type Specifies the type of button to display. Default is chicklet. Other possible values are: large,custom,fblike(facebook like),vcount(vertical counter) ,hcount(horizontal counter),button Optional
text Specifies optional text to be displayed next to the ShareThis button on your page Optional
image Specifies link to the image to be shared Optional
summary Specifies summary text to be shared Optional

Example
This example creates a button that connects to a large format ShareThis button and shares the ShareThis home page with a description. It shares a custom image.

<head>
<script type="text/javascript" src="http://w.sharethis.com/button/buttons.js"></script>
<script type="text/javascript">
        stLight.options({
                publisher:'12345',
        });
</script>
</head>
<body>
<span id="button_1"></span>
<script>
         stWidget.addEntry({
                 "service":"sharethis",
                 "element":document.getElementById('button_1'),
                 "url":"http://sharethis.com",
                 "title":"sharethis",
                 "type":"large",
                 "text":"ShareThis" ,
                 "image":"http://www.softicons.com/download/internet-icons/social-superheros-icons-by-iconshock/png/256/sharethis_hulk.png",
                 "summary":"this is description1"
         });
</script>

 

Order of Precedence

It is important to remember the order of precedence by which the ShareThis code processes share properties. Generally, we recommend using one approach by which sharing properties are specified on your pages to prevent errors.

  1. 1. Any dynamically specified JavaScript properties i.e. highest precedence
  2. 2. Properties specified in <span> tags i.e. second precedence
  3. 3. Open Graph Protocol tags i.e. lowest precedence

 

Global Share Properties

Global properties determine how the widget behaves on a site.

Name Definition Default Requirement
publisher Your unique ShareThis publisher key null Required
publisherGA Change the Google Analytics to a different id than the default embedded on page. null Optional
tracking Turn off Google Analytics tracking by default. If ShareThis detects a Google Analytics id on the web-page it will log share events to GA by default true Optional
doneScreen Toggles Popular Shares screen on and off true Optional
onhover Opens widget when user hovers over button true Optional
embeds Disables embeddable objects while widget loads false Optional
headerTitle Adds a Title to your ShareThis iframe false Optional
headerbg Specify the back ground color of your header #CCCCCC Optional
headerfg Specify the text color of your header #FFFFFF Optional

Example
This code will create a ShareThis button with embeddable content visible while the iframe is open

<span class="st_sharethis"></span>

<script type="text/javascript" src="http://w.sharethis.com/button/buttons.js"></script>
<script type="text/javascript">
        stLight.options({
                publisher:'12345',
                embeds:'true'
        });
</script>
 
 
Yes I found this article helpful
No I did not find this article helpful
 
 
 
Share