How to customize the title in the head

support
#1

I create a folder called thedemo in folder content and have some markdown files in it, when I visit

http://localhost:1313/thedemo

The page’s title in head is Thedemos like picture

I want to change it to another text, such as Study, and my solution is

<head>
<title>{{ if eq .Title "Thedemos" }} Study {{ else }} {{ .Title }} {{ end }}</title>
</head>

Are there other better solutions? Thank you.

#2

One way to solve this is with custom page params. For example:

Frontmatter

---
title: "Thedemos"
date: 2021-04-22T09:22:06-05:00
custom_title_enabled: true
custom_title_value: Study
---

Template

<title>
{{ if eq .Params.custom_title_enabled true }}
  {{ .Params.custom_title_value }}
{{ else }}
  {{ .Title }}
{{ end }}
</title>

Usage

  • If custom_title_enabled is true, the title is Study
  • If custom_title_enabled is false, the title is Thedemos
#3

You can also use the fact that params with values is “truthy” so you can do:

<title>
{{ with .Params.custom_title }}
  {{ . }}
{{ else }}
  {{ .Title }}
{{ end }}
</title>

It’s also not uncommon to use blocks for this:

2 Likes
#4

@zwbetz @bep

There may be a bit of misunderstanding between us, thedemo is not a page name, it is a folder name, it is located under the content folder.

Any folder under the content folder, if there is a markdown file in it. When you visit its path, such as http://localhost:1313/thedemo, its title will be automatically added in plural form, like it is a group.

I mean how to customize the group title. My solution can meet the requirements, but I think there should be a better solution.

Thank you.

#5

You can still give a content file to a parent folder. For example, run:

hugo new thedemo/_index.md

Then edit this file as you wish.

#6

If your content looks like this:

content/
└── post
    ├── post-1.md
    ├── post-2.md
    └── post-3.md

Hugo will use the directory name (post) as the title when you visit http://localhost:1313/post/, but by default it will be capitalized and pluralized to Posts.

If you wish to disable the plurarization, place this in your site configuration file (config.toml):

pluralizeListTitles = false

If you wish to use a different title, create a section page:

hugo new post/_index.md

And then edit the front matter:

---
title: "Something Different"
date: 2021-04-22T18:26:09-07:00
draft: true
---
#7

Because in config.toml I set

[permalinks]
   post = "/:slug"

All post and folder are http://localhost:1313/fdsaf, how can I know which one is the folder and which one is the post? Thank you.

#8

We would have to see your specific content tree to say for sure.

#9

@zwbetz Sorry for my mistake.

content/
├── thedemo
 |  ├── study-1.md
 |  └── study-2.md
├── golang
 |  ├── gos-1.md
 |  └── gos-2.md
└── post
    ├── post-1.md
    ├── post-2.md
    └── post-3.md

Code of head.html in my theme

<head>
<title>{{ if eq .Title "Thedemos" }} Study {{ else if eq .Title "Posts" }} SomePosts {{ else if eq .Title "
Golangs" }} Golang {{ else }} {{ .Title }} {{ end }}</title>
</head>

Code of list.html

{{ define "main" }}

{{ if eq .Title "Thedemos" }}

 //the demo list displayed style

{{ else if eq .Title "Posts" }}

//the post list displayed style

{{ else if eq .Title "Golangs" }}

//the golang list displayed style

{{ else }}

//the default list displayed style

{{ end }}

{{ end }}

I think there are too many judgment statements like if else, I think my solution is not good, I am looking for a better solution, thank you.

#10

I see. So, I prefer to have my logic in template files, and my data in content files. If you would like the same, see below.

Your template logic could be reduced down to merely:

<title>{{ .Title }}</title>

Then in each of your folders, or branch bundles as Hugo calls them, you could have a _index.md file with the desired title.

For example, in content/thedemo/_index.md you would have this frontmatter:

---
title: Study
---
#11

That’s cool, better than mine. Thank you.
But, is there any better solution in the template list.html?

#12

If you want to specify the title in a content file, then yes. See above.

#13

@zwbetz

Not the title, your solution for the title is great.

Here I mean the content of list.html

{{ define "main" }}

{{ if eq .Title "Thedemos" }}

 //the demo list displayed style

{{ else if eq .Title "Posts" }}

//the post list displayed style

{{ else if eq .Title "Golangs" }}

//the golang list displayed style

{{ else }}

//the default list displayed style

{{ end }}

{{ end }}

Thank you.

#14

This topic was automatically closed 2 days after the last reply. New replies are no longer allowed.