我们经常看到某些自媒体网站信息列表都会有个分享功能,可以分享对应的信息内容。大部分都是自行开发的分享接口,为了节省开发时间,我们也可以用百度分享API来完成这种功能。
近期案列用到的一个页面多个百度分享组件代码,由于百度分享官网关闭了,所以看不了官方API,网上各种查资料才找到一个可以用的。
一个页面多个百度分享代码
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title> New Document </title>
<meta name="Generator" content="EditPlus">
<meta name="Author" content="">
<meta name="Keywords" content="">
<meta name="Description" content="">
</head>
<script>window._bd_share_config = {share: []};</script>
<body>
<div class="bdsharebuttonbox col-xs-5" data-tag="share_1">
<a href="#" class="bds_qzone" data-cmd="qzone" title="分享到QQ空间"></a>
<a href="#" class="bds_tsina" data-cmd="tsina" title="分享到新浪微博"></a>
<a href="#" class="bds_tqq" data-cmd="tqq" title="分享到腾讯微博"></a>
<a href="#" class="bds_renren" data-cmd="renren" title="分享到人人网"></a>
<a href="#" class="bds_weixin" data-cmd="weixin" title="分享到微信"></a>
<a href="#" class="bds_more" data-cmd="more"></a>
<a class="bds_count" data-cmd="count"></a>
</div>
<script>
var share1 = {
tag: "share_1",
bdText: "分享的内容",
bdUrl: "http://www.wdzzz.com",
bdDesc:"111"
};
window._bd_share_config.share.push(share1);
</script>
<div class="bdsharebuttonbox col-xs-5" data-tag="share_2">
<a href="#" class="bds_qzone" data-cmd="qzone" title="分享到QQ空间"></a>
<a href="#" class="bds_tsina" data-cmd="tsina" title="分享到新浪微博"></a>
<a href="#" class="bds_tqq" data-cmd="tqq" title="分享到腾讯微博"></a>
<a href="#" class="bds_renren" data-cmd="renren" title="分享到人人网"></a>
<a href="#" class="bds_weixin" data-cmd="weixin" title="分享到微信"></a>
<a href="#" class="bds_more" data-cmd="more"></a>
<a class="bds_count" data-cmd="count"></a>
</div>
<script>
var share2 = {
tag: "share_2",
bdText: "分享的内容",
bdUrl: "http://www.wdzzz.com",
bdDesc:"222"
};
window._bd_share_config.share.push(share2);
</script>
<script>
with (document)0[(getElementsByTagName('head')[0] || body).appendChild(createElement('script')).src = 'http://bdimg.share.baidu.com/static/api/js/share.js?cdnversion=' + ~(-new Date() / 36e5)];
</script>
</div>
</body>
</html>首先需要在头部重置一下百度分享插件
<script>window._bd_share_config = {share: []};</script>然后在分享组件加个
data-tag="share_1">
区分一下百度分享组件。
接着是分享内容代码
<script>
var share1 = {
tag: "share_1",
bdText: "分享的内容",
bdUrl: "http://www.wdzzz.com",
bdDesc:"111"
};
window._bd_share_config.share.push(share1);
</script>这里的share_1对应的分享按钮的share_1,share1也是为了区分分享内容需要不同。
最后在底部引用百度分享的JS
<script>
with (document)0[(getElementsByTagName('head')[0] || body).appendChild(createElement('script')).src = 'http://bdimg.share.baidu.com/static/api/js/share.js?cdnversion=' + ~(-new Date() / 36e5)];
</script>

