Skip to content

Instantly share code, notes, and snippets.

@ndarville

ndarville/README.md

Created August 22, 2017 18:16
Show Gist options
  • Star 1 You must be signed in to star a gist
  • Fork 1 You must be signed in to fork a gist
  • Save ndarville/6929cf728e3d962b051bb4c5dd177c15 to your computer and use it in GitHub Desktop.
Save ndarville/6929cf728e3d962b051bb4c5dd177c15 to your computer and use it in GitHub Desktop.
Download ZIP
Convert CSV to HTML table with Jekyll/Liquid
Raw
README.md

I keep forgetting how to do this, and I never find a place that answers it online. Gists usually have pretty decent SEO.

Check out my style GitHub repo where you can see my snippets.

Raw
jekylltable.liquid
{% assign mydata=site.data.foo %}
<table>
<caption>Table caption</caption>
<thead>
{% for column in mydata[0] %}
<th>{{ column[0] }}</th>
{% endfor %}
</thead>
<tbody>
{% for row in mydata %}
<tr>
{% for cell in row %}
<td>{{ cell[1] }}</td>
{% endfor %}
</tr>
{% endfor %}
</tbody>
</table>
Raw
jekylltable.sublime-snippet
<snippet>
<content><![CDATA[
{% assign ${1:mydata}=${2:site.data.foo} %}
<table>
<caption>${3:Table caption}</caption>
<thead>
{% for column in ${1:mydata}[0] %}
<th>{{ column[0] }}</th>
{% endfor %}
</thead>
<tbody>
{% for row in ${1:mydata} %}
<tr>
{% for cell in row %}
<td>{{ cell[1] }}</td>
{% endfor %}
</tr>
{% endfor %}
</tbody>
</table>
]]></content>
<tabTrigger>;jekylltable</tabTrigger>
<!-- Optional: Set a scope to limit where the snippet will trigger -->
<!-- <scope>source.python</scope> -->
<description>Create Liquid HTML based on Jekyll datafile</description>
</snippet>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment