如何在菜单导航 hugo 站点上添加 link

Question

如何将直接 link 添加到菜单中的导航项而不是对部分的引用？

在我的 config.toml 中，我添加了一个 link 但它首先将 baseurl 放在它前面：

[menu]

    [[menu.nav]]
    name = "Summary"
    URL = "services"
    weight = 2

    [[menu.nav]]
    name = "Contact"
    URL = "contact-us"
    weight = 3

    [[menu.nav]]
    name = "Methods"
    URL = "blog"
    weight = 4

    [[menu.nav]]
    name = "Français"
    url = "https://example.com/" #this is the link I want to add
    weight = 5

我找到了 this post，但不知道 html，所以我不确定在 layout/partials/navigation.html 文件中的何处添加更改。

我怀疑它在这个偏音范围内的某个地方。

                {{ if .IsHome }}
                <div class="collapse navbar-collapse" id="navbarSupportedContent">
                        <ul class="navbar-nav ml-auto navigation-menu">
                                <li class="nav-item"><a class="nav-link" data-scroll href="#body">{{ with $.Site.Params.home }}{{ . }}{{ end }}</a></li>
                                {{ range $.Site.Menus.nav }}
                                <li class="nav-item"><a class="nav-link" data-scroll href="#{{ .URL }}">{{ .Name }}</a></li>
                                {{ end }}
                        </ul>
                </div>
                {{ else }}
                <div class="collapse navbar-collapse" id="navbarSupportedContent">
                        <ul class="navbar-nav ml-auto navigation-menu">
                                <li class="nav-item"><a class="nav-link" data-scroll href="{{ $.Site.BaseURL }}#body">{{ with $.Site.Params.home }}{{ . }}{{ end }}</a></li>
                                {{ range $.Site.Menus.nav }}
                                <li class="nav-item"><a class="nav-link" data-scroll href="{{ $.Site.BaseURL }}#{{ .URL | absURL }}">{{ .Name }}</a></li>
                                {{ end }}
                        </ul>
                </div>
                {{ end }}

感谢您的帮助！

Answer 1

此主题无法很好地处理导航 URL。尝试替换

href="{{ $.Site.BaseURL }}#{{ .URL | absURL }}" 到 href="{{ .URL |relURL }}"。它应该适用于内部和外部 links

                {{ if .IsHome }}
                <div class="collapse navbar-collapse" id="navbarSupportedContent">
                        <ul class="navbar-nav ml-auto navigation-menu">
                                <li class="nav-item"><a class="nav-link" data-scroll href="#body">{{ with $.Site.Params.home }}{{ . }}{{ end }}</a></li>
                                {{ range $.Site.Menus.nav }}
                                <li class="nav-item"><a class="nav-link" data-scroll href="{{ .URL | relURL }}">{{ .Name }}</a></li>
                                {{ end }}
                        </ul>
                </div>
                {{ else }}
                <div class="collapse navbar-collapse" id="navbarSupportedContent">
                        <ul class="navbar-nav ml-auto navigation-menu">
                                <li class="nav-item"><a class="nav-link" data-scroll href="{{ $.Site.BaseURL }}#body">{{ with $.Site.Params.home }}{{ . }}{{ end }}</a></li>
                                {{ range $.Site.Menus.nav }}
                                <li class="nav-item"><a class="nav-link" data-scroll href="{{ .URL | relURL }}">{{ .Name }}</a></li>
                                {{ end }}
                        </ul>
                </div>
                {{ end }}

并在您的 config.yaml 中，在内部 link 前添加“/”。

baseurl = "/"

[menu]

    [[menu.nav]]
    name = "Summary"
    URL = "/services"
    weight = 2

    [[menu.nav]]
    name = "Contact"
    URL = "/contact-us"
    weight = 3

    [[menu.nav]]
    name = "Methods"
    URL = "/blog"
    weight = 4

    [[menu.nav]]
    name = "Français"
    url = "https://example.com/" #this is the link I want to add
    weight = 5

如何在菜单导航 hugo 站点上添加 link

How to add link on menu nav hugo site

yaml

hugo

blogdown