Custom slug encoding rules for tags, titles, taxonomies

I went through many messages about special characters in tags and I didn’t find how to solve my issue.

I have this tag C# that needed to be translated to csharp in url.

Is there a hook or a way to customize / extend the way hugo creates slugs ?

In my case I would like to add an extra rule that would do replace . "#" "sharp" before Hugo creates slugs and pages

Everything in content/TAXONOMYNAME/TERM/index.md works as what you want. Use title: C# and slug: csharp. If your taxonomy is tags, then use content/tags/csharp/index.md. The tag in the resulting posts frontmatter has to be csharp (like the file name), but it will show what you define in title.

Expect it to fail if you have specific instructions in your layout files about how to show tags. In case of emergency post your layout :slight_smile:

1 Like

Thanks, it almost works.

There is one last problem now :

In my blog template I have this code to display tags :

{{ if .Params.tags }}
    {{ range .Params.tags }}
        {{ partial "components/tag.html" . }}
    {{ end }}
{{ end }}

and tag.html has this code

<a class="bg-gray-100 rounded-full px-3 py-1 text-gray-darkest" href="{{ "/tags/" | relLangURL }}{{ . | urlize }}">{{ . }}</a>

I have no access to the Title property for the display it gives me this error :

<.Title>: can’t evaluate field Title in type string

How can I use the Title property of the tag for the display ?

This is a simpler approach:
https://gohugo.io/templates/taxonomy-templates/#example-list-tags-in-a-single-page-template

Thanks for your answers, but I can’t get it to work.

I can’t find a way to have a tag title C# and slug csharp

Can you provide me a working example, I’m probably missing something.

Thanks

In your frontmatter (format depends on if it’s toml/yaml/json):

tags:
- csharp

In content/tags/csharp/index.md as part of the frontmatter

title: "C#"
1 Like

Thanks @davidsneighbour for taking time to reply, I’ve done that and there is no way to have C# displayed

In content/tags/csharp/index.md

---
title: "C#"
---

In the template for a blog post

{{ range (.GetTerms "tags") }}
    {{ partial "components/tag.html" . }}
{{ end }}

In the component/tag.html

<a class="bg-gray-100 rounded-full px-3 py-1 text-gray-darkest" href="{{ replace  .RelPermalink "#" "%23" }}">{{ .Title }}</a>

{{ .Title }} or {{ . }} returns csharp

I have no idea what am I doing wrong.

One more time…

content/post/test.md

+++
title = "Test"
date = 2021-01-01T00:00:00-00:00
draft = false
tags = ["csharp"]
+++

content/tags/csharp/_index.md

+++
title = "C#"
date = 2021-06-23T08:03:58-07:00
draft = false
+++

layouts/_default/single.html

{{ define "main" }}
  <h1>{{ .Title }}</h1>
  <p>Tags:</p>
  {{ range (.GetTerms "tags") }}
    <a href="{{ .Permalink }}">{{ .LinkTitle }}</a>
  {{ end }}
  {{ .Content }}
{{ end }}

@juchom it’s probably best if you provide us with a public repository of what you are trying to accomplish. It’s very clear that we all miss something in your overall-setup.

The problem was here, the file I used was index.md and not _index.md

Thanks a lot for the help !

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