自己做手做“分享到”小工具

我们经常在网站上看到“分享到”这种工具，该服务提供网页地址收藏、分享及发送的按钮工具，网站的浏览者可以方便的分享到微博和SNS网站，网站主只要添加一段JavaScript即可实现。这也就是SMO—社会化媒体优化(Social media optimization)，即通过某种社会化传播方式，运用社会化媒体资源：网络社区、主题论坛等社会化网站（如：开心网，人人网，搜狐白社会，新浪微博）将所浏览的信息分享到各大社会化网络媒体从而带回更多的社会化流量，同时获得高效、快速、广泛的公共传播效果的一整套方法。目前国内比较大的SMO服务提供商包括国内最大网站统计工具CNZZ旗下的Jiathis和bShare，前一段时间百度也内测了百度分享。

这些工具使用起来还是比较方便的是，自定义也很方便，但是部分工具会收集用户发布的信息，比如Jiathis，它会将用户分享的数据先记录到自己的服务器上，这样你的信息就轻易被这些网站所收集。那么从这个方面考虑，自己做手做一个分享工具还是很有必要的。

准备工具

首页确定你的网站数据用户可能会有哪些分享去向，目前国内比较大的就是包括新浪微博、QQ空间、开心网、人人网、豆瓣、腾讯微博，其他所占比例较小，可根据需要选择。

之后要准备这些网站的ICON图标，方便用户变辨识。我这里使用的是豆瓣分享里的原图片。

从上到下依次是QQ空间、新浪微博、MSN、人人网、开心网、腾讯微博、搜狐微博，从优化前端性能考虑，全部合并到同一个图片，新加的ICON也可以合并到该图片中。

各网站都提供了通过url参数来提交分享的功能，以新浪微博为例：

http://service.t.sina.com.cn/share/share.php?url=http://www.cnblogs.com/walkingp/&title=自己做手做一个分享工具&pic=http://ww4.sinaimg.cn/bmiddle/703a0732jw1di6m7hqphjj.jpg

这里共三个参数：url代表网页地址，title是要分享的内容，pic参数为图片地址。跳转到该地址。 

由于分享成功后一般会将此网页关闭，所以建议使用window.open打开要分享的网页。

新浪微博就会显示成功了：

代码很简单，如下：

function $(id){return document.getElementById(id);}
var share = {
	url: "http://walkingp.com/",
	title: "【快速息怒的7个小方法】1、降低你的音量和语速；2、闭上你的的眼睛，可以快速浇灭怒火；3、转转你的脖子，放松心情，缓解僵硬；4、拥抱你自己，用双臂交叉紧紧拥抱自己一下；5、闻闻植物，离健康的绿色植物10厘米左右，深呼吸5次；6、发扬阿Q精神，自我解嘲；7、击掌、跺脚，两三分钟即可。",
	pic:"http://ww4.sinaimg.cn/bmiddle/6617a6f4jw1di6x9ghsv7j.jpg"
};
var sina_links = 'http://service.t.sina.com.cn/share/share.php?url='+encodeURI(share.url)+'&title='+encodeURI(share.title)+'&pic='+share.pic;
$('sina').href = sina_links;			
var kaixin001_links = 'http://www.kaixin001.com/repaste/share.php?rurl='+encodeURI(share.url)+'&rtitle='+encodeURI(share.title);
$('kaixin001').href = kaixin001_links;
var renren_links = 'http://share.renren.com/share/buttonshare.do?link='+encodeURI(share.url)+'&title='+encodeURI(share.title);
$('renren').href = renren_links;
var douban_links = 'http://www.douban.com/recommend/?url='+encodeURI(share.url)+'&title='+encodeURI(share.title);
$('douban').href = douban_links;
var tqq_links = 'http://v.t.qq.com/share/share.php?url='+encodeURI(share.url)+'&title='+encodeURI(share.title);
$('tqq').href = tqq_links;	
var qzone_links = 'http://sns.qzone.qq.com/cgi-bin/qzshare/cgi_qzshare_onekey?url='+encodeURI(share.url);
$('qzone').href = qzone_links;	
var msn_links='http://profile.live.com/badge?url=' + encodeURI(share.url) + '&screenshot=' + encodeURI(share.pic) + '&title=' +encodeURI(share.title); 
$('msn').href = msn_links;
//var baidu_links = 'http://cang.baidu.com/do/add?it=' + encodeURI(share.title) + '&iu=' + encodeURI(share.url) + '&dc=&fr=ien#nw=1';
//$('baidu').href = tqq_links;//百度是个流氓公司~~~

查看效果