百度分享,算是目前比较火的一个分享工具,常规我们在用时,直接放网站底部,那么:
- 文章页面就是分享文章
- 分类页面就是分享分类
但是呢,在制作wordpress主题遇到特殊需求,比如,在分类页面,文章列表循环中,我点击分享按钮,并分享这篇文章。那原本的分享按钮就不管用了。
那如何在分类页面的文章列表中分别分享指定文章呢?
在阅读百度分享的高级设置说明后,我能想到的办法,只能是通过onBeforeClick 这个事件来获取,指定文章的标题,链接,甚至是图片。
方法奉上:
js
//先定义变量
var Shareherf = "";
var Sharetext = "";
var Sharepic = "";
//绑定所有分享按钮所在A标签的鼠标移入事件,从而获取变量
$(function () {
$(".bdsharebuttonbox a").mouseover(function () {
Shareherf = $(this).attr("data-herf");
Sharetext =$(this).attr("data-text");
Sharepic =$(this).attr("data-pic");
});
});
//插件的配置部分,注意要记得设置onBeforeClick事件,传入分享数据。
function wpdieShareUrl(cmd, config) {
if (Shareherf) {
config.bdUrl = Shareherf;
config.bdText = Sharetext;
config.bdPic = Sharepic;
}
return config;
}
window._bd_share_config = {
common: {
"onBeforeClick":wpdieShareUrl,
"bdText": "",
"bdMini": "2",
"bdMiniList": false,
"bdPic": "",
"bdStyle": "0"
},
share: [{
bdCustomStyle: ''
}]
};
//分享的固定JS加载部分
with(document)0[(getElementsByTagName('head')[0]||body).appendChild(createElement('script')).src='http://bdimg.share.baidu.com/static/api/js/share.js?v=89860593.js?cdnversion='+~(-new Date()/36e5)];
html部分,根据你的代码不同,大概如下:
<div class="bdsharebuttonbox" style="float: left;padding-left: 0;border-left: 0px;">
<a href="javascript:;" data-herf="指定链接" data-pic="指定图片" data-text="指定标题" data-cmd="more" class="sharemore share-links bds_more"></a>
</div>
好了,就这样。
转载链接: https://wpsenlin.com/wpkaifa/1040.html
原创文章版权属于作者,转载请注明出处。
- 有不懂的地方,欢迎加群(281907514)进行讨论!