Jekyll, the static site generator, uses the _config.yml for configuration. The configurations are all Jekyll specific. But we can also define variables with our own content in these files and use them throughout our website. In this article, I’ll highlight some advantages of dynamically creating Jekyll config files.
On my local laptop, I use the following command to serve my Jekyll website for testing:
bundle exec jekyll serve --incremental --config _config.yml
Combining many configuration files
During local testing, it’s sometimes necessary to override configuration options. My website’s current _config.yml has the following settings:
# Jekyll Configuration
# Site Settings
url: "https://notes.ayushsharma.in"
website_url: "https://notes.ayushsharma.in/"
title: ayush sharma's notes ☕ + 🎧 + 🕹️
email: ayush@example.com
images-path: /static/images/
videos-path: /static/videos/
js-path: /static/js/
baseurl: "" # the subpath of your site, e.g. /blog
Since the local jekyll serve URL is http://localhost:4000, the URL defined above won’t work. I can always create a copy of _config.yml as _config-local.yml and replace all the values. But there is an easier option.
Jekyll allows specifying many configuration files with later declarations overriding previous ones. This means I can define a new _config-local.yml with the following code:
url: ""
Then I can combine the above file with my main _config.yml like this:
bundle exec jekyll serve --incremental --config _config.yml,_config-local.yml
By combining both files, the final value of url for this Jekyll serve will be blank. This will turn all absolute URLs defined in my website into relative URLs and make them work on my local laptop.
Combining dynamic config files
As a simple example, let’s say you want to display the current date on your website. The bash command for this will be:
> date '+%A, %d %B %Y'
Saturday, 16 October 2021
We know we can use Jekyll’s _config.yml’s for custom content as well. Let’s output the above date into a new Jekyll config file.
my_date=`date '+%A, %d %B %Y'`; echo 'my_date: "'$my_date'"' > _config-data.yml
Now _config-data.yml contains:
my_date: "Saturday, 16 October 2021"
We can combine our new config file with the others and use the my_date variable in our website.
bundle exec jekyll serve --incremental --config _config.yml,_config-local.yml,_config-data.yml
On running the above command, {{ site.my_date }} will output its configured value.
Conclusion
The example above is quite simple but the possibilities are endless. Bash, Python, and other programming languages can dynamically generate Jekyll config files. We can then combine these during the build or serve process.
For findmymastodon.com, I’m using Python to fetch Mastodon user statistics. I’m then writing these into a new _config-data.yml file (currently manually). Finally, the home page and others display these from the configuration file. This way I can leverage a dynamic backend and still keep all the static website goodness I’m so fond of.
I hope this has sparked some ideas for your own static websites. The JAMStack is great for static websites. But we can avoid creating an entire API backend for dynamic content. Why not instead use a build job to create config files with updated content? It might not suit every use-case, but one less API means fewer infrastructure moving parts.
I hope this helps you in some way during your next static website project. Keep reading, and happy coding :)