如何在菜单导航网站上添加链接

时间:2019-10-21 20:24:40

标签: yaml hugo blogdown

如何在菜单中与对节的引用相对的地方将直接链接添加到导航项?

在config.toml中,我添加了一个链接,但它首先将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 }}

感谢您的帮助!

1 个答案:

答案 0 :(得分:1)

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

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

                {{ 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中,在内部链接之前添加“ /”。

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