Extends parameter for configuration and themes

feature
1

Hey there,

Recently I have faced the challenge of a larger multi-site project in our company to be realized with Hugo. There we thought about a feature we have missed in Hugo called extends. Similar to other programming languages extends should extend another configuration/theme/whatever with the current set to reduce redundancies and keep the source more maintainable.

To make it more clear what I am talking about I try to make some example drafts::

root/config.toml

baseurl = "https://example.com/"
languageCode = "en-us"
title = "Project Default"
theme = "base-theme"
enableRobotsTXT = true

root/site_a/config.toml

extends = "../config.toml"
baseurl = "https://site-a.example"
title = "Site A's Title"

would result in:

baseurl = "https://site-a.example"
languageCode = "en-us"
title = "Site A's Title"
theme = "base-theme"
enableRobotsTXT = true

Having extends available for configuration files would be very nice for multi site projects realized with Hugo.

Further it would be awesome to have a similar approach for themes, so one theme can extend another one. So you could create extensive basic starter themes with a lot of default partials, layouts maybe making special themes for certain output types and maintain them centralized. Although you can override your theme with in the root/layout folder its often not enough flexibility in my eyes.

As an example:

themes/base-theme

|-- theme.toml
|-- layouts /
|--|--partials /
|--|--|--partial-a.html
|--|--|--partial-b.html
|--|--sitemap.xml
|--|--index.html
|--|--404.html

A simplified version of theme.toml for base-theme (example)

name = "base-theme"
min_version = 0.20

themes/theme-a

|-- theme.toml
|-- layouts /
|--|-- example-section /
|--|--|--single.html
|--|--|--list.html

A simplified version of theme.toml for theme-a (example)

name = "theme-a"
min_version = 0.20
extends = "base-theme"

Would result in something like:

|-- theme.toml
|-- layouts /
|--|-- example-section /
|--|--|--single.html
|--|--|--list.html
|--|--partials /
|--|--|--partial-a.html
|--|--|--partial-b.html
|--|--sitemap.xml
|--|--index.html
|--|--404.html

Obviously both themes have to exist in the themes folder.

Happy to hear your thoughts about the approach above :slightly_smiling:

1 Like
2

Hmm. In my experience (Twig, Swig, and many others), extends is close to base templates. I’ve never heard of it used in a configuration file. This is interesting. Can you point me to examples of this in the wild?

3

I’m coming more from the approach what extends does in PHP or JavaScript but I’m not an expert when it comes to template engines.

It could be, that the wording extends is badly chosen.

In YML at Symfony you have a similar functionality called imports. I’m not sure if it really extends the configuration in the way you can override the variables below. (need to test this once [2]) But I like the idea.

[2] Seems to override - thats great - http://stackoverflow.com/a/9279814/176469

Thinking loud with an approach like the imports could be helpful if the theme you use has some specific configurations you could reduce the copy&pasting. I could also see benefits for menu in the config.toml Like:

config.toml

imports = [
  "themes/anytheme/config.toml",
  "base-config.toml",
  "menu.toml"
]

# ...