前往小程序,Get更优阅读体验!
立即前往
首页
学习
活动
专区
工具
TVP
发布
社区首页 >专栏 >给hugo博客添加字数统计和阅读需要xx分钟的功能

给hugo博客添加字数统计和阅读需要xx分钟的功能

原创
作者头像
用户2672162
修改2021-02-16 20:01:56
1K0
修改2021-02-16 20:01:56
举报
文章被收录于专栏:四颗咖啡豆

缘由

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

https://res.cloudinary.com/lyp/image/upload/v1613460274/hugo/blog.github.io/blogfeature/blog1.png
https://res.cloudinary.com/lyp/image/upload/v1613460274/hugo/blog.github.io/blogfeature/blog1.png

修改博客页面

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

代码语言:javascript
复制
<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 阅读时间
代码语言:javascript
复制
                    <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后发现已经可以看到这个功能的展示了。

https://res.cloudinary.com/lyp/image/upload/v1613463423/hugo/blog.github.io/blogfeature/blog2.png
https://res.cloudinary.com/lyp/image/upload/v1613463423/hugo/blog.github.io/blogfeature/blog2.png

随意聊聊

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

始发于 四颗咖啡豆 发布! 关注公众号->[四颗咖啡豆] 获取最新内容

原创声明:本文系作者授权腾讯云开发者社区发表,未经许可,不得转载。

如有侵权,请联系 cloudcommunity@tencent.com 删除。

原创声明:本文系作者授权腾讯云开发者社区发表,未经许可,不得转载。

如有侵权,请联系 cloudcommunity@tencent.com 删除。

评论
登录后参与评论
0 条评论
热度
最新
推荐阅读
目录
  • 缘由
  • 修改博客页面
  • 修改配置文件
  • 随意聊聊
领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档