Reveal your source code with Jinja2 and Git

I'm a huge fan of open source.

One of the little ways I've supported the cause is by keeping my personal blog site open from the very beginning. I do this partly to let people see the history of changes behind each page. But I also do it because, when I started using Jekyll, I didn't find many open source Jekyll blogs to learn from. My hope is that keeping my website open and exposing my trials and errors will save someone else a lot of time.

The Jekyll page.path variable

One way I achieve that is by linking every entry I post back to its original Markdown. Jekyll's helpful variables have exactly the tool that's needed: the page.path. This variable contains the raw filesystem path of each page. The official description even highlights its usefulness for linking back to the source!

Printing {{ page.path }} within an article's Markdown file outputs something similar to this:

_posts/2021-10-10-example.md

Assume that the article's source code existed at this path:

https://example.com/ayushsharma-in/-/blob/master/_posts/2021-10-10-example.md

If you prepend https://example.com/ayushsharma-in/-/blob/master/ to any article's page.path, it generates a link back to its source code.

In Jekyll, generating this full link looks like this:

<a href="{{ page.path | prepend: site.content.blog_source_prefix }}" target="_blank">View source</a>

It's that easy.

Jekyll and the open web

The modern web is an intricate and multilayered technology, but that doesn't mean it has to obfuscate. With Jekyll's variables, you ensure that your users can, if they wish, learn more about how you built your site.

You can see real-world examples on my personal blog: scroll to the bottom for the View Source link.

This article is adapted from ayush sharma's notes and is republished with permission.