shaosiming

分享到微博,QQ等社交平台的JavaScript代码及使用

怎么样才能让自己的网站快速曝光?那么把网站分享到各个社交平台我想是最便捷也是最有效的方式了,自己以及访客可一键分享到微博、QQ空间等社交平台以此来提高自己网站的访问量...

时间:2019-09-11
查看:
评论:0 条 / 我也去评论
怎么样才能让自己的网站快速曝光?那么把网站分享到各个社交平台我想是最便捷也是最有效的方式了,自己以及访客可一键分享到微博、QQ空间等社交平台以此来提高自己网站的访问量是再轻松不过的了!

那么之前几年有第三方的插件可以使用,比如:bShare,或者百度分享,不过百度分享如今也已经暂停了服务,虽然依然有人在使用,不过已经把代码本地化了,现在再想去用,没有点基础是不可能了。

同时bShare虽然依然在运营,但是随着网络的发展,现在更多的网站投入到了https的行列,因为可以申请到免费的ssl证书,也就让网页认证变的简单了。随之而来的问题就是,不管是之前的百度,或者现在的bShare都不支持HTTPS访问。

其实,我之前有看过,bShare是有https链接的,虽然可以更改引入代码中的http改为https依然可以用,但是文件内部引入的链接都是http,依然会被浏览器认证为不安全的链接,导致拦截。从而牵连到自己的网站也会被认为不安全。

所以,我之前也尝试过bShare,最终也是不是被拦截,就是连自己的网站也被认为不安全~所以最终只能放弃掉。然后想着自己弄一个分享算了,然后就去找了各种接口。

虽说接口有一大堆,但是怎么使用,或者详细一点的代码都没有,,一般都是给你写个分享接口的链接,然后让你写一段分享的文字信息,那样只适合单页分享,不适合整个网站通用。

或者只能分享一个首页信息,以及固定的文字内容和图片,这就造成了,我们整个网站都只能分享一个首页而已,不管在任何页面分享都是首页。很不方便~ 于是我想了又想,翻了又翻,找了又找。

终于还是给弄出来了,虽然大致上都是差不多的,但是最后我也是修改优化了一下,然后可以自动获取当前页面的URL信息以及文字内容和图片信息( 没有图片分享默认图片 )

好了,废话就不多了,直接上代码吧!具体的效果可以预览本站右侧的侧边栏里面的分享按钮即可~  代码我已经全部写好,直接复制就能用,或者根据提示修改

JavaScript代码

var _title, _source, _sourceUrl, _pic, _showcount, _desc, _summary, _site,
    _url = location.href,  //自动获取网页的URL,和网页的标题以及文字内容
    _pic = '默认图片链接';  //网页没有图片时,分享的默认图片

//分享到新浪微博   
function shareToSinaWB(event) {
    event.preventDefault();
    var _shareUrl = 'http://v.t.sina.com.cn/share/share.php?title="123"'; 
    _shareUrl += '&url=' + encodeURIComponent(_url || document.location); 
    _shareUrl += '&title=' + encodeURIComponent(_title || document.title); 
    _shareUrl += '&source=' + encodeURIComponent(_source || '');
    _shareUrl += '&sourceUrl=' + encodeURIComponent(_sourceUrl || '');
    _shareUrl += '&content=' + 'utf-8'; 
    _shareUrl += '&pic=' + encodeURIComponent(_pic || ''); 
    window.open(_shareUrl, '_blank');
}
//分享到QQ空间
function shareToQzone(event) {
    event.preventDefault();
    var _shareUrl = 'http://sns.qzone.qq.com/cgi-bin/qzshare/cgi_qzshare_onekey?';
    _shareUrl += 'url=' + encodeURIComponent(_url || document.location); 
    _shareUrl += '&showcount=' + _showcount || 0; 
    _shareUrl += '&desc=' + encodeURIComponent(_desc || ''); 
    _shareUrl += '&summary=' + encodeURIComponent(_summary || ''); 
    _shareUrl += '&title=' + encodeURIComponent(_title || document.title); 
    _shareUrl += '&site=' + encodeURIComponent(_site || ''); 
    _shareUrl += '&pics=' + encodeURIComponent(_pic || ''); 
    window.open(_shareUrl, '_blank');
}
//分享到百度贴吧
function shareToTieba(event) {
    event.preventDefault();
    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');
}
//分享到豆瓣
function shareToDouban(event) {
    event.preventDefault();
    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');
}
//分享到人人网
function shareToRenren(event) {
    event.preventDefault();
    var _shareUrl = 'http://widget.renren.com/dialog/share?';
    _shareUrl += 'link=' + encodeURIComponent(_url || location.href); 
    _shareUrl += '&title=' + encodeURIComponent(_title || document.title); 
    window.open(_shareUrl, '_blank');
}
//分享到qq
function shareToqq(event) {
    event.preventDefault();
    var _shareUrl = 'https://connect.qq.com/widget/shareqq/iframe_index.html?';
    _shareUrl += 'url=' + encodeURIComponent(_url || location.href); 
    _shareUrl += '&title=' + encodeURIComponent(_title || document.title); 
    window.open(_shareUrl, '_blank');
}
//分享到开心网
function shareToKaixin(event) {
    event.preventDefault();
    var _shareUrl = 'http://www.kaixin001.com/rest/records.php?';
    _shareUrl += 'url=' + encodeURIComponent(_url || location.href); 
    _shareUrl += '&content=' + encodeURIComponent(''); 
    _shareUrl += '&pic=' + encodeURIComponent(_pic || ''); 
    _shareUrl += '&showcount=0'; 
    _shareUrl += '&style=11'; 
    _shareUrl += '&aid=' + encodeURIComponent(_site || ''); 
    window.open(_shareUrl, '_blank');
}

使用方法:

可以用A标签,也可以用按钮,可以用各种方式,只需要加入一个onclick信息即可,当然我推荐使用A标签来做,比如下方:

<a href="javascript:void(0)" onclick="shareToSinaWB(event)" > 分享到新浪微博 </a>

当前,你可以在A标签内插入一个图片作为展示,然后去优化一下CSS即可,比如我写的:

<li><a title="分享到新浪微博" href="javascript:void(0)" onclick="shareToSinaWB(event)">
        <div class="sidebox">
            <img src="图片地址">分享到微博</div>
    </a></li>

至于怎么去美化,我这里就不细说了,我相信每个人的审美都不同!好了,本篇文章到此结束,么么哒~ 喜欢的记得评论留言~ 
顶一下  
(3)
  100%
踩一下  
(0)
  0%
  • 本文标题:分享到微博,QQ等社交平台的JavaScript代码及使用
  • 本文链接:https://www.shaosiming.net/html/news/33.html
  • 转载说明:如果没有标明转载均为少司命个人博客原创!转载需要注明出处~
  • 既然都来了,就说点什么吧……
    • 全部评论(0
      还没有评论,快来抢沙发吧!