
自从About的Frequent Tags
一直不怎么起作用,一直准确显示不了tags
的博客文章,为此折腾了很长时间。以前标签链接总是定位到博客首页,现在总算是能够根据标签词搜索到相应文章。
1.开始准备
1.1在config
配置TAGS的URL逻辑映射
config.toml
配置的问题,在 config.toml
中,[taxonomies]
是用来定义逻辑名称到 URL 路径的映射:
[taxonomies]
tag = "tags"
给定 tag = "tags"
后,Hugo 会在生成的网站中以 /tags/标签名/
的形式来访问这些标签的文章。
1.2创建一个 layouts/taxonomy/tag.html
文件模板
在layouts/taxonomy/tag.html
中添加一个自定义tag.html
模板,具体是:
<div class="container">
<h1>{{ .Title }}</h1>
<ul>
{{ range .Pages }}
<li><a href="{{ .Permalink }}">{{ .Title }}</a></li>
{{ end }}
</ul>
</div>
在layouts/section/about.html
中,Frequent Tags
总是跳到首页的问题解决,具体代码是:
<div class="container">
<h2 class="subtitle is-size-4-mobile is-size-3-desktop">{{ .Title }}</h1>
<div class="content">
{{ .Content }}
</div>
<h2 class="subtitle is-size-5-mobile is-size-4-desktop">Frequent Tags</h2>
{{ range .Site.Taxonomies.tags.ByCount }}
<a href="/tags/{{ .Name | urlize }}"> {{ .Name }} ({{ .Count }}) </a>
{{end}}
</div>
当然,为了tag.html
美观化,可以通过添加类似{{ partial "template" . }}
的模板,来美化单调的tag.html
页面,我具体是引入{{ partial "header" . }}
和{{ partial "nav" . }}
来让页面适配博客主题页,然后tag.html
就成了这样:
{{ partial "header" . }}
{{ partial "nav" . }}
<div class="container">
<h1>{{ .Title }}</h1>
<ul>
{{ range .Pages }}
<li><a href="{{ .Permalink }}">{{ .Title }}</a></li>
{{ end }}
</ul>
</div>
当点击Frequent Tags
的标签词时,例如hugo tags
时,页面就会是这样了:
这样,就会显示和hugo相应的博客文章。
2.后续总结
之所以写这篇博文,是因为我折腾Frequent Tags
这个博客标签很久了,这要么不显示,要么Frequent Tags
就显示错误,总是链接到博客首页,一直失败。不过好在添加了[taxonomies]
和tag.html
文章总算是能够正确显示了,解决了博客一大bug。