1. 程式人生 > >hexo yilia主題增加分享以及訪問統計

hexo yilia主題增加分享以及訪問統計

在使用yilia主題建立好自己的部落格之後,你還想分享到其他平臺,比如微信,還想要統計站點以及文章的訪問情況。網際網路提供了很多第三方分享和訪問統計外掛,藉助第三方外掛很容易實現這些功能,本文使用Mob提供的第三方分享外掛,使用不蒜子統計站點和文章訪問量。以下是詳細步驟。

相關網址

Mob分享

  • 註冊一個賬號
  • 進入後臺,使用shareSDK,會申請到一個App Key
    mob
  • 在hexo主題目錄下_config.yml增加
sharesdk: true #是否開啟分享
shareSDKappkey: 上一步申請到的app key
  • 在layout_partial\share目錄下增加一個share.ejs:
<!--MOB SHARE BEGIN-->
    <div class="-mob-share-ui-button -mob-share-open">分享</div>
    <div class="-mob-share-ui" style="display: none">
        <ul class="-mob-share-list">
            <li class="-mob-share-weibo"><p>新浪微博</p></li>
            <li
class="-mob-share-tencentweibo">
<p>騰訊微博</p></li> <li class="-mob-share-qzone"><p>QQ空間</p></li> <li class="-mob-share-qq"><p>QQ好友</p></li> <li class="-mob-share-weixin"><p>微信</p></li
>
<li class="-mob-share-twitter"><p>Twitter</p></li> <li class="-mob-share-youdao"><p>有道雲筆記</p></li> <li class="-mob-share-mingdao"><p>明道</p></li> <li class="-mob-share-linkedin"><p>LinkedIn</p></li> </ul> <div class="-mob-share-close">取消</div> </div> <div class="-mob-share-ui-bg"></div> <script id="-mob-share" src="http://f1.webshare.mob.com/code/mob-share.js?appkey=
{{ theme.shareSDKappkey }}"></script> <!--MOB SHARE END-->
  • 在layout_partial\article.ejs檔案增加分享的程式碼:
<% if (!index && theme.sharesdk){ %>
        <%- partial('_partial/share/sharesdk.swig') %>
<% } %>

不蒜子訪問量統計

layout_partial\header.ejs頁面中引入busuanzi.js:

<script async src="//dn-lbstatics.qbox.me/busuanzi/2.3/busuanzi.pure.mini.js"></script>

顯示站點總訪問量

在layout_partial\header.ejs檔案<%- partial(‘post/tag’) %>下面增加:

<span id="busuanzi_container_site_pv">
    本站總訪問量<span id="busuanzi_value_site_pv"></span></span>

顯示單頁面訪問量

在layout_partial\article.ejs檔案

標籤後面增加:
<span id="busuanzi_container_page_pv">
  本文總閱讀量<span id="busuanzi_value_page_pv"></span></span>

效果