计划
- 添加widget，展示当前博文的tags
右侧边栏的tag-cloud和categories不能处理hidden博文
tag-cloud识别hidden博文
把layouts/partials/widget/tag-cloud.html的渲染tag-cloud的逻辑进行如下修改：
<div class="tagCloud-tags">
- {{ range first $limit $context.Site.Taxonomies.tags.ByCount }}
- <a href="{{ .Page.RelPermalink }}" class="font_size_{{ .Count }}">
- {{ .Page.Title }}
- </a>
+ {{- $cateTaxonomy := $context.Site.GetPage "tags" -}}
+ {{- $cateTerms := $cateTaxonomy.Pages -}}
+ {{ range first $limit $cateTerms }}
+ {{- $pages := .Pages -}}
+ {{- $filteredPages := where $pages ".Params.hidden" "!=" true -}}
+ {{ if $filteredPages }}
+ <a href="{{ .RelPermalink }}" class="font_size_{{ len $filteredPages}}">
+ {{ .Title }}
+ </a>
+ {{ end }}
+ {{ end }}
</div>
如另一篇博文中的方法，从$context.Site中获取所有tags然后过滤掉hidden == true的博文后，判断$filteredPages中是否还有元素，如果有则渲染这个tag。
添加一种展示当前博文tags的Widget
添加模板文件
在layouts/partials/widget文件夹下新建文件cur-tags.html，添加如下内容：
{{- $context := .Context -}}
{{ if .Context.Page.Params.Tags }}
<section class="widget curTags">
<div class="widget-icon">
{{ partial "helper/icon" "tag" }}
</div>
<h2 class="widget-title section-title">{{ T "widget.curTags.title" }}</h2>
<div class="curTags-tags">
{{ range (.Context.Page.GetTerms "tags") }}
<a href="{{ .RelPermalink }}">
{{ .LinkTitle }}
</a>
{{ end }}
</div>
</section>
{{ end }}
首先判断当前文章是否有tag，然后根据其他widget的模板修改成current tags，使用GetTerms方法获得当前文章的tags，作为<a>标签的参数。
注意<h2>标签中的T函数，用于在修改页面语言时批量替换文本，我们需要在对应文件中添加widget.curTags.title命名空间的值。
添加i18n替换文本
在i18n/en.yaml和i18n/zh-cn.yaml中添加相关内容，在widget域下添加内容：
widget:
+ curTags:
+ title:
+ other: Tags of current blog
添加scss样式表
在assets/scss/partials/widgets.scss中添加curTags的样式。
/* Current tags widget */
.curTags {
.curTags-tags {
display: flex;
flex-wrap: wrap;
gap: 10px;
a {
background: var(--card-background);
box-shadow: var(--shadow-l1);
border-radius: var(--tag-border-radius);
padding: 8px 20px;
color: var(--card-text-color-main);
font-size: 1.4rem;
transition: box-shadow 0.3s ease;
&:hover {
box-shadow: var(--shadow-l2);
}
}
}
}
自此，current tags控件的开发已经成功，在stack/config.yaml中添加配置项即可。
params:
widgets:
page:
+ - type: cur-tags