- 默認的相關內容是keywords和時間相關,時間晚的頁面會顯示時間早的關聯頁面,時間早的頁面不會顯示時間晚的頁面,也就是有時間先后
1. 創建themes/hyde/layouts/partial/related.html
```
{{ $related := .Site.RegularPages.Related . | first 6 }}
{{ with $related }}
<div class="related-content">
<h2>Related content</h2>
<ul class="article-gallery">
{{ range . }}
<span><a href="{{ .Permalink }}">{{ .Title }}</a> <time class="pull-right post-list" datetime="{{ .Date.Format "2006-01-02T15:04:05Z0700" }}">{{ .Date.Format "Mon, Jan 2, 2006" }}</time></span>
{{ end }}
</ul>
{{ else }}
<ul>. Nothing related</ul>
</div>
{{ end }}
```
2. themes/hyde/layouts/_default/single.html
```
{{ define "main" -}}
<div class="post">
<h1>{{ .Title }}</h1>
<time datetime={{ .Date.Format "2006-01-02T15:04:05Z0700" }} class="post-date">{{ .Date.Format "Mon, Jan 2, 2006" }}</time>
{{ .Content }}
</div>
{{ if .Site.DisqusShortname -}}
<h2>Comments</h2>
{{ template "_internal/disqus.html" . }}
{{- end }}
{{ partial "related.html" . }}
{{- end }}
```
3. 新的post里面一定要包含keywords,默認對應keywords
```
---
title: "Second"
date: 2019-11-01T16:14:58+08:00
draft: false
keywords: ["peter"]
---
```
4. 如果你的關鍵字name不是keywords比如是tags,那么需要調整related.html
```
{{ $related := .Site.RegularPages.RelatedIndices . "tags" | first 6 }}
{{ with $related }}
<div class="related-content">
<h2>Related content</h2>
<ul class="article-gallery">
{{ range . }}
<span><a href="{{ .Permalink }}">{{ .Title }}</a> <time class="pull-right post-list" datetime="{{ .Date.Format "2006-01-02T15:04:05Z0700" }}">{{ .Date.Format "Mon, Jan 2, 2006" }}</time></span>
{{ end }}
</ul>
{{ else }}
<ul>. Nothing related</ul>
</div>
{{ end }}
```
- 【入門】1:Hugo介紹
- 【入門】2:Hugo網站和主題演示
- 【入門】3:Hugo跟Wordpress和Hexo對比
- 【入門】4:20分鐘快速搭建Hugo網站
- 【入門】5:免費網站托管到Gitpages
- 【入門】6:圖標icon/robot.txt/404頁面創建和設置
- 【入門】7:網站地圖sitemap
- 【進階】8:自定義菜單
- 【進階】9:自定義Tag/category
- 【進階】10:頁面Meta keyword
- 【進階】12:創建頁面摘要
- 【進階】11:創建列表【進行中...】
- 【進階】13:創建分頁
- 【進階】14:創建統計
- 【進階】15:創建rss
- 【高級】16:創建頁面目錄
- 【高級】17:創建站內搜索
- 【高級】18:創建多語言支持
- 【高級】19:顯示相關內容
- 【高級】20:顯示當前頁面所有Tag
- 【高級】21:創建社交聯系方式
- 【高級】22:創建社交分享
- 【高級】23:創建評論gitalk
- 【高級】24:自動化部署-netlify
- 【高級】25:自動化部署-Github actions