bShare提供了自定义分享内容 bshare 自定义图标

分享到微博时的具体微博内容可以按照自己的想法来设置,而不是用bShare默认的设置,即标题在前,然后是摘要、@和话题,最后是链接。现在bShare提供了自定义分享内容的方法,可以登录后到站长后台管理中心,在网站的“分享设置”页面中设置。



设置后,bShare会在分享时把${TITLE}替换为页面标题,把${SUMMARY}替换为页面摘要,把${MENTION_TOPIC}替换为@和话题。但由于分享时URL是通过不同的参数传入的,所以无法设置URL的位置。例如按照上面图片里的设置,分享到微博里的内容会类似这样:



如果是分享到微博类平台的话,您还可以让用户在分享内容中@您的微博账户,或者添加指定的话题。如果您使用的是bShare Plus的话,您还能让用户在分享完成后提示关注您的微博账号。

您只需要登陆bShare后进入高级自定义页面,在社交网站关注设置部分,点击平台对应的连接按钮,连接到您的微博账号即可添加@和关注。每个账号下还有两个小选项,您可以分别选择是否让用户在分享时@,以及是否分享后提示关注。



话题设置则更简单,您只需要输入您想要的话题,点击添加按钮即可。

bShare提供了自定义分享内容 bshare 自定义图标


设置完成后,用户的分享内容如下图所示,注意@及##部分的内容。



如果您使用的是bShare Plus,则用户分享完成后会显示如下页面,提示用户进行关注:



如果您很熟悉JavaScript、HTML及CSS,想要完全按照自己的设计实现分享按钮,但同时又希望利用bShare已有的分享及统计功能,我们也提供了JavaScript的客户端API来帮助您实现。

目前有以下API可供调用:

bShare.addEntry(entry);

用于设置分享的内容,包括标题、摘要、图片等。用法可以参考自定义分享内容及图片,一个页面放置多个bShare按钮。

bShare.share(event, shortName[, entryNum]);

分享内容到指定的平台。

event对应的DOM事件,例如用户的点击事件对象。

shortName分享目标平台的代码,可以参考分享平台代码页面。

entryNum指定分享的内容,对应addEntry的调用,即如果是0则对应第1次addEntry的调用,如果是1则对应第2次addEntry的调用,以此类推。只有页面中有多个按钮时需要指定。

bShare.more(event[, entryNum]);

打开分享大弹窗,类似点击bShare上的“更多”按钮的效果。参数的意义和share方法中的相同。

bShare.init();

加载并初始化bShare分享服务。默认是会在页面内容加载完成后进行调用,也就是延迟加载。如果您想要提前加载bShare,也可以显式调用它;或者您是在页面加载完成后通过Ajax加载bShare的JS代码,则必须显式调用。

注意调用API的页面中必须包含bShare的JS嵌入代码,如果您不想显示bShare预定义的按钮,您可以将style参数设置为-1。

范例:

如果您非常了解HTML、CSS和JavaScript,并且想要完全按照自己的想法去设计分享图标的显示方式,没问题!我们提供给您最大的自由发挥的空间,同时您又能很方便的使用bShare的分享功能。

平台分享小图标

用以下的代码创建一个平台分享小图标:

<a title="飞信" onclick="javascript:bShare.share(event,'feixin',0);return false;">

<img src="http://static.bshare.cn/frame/images/logos/s4/feixin.gif"/>

<span>飞信</span></a>

您应该会注意到您可以设置自己的图标和文字,您也可以使用CSS定义图标的式样。实际上,您唯一需要保留的就是在用户进行分享行为时调用bShare.share(event,'feixin',0)就可以了。当然,您也可以直接使用我们提供的图标和样式。

对我们所有的支持的平台,只要用我们的平台代码替换示例中的红色部分就可以了。

"更多..."按钮

要添加bShare的"更多..."按钮,您可以使用如下代码:

<a title="更多平台" onclick="javascript:bShare.more(event);return false;"/>

<img src="http://static.bshare.cn/frame/images/more.gif"/>

<span>更多平台</span></a>

同样的,您也可以使用您自己的图片并控制它的式样。您只需要在用户点击时调用bShare.more(event)就可以了。

范例

下面是一个会显示飞信、新浪微博和更多按钮的示例:

<div>

<span onclick="javascript:bShare.more(event);return false;">分享到:</span>

<a title="分享到腾讯朋友" onclick="javascript:bShare.share(event,'qqxiaoyou',0);return false;">

<img src="http://pic.aIhUAu.cOm/img/2015/11/22/30493747_7231926.jpg"/>

<span>腾讯朋友</span></a>

<a title="分享到新浪微博" onclick="javascript:bShare.share(event,'sinaminiblog',0);return false;">

<img src="http://pic.aIhUAu.cOm/img/2015/11/22/30493747_8231926.jpg"/>

<span>新浪微博</span></a>

<a title="更多平台" onclick="javascript:bShare.more(event);return false;"/>

<img src="http://pic.aIhUAu.cOm/img/2015/11/22/30493747_9231926.jpg"/>

<span>更多平台</span></a>

</div>

<script type="text/javascript" charset="utf-8" src="http://static.bshare.cn/b/buttonLite.js#uuid=<你的UUID>&style=-1"></script>

这段代码会生成:分享到:腾讯朋友新浪微博更多...

最后,不要忘了在您的页面上必须要加载上bShare的嵌入JavaScript代码!

<script type="text/javascript" charset="utf-8" src="http://static.bshare.cn/b/buttonLite.js#uuid=<你的UUID>&style=-1"></script>

注意如果您不需要显示bShare的默认按钮,您可以将style设置为-1并且设置您的UUID。当然,您也可以同时显示bShare的预定义式样的按钮。例如,你可以在文章头部放一个带分享计数的bShare分享按钮,同时在底部放上您自己设计的分享图标,这样会有更好的分享和传播效果哦。

现在,就去发挥您的想象力,试试看创建一个完全属于您的按钮式样吧!

默认的回流量统计是通过在链接上加参数的方式进行统计的。启用后,用户分享时会看到链接后面多了一个bsh_bid的参数,这个参数就是bShare用来进行回流统计的。使用这种方法,必须在实际分享的页面上有bShare的嵌入代码才可以。当用户点击带bsh_bid参数的页面链接后,bShare的JS嵌入代码会解析这个参数并统计回流量。

要注意的是有些网站使用了URL重写实现了伪静态页面,但由于重写规则没有注意处理类似bsh_bid这样的未知参数,当URL上多了这个参数时,页面会显示错误。这时一种方法是修改重写规则,使得其能正确处理未知的URL参数。另外一种方法使用burl短链接来统计回流量。

除了上述情况,有时实际分享的页面和按钮所在的页面可能不同,实际分享的页面没有bShare的JS嵌入代码,此时也可以使用bURL短链接。

bURL短链接主要用于用户分享时缩短链接的长度,但它同时也附带了回流量统计的功能。要注意的是如果您同时启用了bURL短链接和URL参数回流量统计,系统会优先使用URL参数的方式进行统计。也就是说如果您因为上述各种原因需要使用burl来统计回流量,您必须关闭URL参数回流量统计。

另外还有一种方法就是,如果您的网站使用了GA(Google Analytics)进行统计,bShare也可以和GA集成,通过GA统计回流量。启用后会在分享的链接后加上GA的参数(以utm开头的参数)。

同样的,你也可以在bShare后台的回流量追踪自定义页面进行设置:

  

爱华网本文地址 » http://www.aihuau.com/a/25101011/53749.html

更多阅读

qq空间怎么免费设置背景 qq空间免费自定义背景

qq空间怎么免费设置背景——简介QQ空间采用模块化的设计理念,为我们自定义QQ版面提供了方便的方法,只需要通常简单的拖动即可设计出唯美的个性化风格空间。下面就与小编一起来学习一下QQ空间背景的设计方法。qq空间怎么免费设置背景

怎么自定义qq资料卡皮肤 动漫qq资料卡背景

怎么自定义qq资料卡皮肤——简介腾讯的QQ2013提供了可以自定义的资料卡皮肤,不过可惜的是非会员的用户只可以自定义几种皮肤,会员的话也只是稍微多些几种。如果我们想自已定义自己喜欢的皮肤该怎么办呢。这里我们介绍一下操作步骤。

在excel中使用自定义函数 excel2013自定义函数

**ZxwLu**欢迎您在excel中使用自定义函数我们都知道,在Excel中,提供了很多常用的功能强大的内置函数,只要使用这些内置的函数,就能提高我们的工作效益。但是,提供的内置函数,毕竟都是常用的;可是,我们的工作问题,不可否认具有特殊性,因此,在某

360doc图书馆原创皮肤下载及自定义装扮 qq空间自定义装扮

360doc图书馆原创皮肤下载及自定义装扮原创 往日学风一、前言非常感谢馆方提供了书馆首页自定义皮肤功能,从而使得书馆更具多样化、个性化、美观化。学风多年来十分喜爱Photoshop制图以及flash动画制作等,最近利用业余时间尝试制作了

如何认识和分享网络中的自由 自由是对必然的认识

——一个50后对自由的追求与思考8尽管我们这代人经历了思想被严重束缚的年代,但我们终究还是幸运的,因为我们赶上了互联网的时代。我很同意高晓松在近期的“晓说”中,将六百年前的哥伦布大航海壮举与如今的互联网浪潮相提并论的观点。

声明:《bShare提供了自定义分享内容 bshare 自定义图标》为网友青空如璃分享!如侵犯到您的合法权益请联系我们删除