-
Notifications
You must be signed in to change notification settings - Fork 2
三个分享插件对比
Tao edited this page May 4, 2018
·
14 revisions
之前活动一直使用 Jiathis ,从接手项目开始就是使用的这个分享插件,由于这个插件速度快,配置容易,且兼容性好,在分享插件里一直口碑非常好,但是 2017年10月 国庆节后的一两天, Jiathis 的官网忽然挂了,导致我们使用分享的几个活动和网站分享功能不能使用,所以做了以下的对比,希望挑选出好用又快速稳定的插件。总结的不好或者不对的地方,见者可修改完善_
--- | 隶属公司 | 博客更新情况 | 加载速度 | 数据统计准确度 | 使用难易度 | 是否可以自定义 | 稳定性 |
百度分享bdshare | 百度 | 11后无更新 | 加载很慢和不支持 https(除非下载到本地) | 统计准确 | 需要配置参数 | 可以 | 非常稳定 |
bshare | Buzzinate | 14年后无更新 1~2/年 | 速度比百度较快 | 分享效果数据统计做的最好的 | 需要配置参数 | 可以 | 比较稳定 |
jiathis | jiathis | 15年后无更新 之前更新比较频繁 | 轻量级,速度最快,所需加载的文件最小 | 统计比较准确 | 需要配置参数 | 可以 | JiaThis公司决定自2018年4月30日起已关闭“分享”业务 |
-
在使用分享工具上面,站长主要是考虑加载速度、功能和统计这3方面功能,Jiathis提供的按钮加载速度是大家一致公认的;功能方面,三个插件都能实现网页分享、图片分享(具体还需添加方法,传递一些参数),百度分享可以划词分享,bshare的统计更精准实在一点。 百度分享的确很多国内网站在用,有的人认为百度分享会吸引一些爬虫,可能对网站排名提升有帮助,不过其实没什么用处,网站排名还是要看内容和整体的seo规划。
-
由于JiaThis已关闭“分享”业务,目前我们网站主要推荐使用bdshare,即百度分享
-
个人的测试用例,可直接复制使用,但是会有
http、https
之间的报错
- 百度分享
window._bd_share_config = {
common : { //此处放置通用设置
bdText : '',
bdDesc : '',
bdUrl : '',
bdPic : '',
...
},
share : [
//此处放置分享按钮设置
],
slide : [
//此处放置浮窗分享设置
],
image : [
//此处放置图片分享设置
],
selectShare : [
//此处放置划词分享设置
]
}
配置项名称 | 值类型 | 格式和取值 | 描述 |
---|---|---|---|
bdText | string | 自定义 | 分享的内容 |
bdDesc | string | 自定义 | 分享的摘要 |
bdUrl | string | 自定义 | 分享的Url地址 |
bdPic | string | 自定义 | 分享的图片 |
bdSign | string | on|off|normal | 是否进行回流统计。 'on': 默认值,使用正常方式挂载回流签名(#[数字签名]) 'off': 关闭数字签名,不统计回流量 'normal': 使用&符号连接数字签名,不破坏原始url中的#锚点 |
bdMini | int | 1|2|3 | 下拉浮层中分享按钮的列数 |
bdMiniList | array | ['qzone','tsina',...] | 自定义下拉浮层中的分享按钮类型和排列顺序。详见分享媒体id对应表 |
onBeforeClick | function | function(cmd,config){} | 在用户点击分享按钮时执行代码,更改配置。 cmd为分享目标id,config为当前设置,返回值为更新后的设置。 |
onAfterClick | function | function(cmd){} | 在用户点击分享按钮后执行代码,cmd为分享目标id。可用于统计等。 |
bdPopupOffsetLeft | int | 正|负数 | 下拉浮层的y偏移量 |
bdPopupOffsetTop | int | 正|负数 | 下拉浮层的x偏移量 |
- bshare
<div class="bshare-custom icon-medium"></div>
<script type="text/javascript">
<!--http://api.bshare.cn/share/<platformName>?url=<url>[&title=<title>][&summary=<summary>][&publisherUuid=<publisherUuid>][&pic=<pic>]-->
//bShare分享
$(document).ready(function() {
iBShare.init(); //初始化
});
var iBShare = {
//初始化
init: function() {
var img ="<?php echo $event['poster'];?>";
var title = "<?php echo $event['title'];?>";
var thisurl = window.location.href;
var summary = "硬来 - 电子行业线下活动汇聚地";
var $shareBox = $(".bshare-custom");
//加载分享工具
var tools = '<a title="分享到微信" class="bshare-weixin" href="javascript:void(0);"></a>';
tools += ' <a title="分享到新浪微博" class="bshare-sinaminiblog" href="javascript:void(0);"></a>';
tools += '<a title="分享到QQ好友" class="bshare-qqim" href="javascript:void(0);"></a>';
tools += '<a title="分享到QQ空间" class="bshare-qzone" href="javascript:void(0);" ></a>';
$shareBox.append(tools);
//绑定分享事件
$shareBox.children("a").click(function() {
var parents = $(this).parent();
bShare.addEntry({
title: title,
url: thisurl,
summary: summary,
pic: img
});
});
}
}
</script>
platformName | 分享的目标平台,参考分享平台代码页面 |
url | 分享的URL |
title | 分享的标题(可选) |
summary | 分享的内容摘要(可选) |
publisherUuid | 站长的UUID(可选),不指定则无法追踪数据。 |
pic | 分享的图片(可选),支持新浪微博,搜狐微博,网易微博,腾讯微博等平台 |
- jiathis
var jiathis_config = {
boldNum:0,
siteNum:7,
showClose:false,
sm:"t163,kaixin001,renren,douban,tsina,tqq,tsohu",
imageUrl:"http://v2.jiathis.com/code/images/r5.gif",
imageWidth:26,
marginTop:150,
url:"http://www.jiathis.com",
title:"自定义TITLE #微博话题#",
summary:"分享的文本摘要",
pic:"自定义分享的图片连接地址",
data_track_clickback:true,
appkey:{
"tsina":"您网站的新浪微博APPKEY",
"tqq":"您网站的腾讯微博APPKEY",
"tpeople":"您网站的人民微博APPKEY"
},
ralateuid:{
"tsina":"您的新浪微博UID"
},
"shortUrl":是否开启短链接,
evt:{
"share":"用户自定义函数" ( 可以根据自己的命名规范来定义一个自定义函数,如:getEvent )
说明:evt参数可以得到用户的分享操作的相关信息。比如:用户分享的URL,用户分享到的媒体。但是,我们不能确定用
户是否真正成功的分享了内容,只能确定用户确实是点击了分享按钮……
}
}
参数名 | 描述 | 类型 | 默认值 |
url | 自定义分享的URL | string | 网页地址 |
title | 自定义分享的TITLE | string | 网页标题 |
summary | 定义要分享页面的摘要,摘要默认为Meta标签中Description部分的内容 | string | 无 |
boldNum |
分享面板上加粗媒体的个数。如果缺省,则标准风格的分享面板默认是6个加粗,迷你风格的分享面板默认是3个加粗。 何时会加粗:当用户使用过JiaThis分享到功能后,JiaThis会依据该浏览者的喜好产生一个智能排序的顺序,这个顺序的前几个会被加粗,您可以通过这个参数自由控制加粗的个数,如果您想关闭加粗的功能,则将此参数写成数字0就可以了。 |
integer |
标准:6 迷你:3 |
siteNum | 分享面板上的社会化媒体的个数。通常情况,这个数字应当大于或等于boldNum参数,因为需要加粗的个数不会多于整个分享面板媒体的个数。如果缺省,标准风格默认为15个,迷你风格默认为6个。 | integer |
标准:15 迷你:6 |
sm |
自定义分享面板上社会化媒体的排序。填写媒体网站的WEBID(如:tsina表示新浪微博,tqq表示腾讯微博,更多的社会化媒体WEBID参见这里),用英文半角逗号分隔。如果网站主使用了此自定义功能,则自定义的媒体网站会优先固定出现在前面,后面紧跟依据网站浏览者分享行为产生的智能排序结果。这个结果不会与您自定义的媒体重复。如果缺省,分享面板会按照智能排序的规则出现媒体。 特别的,siteNum 参数与 sm 参数交替使用几乎可以让您自定义任何您想要的分享面板。 举例一:
var jiathis_config = {
这表示:分享面板上总共会出现7个媒体,前两个是新浪微博和腾讯微博,后面剩下的5个则根据智能排序规则出现。当然,和您想的一样,这剩下的5个不会再次包含新浪微博或者是腾讯微博了。 sm:"tsina,tqq", siteNum:7 } 举例二:
var jiathis_config = {
这表示:分享面板公共会出现4个媒体,这4个媒体全都是您自定义的。如果这里的 siteNum小于4,比如假设是3,则分享面板会出现3个媒体,sm参数中的最后一个tsohu(搜狐微博)不会出现。
sm:"tsina,tqq,t163,tsohu", siteNum:4 } |
string | 无 |
imageWidth | (只对侧栏式有效):这是imageUrl参数的一个补充。如果您自定义了分享图片,且这个图片宽度不与我们官方标准风格或迷你风格的图片宽度一致时,可能出现显示的偏差或错位,这时候您就需要将imageUrl参数中图片的实际宽度填写在这里。缺省状态下,标准风格的图片宽度为26,迷你风格的图片宽度为20。 | integer |
标准:26 迷你:20 |
marginTop | (只对侧栏式有效):如果我们不想让分享按钮处于页面的中间部位,我们就可以用marginTop属性来控制分享按钮在页面中的位置,是位于页面的上边,还是页面的下边,或是偏上、偏下,都可以实现。默认的位置就是中间位置,也就是距离页面上边是150px。 | integer | 无 |
showClose | (只对侧栏式有效):是否在分享面板中加入关闭按钮。如果缺省,默认会开启关闭按钮。这表示浏览者可以通过这个关闭按钮关闭侧栏式分享按钮。 | boolean | true |
imageUrl | (只对侧栏式有效):侧栏式风格的图片地址。侧栏式风格的"分享到"图片允许网站主自定义,当您觉得JiaThis官方提供的所有图片风格都无法满足您的要求时,您或者您的团队可以自己设计一个分享到图片。将这个图片放入您的服务器。保该图片可以通过因特网正常访问,如:http://yourdomain/images/share.gif, 然后将该地址填写到这里这里即可。 | string | 无 |
appkey | 您网站对应各大社会化媒体的APPKEY,内容被分享后,显示的来源将是您自己的网站。 | object | 无 |
ralateuid | 目前仅新浪微博支持,此处填写您的新浪微博UID,内容被分享后,将会自动@分享者提示他关注您。默认情况下此值为空,不会出现@提示。 | object | 无 |
data_track_clickback | 是否启用回流量统计,启用后,分享出去的链接会自动在后面加上jtss=xxx的参数,这样可以精确统计到您网站的回流量。 | boolean | false |
pic | 支持新浪微博、腾讯微博、搜狐微博、网易微博,可以自定义分享的图片,如果此值为空,将会根据社会化媒体原有的抓图机制来获取您网站的图片。 | string | 无 |
shortUrl | 是否针对新浪微博开启短链接传递,如果缺省,默认为true(开启),关闭定义为false(不开启) 不加引号 | string | true |