jekyll,

Jekyll, dynamic links and JSON data

Mar 10, 2023 · 1 min read · Post a comment

Here’s a good starting point when trying to create dynamic links from JSON data with Jekyll, being one of the most popular blog static site generator written in Ruby.

Prerequisites

  • Jekyll

Solution

Step 1. Create a JSON file in your _data folder found in the root Jekyll directory. For instance, we had a number of page views list per blog post. It looked something like this:

{
  "/top-command-not-found-debian-based-container/": "7",
  "/where-to-find-stored-syslog-messages/": "27",
  ...
}

Step 2. Next, as part of your post.html file located under _layouts add the following code block:

{% assign pageviews = site.data.pageviews %}

{% for pageview in pageviews -%} <li>{{ pageview[0] }} : {{ pageview[1] }}</li> {% endfor %}

Note(s):

  • The JSON file was named pageviews.json.
  • pageview[0]: the blog post title.
  • pageview[1]: the page views. Data was pulled from Google Analytics on a daily basis by running a Python script in a Docker container as a cron task. This could be a separate blog post idea though.
  • You can even save the code as a Jekyll layout, in case you are going to use in another place, but that’s not the case for me. We were using it only as part of post.html.

Conclusion

If you get stuck at some step, feel free to leave a comment below and if you find this tutorial useful, follow our official channel on Telegram.