CONTENT MANAGEMENT

Related content

Hugo 使用一組因素根據 Front Matter 參數來識別頁面的相關內容。這可以調整為所需的索引和參數集,或者讓 Hugo 使用預設的 相關內容配置

列出相關內容

要列出最多 5 頁相關頁面(它們共享相同的 datekeyword 參數),只需要在模板中包含類似下面的部分:

layouts/partials/related.html
{{ $related := .Site.RegularPages.Related . | first 5 }}
{{ with $related }}
<h3>另請參見</h3>
<ul>
 {{ range . }}
 <li><a href="{{ .RelPermalink }}">{{ .LinkTitle }}</a></li>
 {{ end }}
</ul>
{{ end }}

Related 方法接受一個參數,可以是 Page 或選項映射。選項映射包含以下選項:

indices
(slice) 要搜尋的索引。
document
(page) 要查找相關內容的頁面。在指定選項映射時為必填項。
namedSlices
(slice) 要搜尋的關鍵字,以 KeyValues 切片形式表示,使用 keyVals 函數。
fragments
(slice) 用於索引類型為「fragments」的特殊關鍵字列表。這將匹配文件的 fragment 標識符。

使用上述所有選項的虛構範例:

{{ $page := . }}
{{ $opts := dict
  "indices" (slice "tags" "keywords")
  "document" $page
  "namedSlices" (slice (keyVals "tags" "hugo" "rocks") (keyVals "date" $page.Date))
  "fragments" (slice "heading-1" "heading-2")
}}

索引相關內容中的標題

New in v0.111.0

Hugo 可以索引內容中的標題並利用此來查找相關內容。您可以通過在 related 配置中加入一個類型為 fragments 的索引來啟用此功能:

hugo.
     
related:
  includeNewer: true
  indices:
  - applyFilter: true
    name: fragmentrefs
    type: fragments
    weight: 80
  threshold: 20
  toLower: false
[related]
  includeNewer = true
  threshold = 20
  toLower = false
  [[related.indices]]
    applyFilter = true
    name = 'fragmentrefs'
    type = 'fragments'
    weight = 80
{
   "related": {
      "includeNewer": true,
      "indices": [
         {
            "applyFilter": true,
            "name": "fragmentrefs",
            "type": "fragments",
            "weight": 80
         }
      ],
      "threshold": 20,
      "toLower": false
   }
}
  • name 對應一個可選的 Front Matter 切片屬性,可以用來將頁面層級鏈接到 fragment/heading 層級。
  • 如果啟用了 applyFilter,則結果中每個頁面的 .HeadingsFiltered 會反映過濾後的標題。這對於顯示相關內容中的標題非常有用:
{{ $related := .Site.RegularPages.Related . | first 5 }}
{{ with $related }}
  <h2>另請參見</h2>
  <ul>
    {{ range $i, $p := . }}
      <li>
        <a href="{{ .RelPermalink }}">{{ .LinkTitle }}</a>
        {{ with .HeadingsFiltered }}
          <ul>
            {{ range . }}
              {{ $link := printf "%s#%s" $p.RelPermalink .ID | safeURL }}
              <li>
                <a href="{{ $link }}">{{ .Title }}</a>
              </li>
            {{ end }}
          </ul>
        {{ end }}
      </li>
    {{ end }}
  </ul>
{{ end }}

配置相關內容

Hugo 提供了合理的預設配置,但您可以根據需要在全域或語言層級進行微調。

預設配置

如果項目中未設置任何 related 配置,Hugo 的相關內容方法將使用以下內容。

hugo.
     
related:
  includeNewer: false
  indices:
  - applyFilter: false
    cardinalityThreshold: 0
    name: keywords
    pattern: ""
    toLower: false
    type: basic
    weight: 100
  - applyFilter: false
    cardinalityThreshold: 0
    name: date
    pattern: ""
    toLower: false
    type: basic
    weight: 10
  - applyFilter: false
    cardinalityThreshold: 0
    name: tags
    pattern: ""
    toLower: false
    type: basic
    weight: 80
  threshold: 80
  toLower: false
[related]
  includeNewer = false
  threshold = 80
  toLower = false
  [[related.indices]]
    applyFilter = false
    cardinalityThreshold = 0
    name = 'keywords'
    pattern = ''
    toLower = false
    type = 'basic'
    weight = 100
  [[related.indices]]
    applyFilter = false
    cardinalityThreshold = 0
    name = 'date'
    pattern = ''
    toLower = false
    type = 'basic'
    weight = 10
  [[related.indices]]
    applyFilter = false
    cardinalityThreshold = 0
    name = 'tags'
    pattern = ''
    toLower = false
    type = 'basic'
    weight = 80
{
   "related": {
      "includeNewer": false,
      "indices": [
         {
            "applyFilter": false,
            "cardinalityThreshold": 0,
            "name": "keywords",
            "pattern": "",
            "toLower": false,
            "type": "basic",
            "weight": 100
         },
         {
            "applyFilter": false,
            "cardinalityThreshold": 0,
            "name": "date",
            "pattern": "",
            "toLower": false,
            "type": "basic",
            "weight": 10
         },
         {
            "applyFilter": false,
            "cardinalityThreshold": 0,
            "name": "tags",
            "pattern": "",
            "toLower": false,
            "type": "basic",
            "weight": 80
         }
      ],
      "threshold": 80,
      "toLower": false
   }
}

自定義配置應使用相同的語法設置。

頂層配置選項

threshold
(int) 介於 0-100 之間的數值。數值越低,結果越多,但可能相關性較差。
includeNewer
(bool) 設為 true 時,會將 比當前頁面更新的頁面 包括在相關內容中。這會使較舊的文章隨著新相關內容的加入而變動。
toLower
(bool) 設為 true 時,會將索引和查詢中的關鍵字轉為小寫。這可能會提高準確性,但會略微影響效能。注意,這也可以為每個索引單獨設置。

每個索引的配置選項

name
(string) 索引名稱。這個值直接對應到頁面參數。Hugo 支援字串值(例如示例中的 author)和列表(例如 tagskeywords 等)以及時間和日期物件。
type New in v0.111.0
(string) 可選值為 basic(預設)或 fragments
applyFilter New in v0.111.0
(string) 對搜尋結果應用特定類型的過濾器。這目前僅對 fragments 類型有效。
weight
(int) 整數權重,表示此參數相對於其他參數的重要性。可以設為 0,這會使這個索引無效,甚至可以設為負數。根據不同的值進行測試,看看最適合您的內容。
cardinalityThreshold New in v0.111.0
(int) 介於 1 到 100 之間的百分比。超過此百分比的所有關鍵字將被移除。例如,將其設為 60,則會移除在 60% 以上文檔中出現的所有關鍵字。如果設為 0,則不會移除任何關鍵字。預設為 0
pattern
(string) 這目前僅對日期有效。在列出相關內容時,我們可能希望列出時間接近的內容。為日期索引設置 “2006”(日期索引的預設值)將增加同一年內發佈的頁面的權重。對於較繁忙的部落格,“200601”(年份和月份)可能是更好的預設。
toLower
(bool) 參見上方。

效能考量

快速是 Hugo 的中名,如果這項功能不夠快速,我們就不會發佈它。

這項功能已經在後台待處理並且被很多人要求了很久。開發從這條 Twitter 連結中獲得了最近的啟發:

Scott S. Lowe 移除了使用 intersect 模板函數基於標籤構建的「相關內容」區塊,構建時間從 30 秒降至不到 2 秒,這對他擁有 1700 篇內容頁面的部落格來說非常重要。

他現在應該能夠在不放棄快速即時重載的情況下添加改進版本的「相關內容」區塊。但值得注意的是:

  • 如果您不使用任何 Related 方法,則不會使用「相關內容」功能,效能將與之前相同。
  • 呼叫 .RegularPages.Related 等將創建一個反向索引,也稱為發佈列表,這將被重複使用於同一頁面集合的查詢中。這樣做加上例如呼叫 .Pages.Related,會如預期工作,但會創建一個額外的反向索引。這仍然非常快速,但對於較大的網站來說,值得注意。