TOC

缘由

在看别人博客时经常在文章标题下面见到有共xx字,阅读约xx分钟的字眼，这个功能在hugo中本身就已经自带了，开启这个功能即可。

修改博客页面

页面位于对应主题目录下的：layouts/_default/single.html,搜索subtitle可以找到以下类似的代码块:

<h2 class="subheading">{{ .Params.subtitle }}</h2>
                    <span  class="meta">Posted by {{ if .Params.author }}{{ .Params.author }}{{ else }}{{ .Site.Title }}{{ end }} on {{ .Date.Format "Monday, January 2, 2006" }}
                        {{ if .Site.Params.page_view_conter }}
                        {{ partial "page_view_counter.html" . }}
                        {{ end }}
                    </span>

修改后是一下的样子，其实就是引入两个变量:
1. WordCount 文章字数
2. ReadingTime 阅读时间

                    <h2 class="subheading">{{ .Params.subtitle }}</h2>
                    <span  class="meta">Posted by {{ if .Params.author }}{{ .Params.author }}{{ else }}{{ .Site.Title }}{{ end }} on {{ .Date.Format "Monday, January 2, 2006" }}
                        {{ if .Site.Params.page_view_conter }}
                        <span id="busuanzi_container_page_pv">|<span id="busuanzi_value_page_pv"></span><span>
                            {{ partial "page_view_counter.html" .  }}
                            阅读 </span></span>|<span class="post-date">共{{ .WordCount  }}字</span>，阅读约<span class="more-meta"> {{ .ReadingTime  }} 分钟</span>
                        {{ end }}
                    </span>

修改配置文件

在修改了上述内容后主题已经支持字数统计和阅读时间的功能，下面需要在博客的配置文件当中启动这个功能。

找到config.toml文件中的page_view_conter，配置为true即可。

page_view_conter=true

在重新打开任意一篇 Blog 后发现已经可以看到这个功能的展示了。

随意聊聊

在我看来一个博客除了字数统计和阅读时间这样一个功能之外呢，阅读次数和文章搜索还是很有必要的，这也是我接下来会给我的博客添加的功能。

最后

现在,你的静态博客拥有了阅读x分钟的功能,再多一个自动化优化博客中的图片不过分吧?

• 为你的博客添加imgbot优化图片

再多一个自动化构建 algolia 索引不过分吧?

• 自动构建algolia索引

再多一个评论功能不过分吧?

• 给hugo博客添加评论功能

微信公众号

扫描下面的二维码关注我们的微信公众号,第一时间查看最新内容。同时也可以关注我的Github,看看我都在了解什么技术,在页面底部可以找到我的Github。

---