Share widget

Looking for WET v3.1?

As of September 23, 2014, version 3.1 of the Web Experience Toolkit is no longer supported. The source code and documentation have been moved to the wet-boew-legacy repository.

Share a page

View code 
<div class="wb-share" data-wb-share='{"pnlId": "pnl1"}'></div>

Share a video

View code 
<div class="wb-share" data-wb-share='{"type": "video", "title": "Video title", "url": "http://video.url", "pnlId": "pnl2"}'></div>

Share an audio file

View code 
<div class="wb-share" data-wb-share='{"type": "audio", "title": "Audio file title", "url": "http://audio.url", "pnlId": "pnl8"}'></div>

Share a custom type

View code 
<div class="wb-share" data-wb-share='{"custType": " this comment", "title": "Comment title", "url": "http://comment.url", "pnlId": "pnl3"}'></div>

Add additional links

Second link:
View code 
<div class="wb-share" data-wb-share='{"pnlId": "pnl4"}'></div>
<div class="text-right">
	<strong>Second link:</strong>
	<div class="wb-share link-only text-right" data-wb-share='{"pnlId": "pnl4"}'></div>
</div>

Filter the displayed sites

View code 
<div class="wb-share" data-wb-share='{"filter": ["twitter", "facebook"], "pnlId": "pnl5"}'></div>

Add custom CSS to the share link

View code 
<div class="wb-share" data-wb-share='{"pnlId": "pnl6", "lnkClass": "btn btn-default"}'></div>

Add a site to the share panel

View code

HTML

<div class="wb-share" data-wb-share='{"pnlId": "pnl7", "sites": "demosite": {"name": "Demo site", "url": "http://www.demosite.com/?to=&subject={t}&body={u}%0A{d}"}}'></div>

CSS

.wb-share .demosite:before {
	background: url("demosite.png") no-repeat;
}
Date modified: