About page still eluding me

support
1

I’m trying to link on my index.html page an about page. my githug repo shows the code I’m using which shows the .Title but does not link it to the file like I would like it to. my site is deployed and it shows the end result which is fine if the about title would link to the about page. COuld y’all point me in the right direction for the proper doc to read. I’d like to figure this one out myself but can’t seem to find the right doc to help me.

2

One way is to hardcode the link (which is common practice for navigation menus)

<a href="/about/">About</a>

Another way, using your current code, is to use .RelPermalink

{{ $about := .Site.GetPage "/about" }}
<a href="{{ $about.RelPermalink }}">{{ $about.Title }}</a>
3

I did actually try the hard code way but it still would give me a 404 error. I’ve not tried the other style yet. Do you use both lines of code just like you show or just the anchor tag part? I read a lot of different docs that uses something similar, but it always seemed like it was meant for an md file rather than an html file. Just trying to understand how all this works. Thanks again

4

Your “about” page works for me

https://elastic-stonebraker-8edbc1.netlify.com/about/

5

Also, update your baseURL in your config.toml to your Netlify URL

6

It is there but it’s not a link which is what I wanted. I assumed you typed it in the http at the top right? I’ll look at it some more tonight after work. Thanks

7

Yer relevant code is at:

<h2>{{with .Site.GetPage "/about/index.md"}}{{.Title}}{{end}}</h2>

Let’s remove the h2 for now, makes it easier for me to fix.

So, what you are saying there is: if a file exists at /about/index.md, show it’s title. So you can take a queue from the example above, you can do:

{{with .Site.GetPage "/about/index.md"}}<a href="{{ .RelPermalink }}">{{.Title}}</a>{{end}}

That generates:

<a href="/about/">About</a>
8

I’ll turn this into a larger example someday, but I wanted to point out you might want a menu, and Hugo delivers n a major way.

For instance!

If you put this in your index.html, where you are trying to put your link:

{{ range .Site.Menus.main }}
<a href="{{ .URL }}">{{ .Title }}</a>
{{ end }}

You can put menu: main (because I am ranging over a menu called “main” above) in any page’s front matter, and it will show up there. Even your /about/index.md. Try it!

Of course you’ll want to make that a proper menu:

Ganbatte! :slight_smile:

1 Like
9

It worked as advertised! Thanks for explanation that is what I needed.

10

I will be coming back to this soon. This was going to be my next question. I just need more time to read through it. Again Thanks.