My “Jargonator” project was built in an hour or so as a way of working out how to handle data files to populate static web pages generated in Jekyll.
I extensively referenced the official Jekyll documentation for data files - if my explanation doesn’t make any sense, those docs would be your best starting point.
You can visit the complete Jargonator page here.
This is built as a standard CSV file made of multiple fields separated by a comma, with each entry on a new line.
jargon,meaning
Drill down,Investigate further (see Deep Dive)
Circle back,Return to an earlier conversation
Boil the ocean,Do the impossible
This was then saved as a file called jargonator.csv in folder called _data in the root of my Jekyll project.
Once this is done, you then need to insert the appropriate code in your page. In my case I wanted the “jargon” part of the CSV to be a heading, followed by the “meaning” part as a standard paragraph - and everything to be separated by a horizontal rule to keep things neat.
The next step is to write and insert the code calling the data fields into your web page:
{ % for entry in site.data.jargonator %}
< hr>
< h4></h4>
< p></p>
{ % endfor %}
Ignore the first space after the { or the < in the code block above, I’m struggling to find the correct markdown to display as code and not render as html. This is my very quick and dirty workaround
In this instance “entry in site.data.jargonator” steps through each line in the jargonator CSV file and for each displays the entry.jargon field in a heading tag, then each associated entry.meaning field in a paragraph tag.
This then generates the following output which can then be styled using CSS.
<hr>
<h4>Drill down</h4>
<p>Investigate further (see Deep Dive)</p>
<hr>
<h4>Circle back</h4>
<p>Return to an earlier conversation</p>
<hr>
<h4>Boil the ocean</h4>
<p>Do the impossible</p>
Neat eh? It’s a very powerful feature that can bring a lot of functionality to Jekyll pages.