百度分享创意用法

作者: dreamfly 分类: jquery插件,未分类 发布时间: 2016-01-26 00:26

一般使用百度分享的时候,我们会按照官方的说明来进行html,css,js的布局来写分享代码、

比如:

<div class="bdsharebuttonbox" data-tag="share_1">
	<!-- 此处添加展示按钮 -->
</div>
<script>
	window._bd_share_config = {
	//此处添加分享具体设置
	}

	//以下为js加载部分
	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>

其实,我们可以使用下面的方法来进行,html结构完全自己定义,css样式也自己定义,这样,可以使用自己喜欢的样式

<div class="share" id="ckepop">
        <span>分享</span>
        <button class="share_weibo" id="share_weibo_id" title="分享到新浪微博"></button>
        <button class="share_qq" id="share_qq_id" title="分享到QQ空间"></button>
        <button class="share_weixin" id="share_weixin_id"></button>
    </div>

$("#share_weibo_id").click( function() {
   window.open("http://share.baidu.com/s?type=text&searchPic=0&sign=on&to=tsina&url=http://www.tuicool.com/articles/6vAjUrv&title=keil+uvision%E7%9C%8B%E5%8E%8C%E4%BA%86%E4%B9%88%EF%BC%9F%E8%AF%95%E8%AF%95Sublime+Text%E5%90%A7%EF%BC%81++%28%E5%88%86%E4%BA%AB%E8%87%AA+%40%E6%8E%A8%E9%85%B7%E7%BD%91%29&key=3113829255");
});
$("#share_qq_id").click( function() {
   window.open("http://sns.qzone.qq.com/cgi-bin/qzshare/cgi_qzshare_onekey?url=http://www.tuicool.com/articles/6vAjUrv&title=keil+uvision%E7%9C%8B%E5%8E%8C%E4%BA%86%E4%B9%88%EF%BC%9F%E8%AF%95%E8%AF%95Sublime+Text%E5%90%A7%EF%BC%81&desc=&summary=&site=");
});
$("#share_weixin_id").click( function() {
  $("#share_weixin_image").toggle();
});

我们通过window.open来打开分享链接,其中的参数,我们可以进行自定义的修改。

其中微信二维码的生成,调用了api jiathis. 其中图片的src为:

http://s.jiathis.com/qrcode.php?url=http://www.tuicool.com/articles/6vAjUrv?via=wechat_qr

还有一个生成二维码的接口:

http://bshare.optimix.asia/barCode?site=weixin&url=http://lanyes.org

如果觉得我的文章对您有用,请随意打赏。您的支持将鼓励我继续创作!