将内容分享到社交平台
Posted
tags:
篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了将内容分享到社交平台相关的知识，希望对你有一定的参考价值。
分享到微信微博QQ空间JS代码大全
将优质内容分享到社交平台，让更多用户了解，目前已经成为网站，App，微信公众号等必备的功能，本文搜集了常见的分享js代码，供查阅参考。
1.分享到微信，易信
分享到微信，易信比较简单，贴上分享链接的二维码就可以了。
二维码生成地址：http://cli.im/ (网上随便搜的)
2.分享到新浪微博
代码如下：
var _shareUrl = ‘http://v.t.sina.com.cn/share/share.php?&appkey=895033136‘; //真实的appkey ，必选参数 _shareUrl += ‘&url=‘+ encodeURIComponent(_url||document.location); //参数url设置分享的内容链接|默认当前页location，可选参数 _shareUrl += ‘&title=‘ + encodeURIComponent(_title||document.title); //参数title设置分享的标题|默认当前页标题，可选参数 _shareUrl += ‘&source=‘ + encodeURIComponent(_source||‘‘); _shareUrl += ‘&sourceUrl=‘ + encodeURIComponent(_sourceUrl||‘‘); _shareUrl += ‘&content=‘ + ‘utf-8‘; //参数content设置页面编码gb2312|utf-8，可选参数 _shareUrl += ‘&pic=‘ + encodeURIComponent(_pic||‘‘); //参数pic设置图片链接|默认为空，可选参数 window.open(_shareUrl,‘_blank‘,‘toolbar=no,menubar=no,scrollbars=no,resizable=1,location=no,status=0,‘ + ‘width=‘ + _width + ‘,height=‘ + _height + ‘,top=‘ + (screen.height-_height)/2 + ‘,left=‘ + (screen.width-_width)/2);
appkey为必填参数。
详情请参考：http://open.weibo.com/wiki/ShareCode
3.分享到QQ空间
代码如下：
var _shareUrl = ‘http://sns.qzone.qq.com/cgi-bin/qzshare/cgi_qzshare_onekey?‘;
_shareUrl += ‘url=‘ + encodeURIComponent(_url||document.location); //参数url设置分享的内容链接|默认当前页location
_shareUrl += ‘&showcount=‘ + _showcount||0; //参数showcount是否显示分享总数,显示：‘1‘，不显示：‘0‘，默认不显示
_shareUrl += ‘&desc=‘ + encodeURIComponent(_desc||‘分享的描述‘); //参数desc设置分享的描述，可选参数
_shareUrl += ‘&summary=‘ + encodeURIComponent(_summary||‘分享摘要‘); //参数summary设置分享摘要，可选参数
_shareUrl += ‘&title=‘ + encodeURIComponent(_title||document.title); //参数title设置分享标题，可选参数
_shareUrl += ‘&site=‘ + encodeURIComponent(_site||‘‘); //参数site设置分享来源，可选参数
_shareUrl += ‘&pics=‘ + encodeURIComponent(_pic||‘‘); //参数pics设置分享图片的路径，多张图片以＂|＂隔开，可选参数
window.open(_shareUrl,‘_blank‘,‘width=‘+_width+‘,height=‘+_height+‘,top=‘+(screen.height-_height)/2+‘,left=‘+(screen.width-_width)/2+‘,toolbar=no,menubar=no,scrollbars=no,resizable=1,location=no,status=0‘);
详情请参考：http://connect.qq.com/intro/share/
4.分享到百度贴吧
代码如下：
var _shareUrl = ‘http://tieba.baidu.com/f/commit/share/openShareApi?‘;
_shareUrl += ‘title=‘ + encodeURIComponent(_title||document.title); //分享的标题
_shareUrl += ‘&url=‘ + encodeURIComponent(_url||document.location); //分享的链接
_shareUrl += ‘&pic=‘ + encodeURIComponent(_pic||‘‘); //分享的图片
window.open(_shareUrl,‘_blank‘,‘width=‘+_width+‘,height=‘+_height+‘,left=‘+(screen.width-_width)/2+‘,top=‘+(screen.height-_height)/2+‘,toolbar=no,menubar=no,scrollbars=no, resizable=1,location=no,status=0‘);
详情请参考：http://share.baidu.com/code/advance
5.分享到豆瓣
代码如下：
var _shareUrl = ‘http://shuo.douban.com/!service/share?‘;
_shareUrl += ‘href=‘ + encodeURIComponent(_url||location.href); //分享的链接
_shareUrl += ‘&name=‘ + encodeURIComponent(_title||document.title); //分享的标题
_shareUrl += ‘&image=‘ + encodeURIComponent(_pic||‘‘); //分享的图片
window.open(_shareUrl,‘_blank‘,‘width=‘+_width+‘,height=‘+_height+‘,left=‘+(screen.width-_width)/2+‘,top=‘+(screen.height-_height)/2+‘,toolbar=no,menubar=no,scrollbars=no,resizable=1,location=no,status=0‘);
6.分享到腾迅微博
代码如下：
var _shareUrl = ‘http://v.t.qq.com/share/share.php?‘;
_shareUrl += ‘title=‘ + encodeURIComponent(_title||document.title); //分享的标题
_shareUrl += ‘&url=‘ + encodeURIComponent(_url||location.href); //分享的链接
_shareUrl += ‘&appkey=5bd32d6f1dff4725ba40338b233ff155‘; //在腾迅微博平台创建应用获取微博AppKey
_shareUrl += ‘&site=‘ + encodeURIComponent(_site||‘‘); //分享来源
_shareUrl += ‘&pic=‘ + encodeURIComponent(_pic||‘‘); //分享的图片，如果是多张图片，则定义var _pic=‘图片url1|图片url2|图片url3....‘
window.open(_shareUrl,‘_blank‘,‘width=‘+_width+‘,height=‘+_height+‘,left=‘+(screen.width-_width)/2+‘,top=‘+(screen.height-_height)/2+‘,toolbar=no,menubar=no,scrollbars=no,resizable=1,location=no,status=0‘);
详情请参考：http://dev.t.qq.com/websites/share/
7.分享到人人网
代码如下：
var _shareUrl = ‘http://share.renren.com/share/buttonshare.do?‘;
_shareUrl += ‘link=‘ + encodeURIComponent(_url||location.href); //分享的链接
_shareUrl += ‘&title=‘ + encodeURIComponent(_title||document.title); //分享的标题
window.open(_shareUrl,‘_blank‘,‘width=‘+_width+‘,height=‘+_height+‘,left=‘+(screen.width-_width)/2+‘,top=‘+(screen.height-_height)/2+‘,toolbar=no,menubar=no,scrollbars=no,resizable=1,location=no,status=0‘);
其他的分享内容会从页面中去抓取。
想了解更多，可参考：http://dev.renren.com/website/?widget=rrshare&content=use
8.分享到开心网
代码如下：有两种写法，第一种写法也是跳转到 http://www.kaixin001.com/rest/records.php这个链接地址。
var _shareUrl = ‘http://www.kaixin001.com/repaste/share.php?‘;
_shareUrl += ‘rtitle=‘ + encodeURIComponent(_title||document.title); //分享的标题
window.open(_shareUrl,‘_blank‘,‘width=‘+_width+‘,height=‘+_height+‘,left=‘+(screen.width-_width)/2+‘,top=‘+(screen.height-_height)/2+‘,toolbar=no,menubar=no,scrollbars=no,resizable=1,location=no,status=0‘);
var _shareUrl = ‘http://www.kaixin001.com/rest/records.php?‘;
_shareUrl += ‘url=‘ + encodeURIComponent(_url||location.href); //分享的链接
_shareUrl += ‘&content=‘ + encodeURIComponent(‘分享的文字‘); //需要分享的文字，当文字为空时，自动抓取分享网址的title
_shareUrl += ‘&pic=‘ + encodeURIComponent(_pic||‘‘); //分享的图片,多个使用半角逗号分隔
_shareUrl += ‘&showcount=0‘; //是否显示分享数，显示：‘1‘，不显示：‘0‘
_shareUrl += ‘&style=11‘; //显示的样式，必选参数
_shareUrl += ‘&aid=‘ + encodeURIComponent(_site||‘‘); //显示分享来源
window.open(_shareUrl,‘_blank‘,‘width=‘+_width+‘,height=‘+_height+‘,left=‘+_left+‘,top=‘+_top+‘,toolbar=no,menubar=no,scrollbars=no,resizable=1,location=no,status=0‘);
想了解更多，可参考：http://open.kaixin001.com/document.php?type=records#code
9.分享到facebook
代码如下：
var _shareUrl = ‘http://www.facebook.com/sharer/sharer.php?‘;
_shareUrl += ‘u=‘ + encodeURIComponent(_url||location.href); //分享的链接
_shareUrl += ‘&t=‘ + encodeURIComponent(_title||document.title); //分享的标题
window.open(_shareUrl,‘_blank‘,‘width=‘+_width+‘,height=‘+_height+‘,left=‘+_left+‘,top=‘+_top+‘,toolbar=no,menubar=no,scrollbars=no,resizable=1,location=no,status=0‘);
10.分享到Twitter
代码如下：
var _shareUrl = ‘http://twitter.com/intent/tweet?‘;
_shareUrl += ‘url=‘ + encodeURIComponent(_url||location.href); //分享的链接
_shareUrl += ‘&text=‘ + encodeURIComponent(_title||document.title); //分享的标题
window.open(_shareUrl,‘_blank‘,‘width=‘+_width+‘,height=‘+_height+‘,left=‘+_left+‘,top=‘+_top+‘,toolbar=no,menubar=no,scrollbars=no,resizable=1,location=no,status=0‘);
由于网络原因，可能分享不了。
11.案例
1 <!doctype html> 2 <html> 3 <head> 4 <meta http-equiv="Content-Type" Content="text/html; charset=utf-8;"> 5 <title>分享到微信微博空间等第三方平台的JS代码</title> 6 <meta name="author" content="rainna" /> 7 <meta name="keywords" content="rainna‘s js lib" /> 8 <meta name="description" content="js" /> 9 <style> 10 *{margin:0;padding:0;} 11 img{border:0 none;} 12 body{background:#eee;} 13 14 .m-box{width:800px;margin:0 auto;padding:20px;background:#fff;} 15 .m-box p{margin:0 0 10px;} 16 .m-box .icn a{display:block;width:55px;height:35px;background:url(‘http://l.bst.126.net/rsc/img/weibo.png?035‘) no-repeat;} 17 .m-box .icn .wb1{background-position:10px -216px;} 18 .m-box .icn .wb2{background-position:-190px -216px;} 19 .m-box .icn .wb3{background:url(http://l.bst.126.net/rsc/img/postshare/tieba24.png) 15px 0 no-repeat;} 20 .m-box .icn .wb4{background-position:-88px -215px;} 21 .m-box .icn .wb5{background-position:-138px -216px;} 22 .m-box .icn .wb6{background-position:-245px -216px;} 23 .m-box .icn .wb7{background-position:-300px -216px;} 24 .m-box .icn .wb8{background-position:-355px -216px;} 25 .m-box .icn .wb9{background-position:-415px -215px;} 26 </style> 27 </head> 28 29 <body> 30 <div class="m-box"> 31 <p>分享到微信,易信:</p> 32 <div class="icn"><img width="200" src="http://cli.clewm.net/qrcode/2015/01/21/2031452178.png" /></div> 33 </div> 34 35 <div class="m-box"> 36 <p>分享到新浪微博:<a href="http://open.weibo.com/wiki/ShareCode" target="_blank">http://open.weibo.com/wiki/ShareCode</a></p> 37 <div class="icn"><a href="#" class="wb1" onclick="shareToSinaWB(event)"></a></div> 38 </div> 39 40 <div class="m-box"> 41 <p>分享到QQ空间:<a href="http://connect.qq.com/intro/share/" target="_blank">http://connect.qq.com/intro/share/</a></p> 42 <div class="icn"><a href="#" class="wb2" onclick="shareToQzone(event)"></a></div> 43 </div> 44 45 <div class="m-box"> 46 <p>分享到百度贴吧:<a href="http://share.baidu.com/code/advance" target="_blank">http://share.baidu.com/code/advance</a></p> 47 <div class="icn"><a href="#" class="wb3" onclick="shareToTieba(event)"></a></div> 48 </div> 49 50 <div class="m-box"> 51 <p>分享到豆瓣:</p> 52 <div class="icn"><a href="#" class="wb4" onclick="shareToDouban(event)"></a></div> 53 </div> 54 55 <div class="m-box"> 56 <p>分享到腾迅微博:<a href="http://dev.t.qq.com/websites/share/" target="_blank">http://dev.t.qq.com/websites/share/</a></p> 57 <div class="icn"><a href="#" class="wb5" onclick="shareToQQwb(event)"></a></div> 58 </div> 59 60 <div class="m-box"> 61 <p>分享到人人网:<a href="http://dev.renren.com/website/?widget=rrshare&content=use" target="_blank">http://dev.renren.com/website/?widget=rrshare&content=use</a></p> 62 <div class="icn"><a href="#" class="wb6" onclick="shareToRenren(event)"></a></div> 63 </div> 64 65 <div class="m-box"> 66 <p>分享到开心网:<a href="http://open.kaixin001.com/document.php?type=records#code" target="_blank">http://open.kaixin001.com/document.php?type=records#code</a></p> 67 <div class="icn"><a href="#" class="wb7" onclick="shareToKaixin(event)"></a></div> 68 </div> 69 70 <div class="m-box"> 71 <p>分享到facebook:</p> 72 <div class="icn"><a href="#" class="wb8" onclick="shareToFacebook(event)"></a></div> 73 </div> 74 75 <div class="m-box"> 76 <p>分享到Twitter:</p> 77 <div class="icn"><a href="#" class="wb9" onclick="shareToTwitter(event)"></a></div> 78 </div> 79 80 <script> 81 var _title,_source,_sourceUrl,_pic,_showcount,_desc,_summary,_site, 82 _width = 600, 83 _height = 600, 84 _top = (screen.height-_height)/2, 85 _left = (screen.width-_width)/2, 86 _url = ‘http://traveliceland.lofter.com/post/352b58_579d8e7‘, 87 _pic = ‘http://m3.img.srcdd.com/farm4/d/2015/0113/11/6AE3FEBE500857BF82CA97E8F03DD6A8_B500_900_500_411.jpeg‘; 88 89 90 //分享到新浪微博 91 function shareToSinaWB(event){ 92 event.preventDefault(); 93 94 var _shareUrl = ‘http://v.t.sina.com.cn/share/share.php?&appkey=895033136‘; //真实的appkey，必选参数 95 _shareUrl += ‘&url=‘+ encodeURIComponent(_url||document.location); //参数url设置分享的内容链接|默认当前页location，可选参数 96 _shareUrl += ‘&title=‘ + encodeURIComponent(_title||document.title); //参数title设置分享的标题|默认当前页标题，可选参数 97 _shareUrl += ‘&source=‘ + encodeURIComponent(_source||‘‘); 98 _shareUrl += ‘&sourceUrl=‘ + encodeURIComponent(_sourceUrl||‘‘); 99 _shareUrl += ‘&content=‘ + ‘utf-8‘; //参数content设置页面编码gb2312|utf-8，可选参数 100 _shareUrl += ‘&pic=‘ + encodeURIComponent(_pic||‘‘); //参数pic设置图片链接|默认为空，可选参数 101 window.open(_shareUrl,‘_blank‘,‘width=‘+_width+‘,height=‘+_height+‘,top=‘+_top+‘,left=‘+_left+‘,toolbar=no,menubar=no,scrollbars=no, resizable=1,location=no,status=0‘); 102 } 103 104 //分享到QQ空间 105 function shareToQzone(event){ 106 event.preventDefault(); 107 108 var _shareUrl = ‘http://sns.qzone.qq.com/cgi-bin/qzshare/cgi_qzshare_onekey?‘; 109 _shareUrl += ‘url=‘ + encodeURIComponent(_url||document.location); //参数url设置分享的内容链接|默认当前页location 110 _shareUrl += ‘&showcount=‘ + _showcount||0; //参数showcount是否显示分享总数,显示：‘1‘，不显示：‘0‘，默认不显示 111 _shareUrl += ‘&desc=‘ + encodeURIComponent(_desc||‘分享的描述‘); //参数desc设置分享的描述，可选参数 112 _shareUrl += ‘&summary=‘ + encodeURIComponent(_summary||‘分享摘要‘); //参数summary设置分享摘要，可选参数 113 _shareUrl += ‘&title=‘ + encodeURIComponent(_title||document.title); //参数title设置分享标题，可选参数 114 _shareUrl += ‘&site=‘ + encodeURIComponent(_site||‘‘); //参数site设置分享来源，可选参数 115 _shareUrl += ‘&pics=‘ + encodeURIComponent(_pic||‘‘); //参数pics设置分享图片的路径，多张图片以＂|＂隔开，可选参数 116 window.open(_shareUrl,‘_blank‘,‘width=‘+_width+‘,height=‘+_height+‘,top=‘+_top+‘,left=‘+_left+‘,toolbar=no,menubar=no,scrollbars=no,resizable=1,location=no,status=0‘); 117 } 118 119 //分享到百度贴吧 120 function shareToTieba(event){ 121 event.preventDefault(); 122 123 var _shareUrl = ‘http://tieba.baidu.com/f/commit/share/openShareApi?‘; 124 _shareUrl += ‘title=‘ + encodeURIComponent(_title||document.title); //分享的标题 125 _shareUrl += ‘&url=‘ + encodeURIComponent(_url||document.location); //分享的链接 126 _shareUrl += ‘&pic=‘ + encodeURIComponent(_pic||‘‘); //分享的图片 127 window.open(_shareUrl,‘_blank‘,‘width=‘+_width+‘,height=‘+_height+‘,left=‘+_left+‘,top=‘+_top+‘,toolbar=no,menubar=no,scrollbars=no,resizable=1,location=no,status=0‘); 128 } 129 130 //分享到豆瓣 131 function shareToDouban(event){ 132 event.preventDefault(); 133 134 var _shareUrl = ‘http://shuo.douban.com/!service/share?‘; 135 _shareUrl += ‘href=‘ + encodeURIComponent(_url||location.href); //分享的链接 136 _shareUrl += ‘&name=‘ + encodeURIComponent(_title||document.title); //分享的标题 137 _shareUrl += ‘&image=‘ + encodeURIComponent(_pic||‘‘); //分享的图片 138 window.open(_shareUrl,‘_blank‘,‘width=‘+_width+‘,height=‘+_height+‘,left=‘+_left+‘,top=‘+_top+‘,toolbar=no,menubar=no,scrollbars=no,resizable=1,location=no,status=0‘); 139 } 140 141 //分享到腾迅微博 142 function shareToQQwb(event){ 143 event.preventDefault(); 144 145 var _shareUrl = ‘http://v.t.qq.com/share/share.php?‘; 146 _shareUrl += ‘title=‘ + encodeURIComponent(_title||document.title); //分享的标题 147 _shareUrl += ‘&url=‘ + encodeURIComponent(_url||location.href); //分享的链接 148 _shareUrl += ‘&appkey=5bd32d6f1dff4725ba40338b233ff155‘; //在腾迅微博平台创建应用获取微博AppKey 149 _shareUrl += ‘&site=‘ + encodeURIComponent(_site||‘‘); //分享来源 150 _shareUrl += ‘&pic=‘ + encodeURIComponent(_pic||‘‘); //分享的图片，如果是多张图片，则定义var _pic=‘图片url1|图片url2|图片url3....‘ 151 window.open(_shareUrl,‘_blank‘,‘width=‘+_width+‘,height=‘+_height+‘,left=‘+_left+‘,top=‘+_top+‘,toolbar=no,menubar=no,scrollbars=no,resizable=1,location=no,status=0‘); 152 } 153 154 //分享到人人网 155 function shareToRenren(event){ 156 event.preventDefault(); 157 158 var _shareUrl = ‘http://share.renren.com/share/buttonshare.do?‘; 159 _shareUrl += ‘link=‘ + encodeURIComponent(_url||location.href); //分享的链接 160 _shareUrl += ‘&title=‘ + encodeURIComponent(_title||document.title); //分享的标题 161 window.open(_shareUrl,‘_blank‘,‘width=‘+_width+‘,height=‘+_height+‘,left=‘+_left+‘,top=‘+_top+‘,toolbar=no,menubar=no,scrollbars=no,resizable=1,location=no,status=0‘); 162 } 163 164 //分享到开心网 165 function shareToKaixin(event){ 166 event.preventDefault(); 167 168 var _shareUrl = ‘http://www.kaixin001.com/rest/records.php?‘; 169 _shareUrl += ‘url=‘ + encodeURIComponent(_url||location.href); //分享的链接 170 _shareUrl += ‘&content=‘ + encodeURIComponent(‘分享的文字‘); //需要分享的文字，当文字为空时，自动抓取分享网址的title 171 _shareUrl += ‘&pic=‘ + encodeURIComponent(_pic||‘‘); //分享的图片,多个使用半角逗号分隔 172 _shareUrl += ‘&showcount=0‘; //是否显示分享数，显示：‘1‘，不显示：‘0‘ 173 _shareUrl += ‘&style=11‘; //显示的样式，必选参数 174 _shareUrl += ‘&aid=‘ + encodeURIComponent(_site||‘‘); //显示分享来源 175 window.open(_shareUrl,‘_blank‘,‘width=‘+_width+‘,height=‘+_height+‘,left=‘+_left+‘,top=‘+_top+‘,toolbar=no,menubar=no,scrollbars=no,resizable=1,location=no,status=0‘); 176 } 177 178 function shareToKaixin2(event){ 179 event.preventDefault(); 180 181 var _shareUrl = ‘http://www.kaixin001.com/repaste/share.php?‘; 182 _shareUrl += ‘rtitle=‘ + encodeURIComponent(_title||document.title); //分享的标题 183 window.open(_shareUrl,‘_blank‘,‘width=‘+_width+‘,height=‘+_height+‘,left=‘+_left+‘,top=‘+_top+‘,toolbar=no,menubar=no,scrollbars=no,resizable=1,location=no,status=0‘); 184 } 185 186 //分享到facebook 187 function shareToFacebook(event){ 188 event.preventDefault(); 189 190 var _shareUrl = ‘http://www.facebook.com/sharer/sharer.php?‘; 191 _shareUrl += ‘u=‘ + encodeURIComponent(_url||location.href); //分享的链接 192 _shareUrl += ‘&t=‘ + encodeURIComponent(_title||document.title); //分享的标题 193 window.open(_shareUrl,‘_blank‘,‘width=‘+_width+‘,height=‘+_height+‘,left=‘+_left+‘,top=‘+_top+‘,toolbar=no,menubar=no,scrollbars=no,resizable=1,location=no,status=0‘); 194 } 195 196 197 //分享到Twitter 198 function shareToTwitter(event){ 199 event.preventDefault(); 200 201 var _shareUrl = ‘http://twitter.com/intent/tweet?‘; 202 _shareUrl += ‘url=‘ + encodeURIComponent(_url||location.href); //分享的链接 203 _shareUrl += ‘&text=‘ + encodeURIComponent(_title||document.title); //分享的标题 204 window.open(_shareUrl,‘_blank‘,‘width=‘+_width+‘,height=‘+_height+‘,left=‘+_left+‘,top=‘+_top+‘,toolbar=no,menubar=no,scrollbars=no,resizable=1,location=no,status=0‘); 205 } 206 </script> 207 </body> 208 </html>
以上是关于将内容分享到社交平台的主要内容，如果未能解决你的问题，请参考以下文章
使用APICloud & MobTech SDK 快速实现分享到社交平台功能