breadcrumbs - 如何为 Hugo 创建工作面包屑？

令人难以置信的是，使用 Hugo 找到关于稍微更高级的技术的可靠信息是多么困难。

经过一段时间的搜索，我发现 this article 有一个非常好的方法来为 Hugo 实现面包屑。

我对其进行了一些修改，以免在最后一条路径中添加不必要的链接，并利用 i18n 将 URL 段转换为更易于阅读的内容。我还做了一个小的解决方法来删除一些与翻译条目不匹配的不需要的痕迹:

{{- $url := replace .Permalink ( printf "%s" ( "/" | absLangURL ) ) "" -}}
{{- $url := replace .Permalink ( printf "%s" ( "/" | absLangURL ) ) "" -}}
{{- $.Scratch.Add "path" ( "/" | absLangURL ) -}}

{{- $.Scratch.Add "breadcrumb" (slice (dict "url" ( "/" | absLangURL ) "name" "home" "position" 1 )) -}}
{{- range $index, $element := split $url "/" -}}
  {{- $.Scratch.Add "path" $element -}}
  {{- $.Scratch.Add "path" "/" -}}
  {{- if ne $element "" -}}
    {{- $.Scratch.Add "breadcrumb" (slice (dict "url" ($.Scratch.Get "path") "name" . "position" (add $index 2))) -}}
  {{- end -}}
{{- end -}}

<script type="application/ld+json">
{
  "@context": "http://schema.org",
  "@type": "BreadcrumbList",
  "itemListElement": [{{ range $.Scratch.Get "breadcrumb" }}{{ if ne .position 1 }},{{ end }}{
        "@type": "ListItem",
        "position": {{ .position }},
        "item": {
          "@id": "{{ .url }}",
          "name": "{{ .name }}"
        }
    }{{ end }}]
}
</script>

<nav class="breadcrumb">
  {{- $length := len ($.Scratch.Get "breadcrumb") -}}

  {{- range $index, $.Scratch.Get "breadcrumb" -}}

    <!--
    Assigning a constant as default value for i18n function
    if it doesn't match any entry
    Then check if current Breadcrumb item matches this constant,
    which means that part shouldn't be one of Breadcrumb's trail
    -->
    {{- $i18n := i18n ( print "breadcrumbs-" .name ) | default "__INTERNAL__" -}}

    {{- if not ( eq ($i18n) "__INTERNAL__" ) -}}

      {{ if eq ( (int .position) ) $length }}
  <span class="breadcrumb-item active">{{ $i18n }}</span>
      {{- else -}}
  <a class="breadcrumb-item" href="{{ .url }}" >{{ $i18n }}</a>
      {{- end -}}

    {{- end -}}

  {{ end }}
</nav>

它工作得非常好，除了据我所知，在浏览分页链接时，一切都开始复制 N 次，只要分页页面增加(即第 2 页的两倍，第 3 页的三次，依此类推)。

我搜索了更多，找到了没有重复的a similar implementation……但是链接都乱了，每个路径的URL都是所有路径o.O的所有链接的串联

我尽量避免在 Hugo 的“论坛”上提问，因为那里给出的答案大多难以理解、不完整或带有“伪伪代码”。

有谁知道如何进行这项工作并且可以帮我一把？

最佳答案

从 Hugo documentation 和建立在 Lars's answer 上:

在你的 Hugo 项目或主题

的文件夹 breadcrumbs.html 中创建一个名为 layouts/partials 的文件

<ol  class="nav navbar-nav">
    {{ template "breadcrumbnav" (dict "p1" . "p2" .) }}
</ol>
{{ define "breadcrumbnav" }}
{{ if .p1.Parent }}
{{ template "breadcrumbnav" (dict "p1" .p1.Parent "p2" .p2 )  }}
{{ else if not .p1.IsHome }}
{{ template "breadcrumbnav" (dict "p1" .p1.Site.Home "p2" .p2 )  }}
{{ end }}
<li{{ if eq .p1 .p2 }} class="active"{{ end }}>
    <a href="{{ .p1.Permalink }}">{{ .p1.Title }}</a>
</li>
{{ end }}

在需要的地方包含 breadcrumbs.html:

{{ partial "breadcrumbs.html" . }}

这会生成所有有效的链接(包括部分)。

关于breadcrumbs - 如何为 Hugo 创建工作面包屑？，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/45943871/