IntelliJIDEA live templates for Hugo title and slug

Written by Lyoneel on in HUGO, IntelliJ Platform
 3 mins

IntelliJIDEA live templates for Hugo title and slug

I was writing and a question comes to my mind: Can I automate the title and slug using live templates? TL;DR; YES!.

I’m working with Hugo specifically for content and improvements for this blog using Jetbrains IDEs, and I’m using page bundles

File structure

For this example, I will use the following file structure:

📁 contents
  📁  posts
    📁 2023-01-15-quick-description-of-this-article
       index.en.md

Creating our live template

Open live templates dialog (Settings > Editor > Live Templates)

live template creation

Create a new group (this is optional) called Hugo, for that you have to click in + in the top right. Then create a new live template inside a Hugo group using the + again. You must define a name (Abbreviation), this name will be used to call this template inside the editor.

Define template content

I define basic template contents for this demonstration:

---
title: "$TITLE$"
slug: "$SLUG$"
---

This template contents should be added to “Template text” text area. And then click on the button “Edit variables.”

edit variables dialog

In this dialog, you will find your two variables. The Next step is to define expressions for those variables.

Variable expressions

Live templates have a considerable number of builtin functions, there is not such a thing as “base-path” or “folder,” You have to create your way to get it using regex.

The code for those variables is:

variable: title
expression: 
regularExpression(regularExpression(regularExpression( filePath(), ".*\\d{4}-\\d{2}-\\d{2}-", ""), "\/index.*", ""), "-", " ")

variable: slug
expression: 
regularExpression(regularExpression( filePath(), ".*\\d{4}-\\d{2}-\\d{2}-", ""), "\/index.*", ""))

Copy and paste the expression (I didn’t implement the copy button, sorry, use triple click instead), and you are ready to go. Apply changes, go to the editor write your abbreviation defined, and you should get suggested values for title and slug right away.

What the heck those regex calls do?

Glad you asked, title has 3 regex calls, let’s break it down:

First call

First call uses filePath() builtin function to get the absolute path, and removes everything that is before the date and the date itself.

regularExpression( filePath(), ".*\\d{4}-\\d{2}-\\d{2}-", "")

  • \d looks for numbers,
  • {4} and {2} specify expected quantity of those numbers.
  • the additional \\ are there because needed to escape the first slash.
  • .* this looks for everything before the date.

Using the folder structure example, your input will be:

[...]/contents/posts/2023-01-15-quick-description-of-this-article/index.en.md

And your output should be:

quick-description-of-this-article/index.en.md

Second call

The second call uses the returning value from the first call, and remove /index

regularExpression( prevCallInput , "\/index.*", "")

Third call

And the third, replace hyphen with spaces.

regularExpression( "-", " ")

Final thoughts

I hope this will make your journey with Hugo easier, and make a good use of this powerful tool that intellij provides. I know that many people run away from regex, but it is not that hard, you can do better!.


Thanks for reading!

Namaste.