Hexo+Fluid实现添加百度分享按钮

本文最后更新于:7 个月前

前言


很早以前,本科还是人人网盛行的时候,经常会看到分享至人人网之类的按钮,现在确实是不行了,但是分享这个功能还是很好的,博客搭建起来能够在谷歌搜索了,那么就寻思这开始分享吧。

百度分享


百度分享是一个提供网页地址收藏、分享及发送的WEB2.0按钮工具,网站的浏览者可以方便的分享到人人网、分享到开心网、分享到QQ空间、分享到新浪微博等一系列SNS站点。

以上描述引用自百度百科,但是2019年就有新闻说百度分享不能用了。好在前人折腾的时候把代码和功能都摸索了一遍,就照着来吧。

实现过程


首先在主题layout下的_partial目录里新建一个baidushare.ejs,没有此目录则新建一个。下边是我的配置,还可以参考网上别人的配置。

<div class="bdsharebuttonbox">
  <a href="#" class="bds_more" data-cmd="more"></a>
  <a href="#" class="bds_qzone" data-cmd="qzone" title="分享到QQ空间"></a>
  <a href="#" class="bds_tsina" data-cmd="tsina" title="分享到新浪微博"></a>
  <a href="#" class="bds_tqq" data-cmd="tqq" title="分享到腾讯微博"></a>
  <a href="#" class="bds_baidu" data-cmd="baidu" title="分享到百度"></a>
  <a href="#" class="bds_weixin" data-cmd="weixin" title="分享到微信"></a>
  <a href="#" class="bds_sqq" data-cmd="sqq" title="分享到QQ"></a>
  <a href="#" class="bds_tieba" data-cmd="tieba" title="分享到百度贴吧"></a>
  <a href="#" class="bds_douban" data-cmd="douban" title="分享到豆瓣"></a>
</div>
<script>
  window._bd_share_config = {
    "common": {
      "bdSnsKey": {},
      "bdText": "",
      "bdMini": "2",
      "bdMiniList": false,
      "bdPic": "",
      "bdStyle": "1",
      "bdSize": "24"
    },
    "share": {},
	"slide": {
		"type": "slide",
		"bdImg": "1",
		"bdPos": "right",
		"bdTop": "151.5"
	},
  };
  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)];
 </script>

接着在layout的post.ejs合适的地方插入:

<% if (theme.post.baidushare.enable) { %>
    <%- partial('_partial/baidushare') %>
<% } %>

最后在主题设置文件_config.yml里的post设置里加入:

baidushare: 
  enable: true

附图一张


share

是不是很简单?赶紧将此文章分享出去吧!!!

但是——

​ 由于HTTPS不被百度分享支持,所以如果你的站点是https协议的话,需要将第一个baidushare.ej里的static文件放到一个可以访问的地方,具体可以参照这篇文章Hexo添加分享功能

总结


搭建博客的时候总是希望把一切东西元素都加一遍,最后发现还是要写有意思的文章啊。或者转载也行~

还是要努力啊,技术教程,我来了。。

参考文章

[1] Hexo添加分享功能

[2] 百度分享js代码

[3] 百度分享官网挂了,献出自用的百度分享代码



本博客所有文章除特别声明外,均采用 CC BY-SA 4.0 协议 ,转载请注明出处!