关于百度分享按钮

知更鸟
知更鸟
站长
2322
文章
0
粉丝
网文资讯7621,178阅读模式

提供分享收藏到社会化网络服务(SNS)的按钮工具,多不胜数,此前国内较有名的有JiaThis、bShare等。 作为国内搜索老大的百度也不甘落后,于6月份推出百度分享测试版,如今已正式上线,从外观与功能完全仿自JiaThis,当然也不知JiaThis抄袭自哪家,真是天下文章一大抄....

不过看了百度针对分享按钮的产品介绍,让你不得不舍弃其它同类服务(注意红色部分):

通过百度分享按钮,您的网站的浏览者可以便捷得分享您网站上的内容到人人网、开心网、qq空间、新浪微博等SNS站点进行传播,为您的网站带回更多的流量。

通过百度分享按钮,您网站上的网页将更容易被百度搜索引擎所发现,从而有机会从百度搜索带回更多的流量。

通过百度分享按钮,您可以免费获取详尽地分享统计分析。了解网民将您网站上哪些内容分享到哪些SNS网站,每日的分享次数是多少,帮您更好得的跟踪、分析、激励用户的分享行为,为网站带来更多的流量。

真是百毒,霸道啊!百度分享按钮虽然还不够成熟,特别是百度自己的很多服务分享按钮,目前都还没有直接使用该分享工具,但看了上面的产品介绍,你会放弃诸如:JiaThis、bShare等同类服务吗?

如果你对度娘这项服务感兴趣,下面就以HotNewsPro 2.7 Plus主题为例,把分享按钮完美加到模板中。

百度分享与JiaThis、bShare工具一样,专门为Wordpress站点提供了相关插件,但个人感觉完全没必要安装这个插件,直接把自己申请注册后获得的代码加到模板中更为方便灵活。

百度分享工具代码如下:

  1. <!-- Baidu Button BEGIN -->
  2.     <div id="bdshare" class="bdshare_t bds_tools get-codes-bdshare">
  3.         <span class="bds_more">分享到:</span>
  4.         <a class="bds_qzone"></a>
  5.         <a class="bds_tsina"></a>
  6.         <a class="bds_tqq"></a>
  7.         <a class="bds_renren"></a>
  8.         <a class="shareCount"></a>
  9.     </div>
  10. <script type="text/javascript" id="bdshare_js" data="type=tools&amp;uid=6688" ></script>
  11. <script type="text/javascript" id="bdshell_js"></script>
  12. <script type="text/javascript">
  13.     document.getElementById("bdshell_js").src = "http://share.baidu.com/static/js/shell_v2.js?t=" + new Date().getHours();
  14. </script>
  15. <!-- Baidu Button END -->

其中:uid=6688中的数字为自己的专用ID号,其它大至相同

  1. <span class="bds_more">分享到:</span>
  2. <a class="bds_qzone"></a>
  3. <a class="bds_tsina"></a>
  4. <a class="bds_tqq"></a>
  5. <a class="bds_renren"></a>
  6. <a class="shareCount"></a>

上面是默认显示的SNS站点的图标ID,根据自己的需要可以到下面的页面适当增加分享到的网站图标:

http://share.baidu.com/help/webid

例如:增加谷歌Buzz和QQ收藏图标,代码如下:

  1. <a class="bds_qq"></a>
  2. <a class="bds_buzz"></a>

相应 WEBID名称前面必须加上“bds_”

代码具体添加位置

图标显示代码:

  1.    <div id="bdshare" class="bdshare_t bds_tools get-codes-bdshare">
  2.        <span class="bds_more">分享到:</span>
  3.        <a class="bds_qzone"></a>
  4.        <a class="bds_tsina"></a>
  5.        <a class="bds_tqq"></a>
  6.        <a class="bds_renren"></a>
  7.   <a class="shareCount"></a>
  8.    </div>

加到single.php模版:

  1. <div class="back_b">

上面,也就是与正文底部返回按钮并排显示。

加载的javascript代码:

  1. <script type="text/javascript" id="bdshare_js" data="type=tools&amp;uid=60788" ></script>
  2. <script type="text/javascript" id="bdshell_js"></script>
  3. <script type="text/javascript">
  4.     document.getElementById("bdshell_js").src = "http://share.baidu.com/static/js/shell_v2.js?t=" + new Date().getHours();
  5. </script>

放到主题footer.php模版:

  1. <?php wp_footer(); ?>

上面。这样有利用提高页面加载速度,当然也可以与图标显示代码放在一起,相信度娘的网站速度不会有太大的影响。

如果你喜欢显示较大的图标,可以将如下代码:

  1. <div class="context_b">
  2.     <div id="bdshare" class="bdshare_t bds_tools_32 get-codes-bdshare">
  3.          <span class="bds_more"></span>
  4.          <a class="bds_qzone"></a>
  5.          <a class="bds_tsina"></a>
  6.          <a class="bds_tqq"></a>
  7.          <a class="bds_renren"></a>
  8.          <a class="bds_xg"></a>
  9.          <a class="bds_sohu"></a>
  10.          <a class="bds_buzz"></a>
  11.          <a class="bds_msn"></a>
  12.          <a class="bds_qq"></a>
  13.          <a class="bds_tsohu"></a>
  14.          <a class="bds_fbook"></a>
  15.          <a class="bds_deli"></a>
  16.          <a class="bds_baidu"></a>
  17.          <a class="bds_ff"></a>
  18.          <a class="bds_fbook"></a>
  19.          <a class="shareCount"></a>
  20.     </div>
  21.     <i class="lt"></i>
  22.     <i class="rt"></i>
  23.     <i class="lb"></i>
  24.     <i class="rb"></i>
  25. </div>

放到single.php模板:

  1. <!-- entrymeta -->

注释上面。

最后,简单美化一下样式,把下面代码加到主题的style.css中

  1.  /*** 分享 **/
  2. span.bds_more, .bds_tools a,#bdshare ul li a, #bdshare_s ul li a  {
  3.     font: 12px 'Microsoft YaHei', 微软雅黑, Arial, Lucida Grande, Tahoma, sans-serif !important;
  4.     }
  5. #bdshare h6, #bdshare_s h6,#bdshare p, #bdshare_s p  { /*** 隐藏弹出层上下标题 **/
  6.     display:none;
  7.     }
  8. div #bdshare_l_c {/*** 给弹出层加边框及圆角 **/
  9.     border:1px solid #ccc;
  10.     -moz-border-radius: 5px;
  11.     -webkit-border-radius: 5px;
  12.     border-radius: 5px;
  13.     }

效果如下图:

 

另外,申请注册百度分享按钮后,可能很长时间数据分析功能都无法使用,这个需要等,几天之后自然会正常。

本站文章大部分为原创,用于个人学习记录,可能对您有所帮助,仅供参考!

weinxin
我的微信
微信号已复制
版权声明
本站原创文章转载请注明文章出处及链接,谢谢合作!
 
知更鸟
评论  76  访客  63  作者  8
    • 阿星
      阿星 5

      真不懂,这有什么用,不就是个博客么,别人爱看就看,不看拉到,我自己看!难道还想靠博客盈利不成?

        • 汕头SEO
          汕头SEO 5

          @ 阿星 开博客并不是为了盈利,只是看你用这个博客来做什么。如果自己看,还不如弄个记事本,直接写。

            • Kael.Z
              Kael.Z 7

              @ 汕头SEO 这点倒不是很赞同,每个人的理念都不一样,博客是分享的,一可以给自己看,二可以给想看的人看

                • 阿星
                  阿星 5

                  @ Kael.Z 博客是一个展示自己的平台,不是盈利的平台。博客的出现是为了让更多的人认识你、证明你、了解你罢了。你可以把你值得骄傲的东西丢上面,分享到更多的人。也可以是记载,记载那些你不想遗忘的东西,而记事本就满足不了这些了……
                  想搞盈利就别弄独立博客嘛!(个人见解)

                    • 托友之家
                      托友之家 1

                      @ 阿星 我觉得未必啊。有的时候,别人很欣赏你的东西,觉得有必要分享给别人看,所以才要这些按钮啊,否则人家只能复制粘贴了,你觉得那个更划算?!

              • 昙花一现
                昙花一现 0

                分享按钮怎么弄好没学会..

                • 博客学吧
                  博客学吧 1

                  已经安装了,但并没有真正用.

                  • Young Free!
                    Young Free! 2

                    我正准备写一篇如何在HNP主题中添加百度分享按钮的文章的,没想到鸟哥已经老早就发布了,那我就直接转载了啊。
                    安装百度的分享按钮,说白了,就是为了讨好百度。希望能早点从被百度拔毛的噩梦中回到现实。

                    • freebbs3000
                      freebbs3000 0

                      您好,我最近装了WP3.2.1,发现包括WP官方网站在内以及您的这个网站的模板,被屏蔽了script的关闭标签。但JS照样可以执行,我的却不可以。怎么回事呢?
                      您可以查看->源代码,然后找一下script的关闭标签。是不是有些被屏蔽了(没有输出HTML)?

                      • 黄色
                        黄色 1

                        怎么百度啥都做呢?真是钱多烧得

                        • Louis Han
                          Louis Han 6

                          百度这一招真是太毒了 走别人的路让别人无路可走啊

                          • 看得见风的人
                            看得见风的人 6

                            鸟哥,我就把分享代码加到了single页面,这样可以么?有什么影响吗?

                            • 孤苏陌澜
                              孤苏陌澜 3

                              网络世界一大抄,深究已无意义,还是随波逐流··

                              • 郑州驾校
                                郑州驾校 4

                                这个可以有!谢谢哥哥的分享!

                                • gaogang
                                  gaogang 2

                                  我装了试试,但没明白具体用法。分享到哪儿去了?

                                  • Win7en乐园
                                    Win7en乐园 8

                                    其实应该是直接从加网那买的“技术”,然后自己做的,就想当年的点讯输入法一样。那时候说的是点讯也更新,百度也更新。只是买技术。

                                    • 石家庄seo
                                      石家庄seo 1

                                      哇 你的主题很不错哦 值得收藏

                                      • 玻璃棉
                                        玻璃棉 1

                                        不错的主题 能分享下吗? 123@suolatu.cn

                                        • 汕头SEO
                                          汕头SEO 5

                                          鸟哥,太爱你了!!!!!

                                          • 电脑天空
                                            电脑天空 5

                                            红色字体部分果然非常的让人激动哈哈

                                            • luguo
                                              luguo 0

                                              R,鸟哥,百度给你多少好处?还要你在这里王婆卖瓜?真虚伪。

                                              • 大结局
                                                大结局 2

                                                不喜欢,样式真难看~~

                                                • Bob
                                                  Bob 5

                                                  百度——史上最无道德的公司,呵呵

                                                  • Bob
                                                    Bob 5

                                                    感觉JiaThis做的更好一点!

                                                      • 知更鸟
                                                        知更鸟

                                                        @ Bob 一样的功能,没什么区别,区别就是这个最无道德的公司的实力是JiaThis无法比拟的

                                                      • 瘦腿
                                                        瘦腿 2

                                                        一直在模仿,从来不超越

                                                        • 提拉米苏生活
                                                          提拉米苏生活 1

                                                          刚弄好,没指望让它带给俺什么!呵呵!

                                                          • 电动堆高车
                                                            电动堆高车 3

                                                            过来回复,就是赚点外部链接,希望大哥不要介意了

                                                            • Win7en乐园
                                                              Win7en乐园 8

                                                              看来返回按钮还是有必要留下来,之前因为用无觅,所以返回按钮看上去很不舒服,然后给删掉了,我用了一段时间百度的,不过百度的不支持自定义appkey,现在又换加网了,呵呵

                                                              • sealango
                                                                sealango 5

                                                                百度的一句话,让人不得不果断放弃其他产品啊。
                                                                不过百度在长宽下解析很烂。
                                                                百度统计在长宽下根本显示不出来,直接拖慢了整个网站的速度。
                                                                回头试一下百度分享会不会也这样。

                                                                • 屈臣氏官网
                                                                  屈臣氏官网 5

                                                                  已经安装了

                                                                  • 我爱聊吧
                                                                    我爱聊吧 4

                                                                    “通过百度分享按钮,您网站上的网页将更容易被百度搜索引擎所发现,从而有机会从百度搜索带回更多的流量。”这句话最诱人~~

                                                                    • 明和超音波
                                                                      明和超音波 2

                                                                      这个真的很不错,一定要学,我们做站主要是靠百度过来的流量,所以不学不行了

                                                                      • 童佳倩的大衣
                                                                        童佳倩的大衣 3

                                                                        红色部分是关键,能加快收录当然最好,以前一直用的是jiathis,还真没用过百度分享工具,看来也得敢仅去试试哦。

                                                                        • 忆昔年
                                                                          忆昔年 3

                                                                          鸟哥的文章很给力

                                                                          • vileny
                                                                            vileny 1

                                                                            鸟哥,hotnewspro2.6带有的分享工具,在2.7怎么不显示了,我想用呢 怎么做给我说一下好吗 我邮箱395901567@qq.com

                                                                              • 知更鸟
                                                                                知更鸟

                                                                                @ vileny 需要添加JS,添加分享代码,添加CSS样式,几句话说不清,自己参考之前版本复原
                                                                                装个现成的分享插件不是更方便

                                                                              • ymhuhe
                                                                                ymhuhe 3

                                                                                鸟哥,我又来了,这个教程很牛逼(特别是红色字),本来我是不想用这个的,我是想用自己在新浪腾讯开放平台上自己申请的作为分享的,但,,,闲话不多说,说下我的问题吧

                                                                                我看到主题编辑里面有个share.php。里面也是分享代码,但这个怎么用呢,为什么文章里没有显示出来,如果我安装了这个百度分享,那share.php里面的内容是不是就没用了?是不是可以删除?

                                                                                • 不愁礼
                                                                                  不愁礼 0

                                                                                  为什么我装了不显示?

                                                                                  • 布林
                                                                                    布林 2

                                                                                    添加的谷哥分享没显示啊,怎么增加默认的图标呢

                                                                                    • 托友之家
                                                                                      托友之家 1

                                                                                      真的很管用,赞一个,谢谢!

                                                                                      • 奋斗
                                                                                        奋斗 1

                                                                                        鸟哥第一次来写的不错,个人见解,百度红色的字体让www.xxtxt.net我们把持不住啊

                                                                                        • 小明
                                                                                          小明 0

                                                                                          我用了挺好的

                                                                                          • yee
                                                                                            yee 0

                                                                                            想改“来自百度分享按钮”这几个字和地址,不知道怎么改。

                                                                                            • fangcaoba.com
                                                                                              fangcaoba.com 5

                                                                                              鸟哥,还是那个问题页面的分享按钮只能放在最下面,不然会打乱下面小工具的标题啊

                                                                                                • 知更鸟
                                                                                                  知更鸟

                                                                                                  @ fangcaoba.com 修改一下插件吧
                                                                                                  打开分享插件baidu_share.php找到:

                                                                                                  <div style=“margin:12px”>’ . $b_option . ‘</div>’;  
                                                                                                  改为:

                                                                                                  <div style=“margin:12px”>’ . $b_option . ‘</div><div class=“clear”></div>’;  
                                                                                                  或者加个文本小工具使用本文手动添加代码的方法,将代码加到文小工具中,并在原代码最后加上:

                                                                                                  <div class=“clear”></div>  

                                                                                                • 闲情水吧
                                                                                                  闲情水吧 1

                                                                                                  请问老大,如何让分享文章时同时分享(文章标题+文章内容+文章链接),好像你的那样,能否给我代码?236686737@qq.com

                                                                                                  • 闲情水吧
                                                                                                    闲情水吧 1

                                                                                                    如何让分享文章时同时分享(文章标题+文章内容+文章链接),好像你的那样,能否给我代码?

                                                                                                    • fangcaoba
                                                                                                      fangcaoba 5

                                                                                                      鸟哥,为什么我的cms布局分类id有一个id出现了重叠的现象?就是有两篇文章重叠,或日期出现在标题前面且只显示四篇,以前都没有这个问题啊???烦请解答。 现在我已经把那个分类id下了,太影响美观了,但是那个分类id很重要啊。。。

                                                                                                      • 家居壁纸
                                                                                                        家居壁纸 0

                                                                                                        鸟哥,来学习……回家试试

                                                                                                        • 土木网
                                                                                                          土木网 0

                                                                                                          看着有点晕,,慢慢琢磨。。

                                                                                                          • 学研端
                                                                                                            学研端 3

                                                                                                            学习了~

                                                                                                            • 艾维塔
                                                                                                              艾维塔 0

                                                                                                              百度分享和JIATHIS有什么区别吗?

                                                                                                              • 心缘
                                                                                                                心缘 0

                                                                                                                我看到有人在走路下载了东西,但是为什么我找不到路径?找不到该要的东西?

                                                                                                                • 在路上
                                                                                                                  在路上 4

                                                                                                                  我在别的地方扣了段css,但不知道怎么把背景改成透明,求赐教.
                                                                                                                  #bdshare
                                                                                                                  {width:40px;padding:10px
                                                                                                                  10px 0px 10px;position:fixed;_position:absolute;left:50%;margin-left:-542px;top:280px;_top:expression(eval(document.documentElement.scrollTop + 333));background:none repeat scroll 0 0 #F7F3ED;border:1px
                                                                                                                  solid #F7F3ED;border-radius:6px 0 0 6px;z-index:9999 !important;*z-index:9999}
                                                                                                                  #shareCount,#shareCountText
                                                                                                                  {color:#f25c05;width:40px;height:20px;line-height:23px;background:#EDFBFE !important;background:#EDFBFE;border:1px solid #CCC;text-align:center;text-indent:0}
                                                                                                                  #shareCount
                                                                                                                  {font-weight:700;padding-left:0;border-radius:5px 5px 0 0;border-bottom:none}
                                                                                                                  #shareCountText
                                                                                                                  {font-weight:200;border-radius:0 0 5px 5px;border-top:none;text-indent:0px}
                                                                                                                  #shareToText
                                                                                                                  {width:40px;text-align:center;display:inline-block;margin:7px
                                                                                                                  0 1px;font-size:12px}
                                                                                                                  #shareCount:hover,#shareToText:hover
                                                                                                                  {color:#f25c05}

                                                                                                                    • 在路上
                                                                                                                      在路上 4

                                                                                                                      @ 在路上 background:transparent 找了这么个东西搞定,但有个分享次数那块搞不定,sharecount这个不知道怎么改定义

                                                                                                                    • Twolake
                                                                                                                      Twolake 3

                                                                                                                      数据分析功能??

                                                                                                                      • 成长的企鹅
                                                                                                                        成长的企鹅 3

                                                                                                                        现在的百度的分享按钮是怎么做的啊?怎么实现始终贴着文章的左侧?

                                                                                                                        • joker
                                                                                                                          joker 0

                                                                                                                          鸟哥,百度分享代码添加到您文中所示的位置后,分享时页面只有文章标题,标题下方却没有摘要和图片,我看你的分享时都能显示,请问怎么做到的?

                                                                                                                            • 知更鸟
                                                                                                                              知更鸟

                                                                                                                              @ joker 我用的是百度标准的分享代码没作过改动….

                                                                                                                            • jhshn
                                                                                                                              jhshn 2

                                                                                                                              鸟哥,现在的分享按钮没有分享到微信的功能,怎么填加?

                                                                                                                                • 知更鸟
                                                                                                                                  知更鸟

                                                                                                                                  @ jhshn 嗯,百度的分享代码升级了,这两天有时间我修改一下

                                                                                                                                • jhshn
                                                                                                                                  jhshn 2

                                                                                                                                  鸟哥,我看你的主题已经加上新的分享按钮了有微信,如何实现的?

                                                                                                                                    • 知更鸟
                                                                                                                                      知更鸟

                                                                                                                                      @ jhshn http://zmingcx.com/hotnews-pro-plus-faq.html
                                                                                                                                      第18条

                                                                                                                                        • 爱美丽
                                                                                                                                          爱美丽 0

                                                                                                                                          @ 知更鸟 我安装这鸟哥的办法改了百度分享的新代码,结果百度分享跑网页底部去了http://w01.pw/怎么改回到侧边来呢?

                                                                                                                                      • 流年伴夏
                                                                                                                                        流年伴夏 0

                                                                                                                                        博主,你好,你最下面的 赞和打赏以及分享 功能是怎么实现的啊

                                                                                                                                      匿名

                                                                                                                                      发表评论

                                                                                                                                      匿名网友
                                                                                                                                      :?: :razz: :sad: :evil: :!: :smile: :oops: :grin: :eek: :shock: :???: :cool: :lol: :mad: :twisted: :roll: :wink: :idea: :arrow: :neutral: :cry: :mrgreen:

                                                                                                                                      拖动滑块以完成验证