Note that there are some explanatory texts on larger screens.

plurals
  1. PO
    primarykey
    data
    text
    <p>While building my own site I came across this very same problem, and I have found an (IMHO) easy and robust solution. Hopefully this is useful for anyone else wishing to do something similar.</p> <h2>The Problem</h2> <p>Given a subset of pages (not posts) on the site, list them under headings based on their categories. For example: given a set of pages which we consider <em>resource</em> pages (or reference pages, or whatever logical grouping of pages that you want to display are), we want to list them under their categories (ex. code, explanation, et cetera).</p> <h2>The Solution</h2> <p>To get the behaviour that we want, we have to make modifications in three places:</p> <ul> <li><code>_config.yml</code></li> <li><code>resources.md</code></li> <li><code>resource-file-<strong><em>X</em></strong>.md</code></li> </ul> <h3><code>_config.yml</code></h3> <p>In <code>_config.yml</code>, we must add a list of all of the categories/keywords/tags (or whatever you want to call it) that will appear in the resource files. Here is what I have in mine:</p> <pre><code>category-list: [code, editors, math, unix] </code></pre> <p>You can call the variable anything, I chose <code>category-list</code>, just make sure that you use the same variable in the <code>resource.md</code> file.</p> <p><em>Note: The order that you place the items in the list is the order they will be listed on the <code>resource.md</code> page.</em></p> <h3><code>resource-file-<strong><em>X</em></strong>.md</code></h3> <p>These are the files that you want to have indexed and linked to on the <code>resources.md</code> page. All that you need to do is add two file variables to the top of each of these files. The first is to indicate that this file is a <em>resource</em> file.</p> <pre><code>resource: true </code></pre> <p>The second is to indicate what categories you want this file to be indexed under. You can index it under as many categories as you would like, and if you want a page un-indexed, leave the list blank. My reference for proper EINTR handling in C has the following categories:</p> <pre><code>categories: [code, unix] </code></pre> <h3><code>resources.md</code></h3> <p>This is the file that will generate the list of pages based on their respective categories. All you need to do is add the following code to this file (or whatever file you want the list to be on):</p> <pre><code>{% for cat in site.category-list %} ### {{ cat }} &lt;ul&gt; {% for page in site.pages %} {% if page.resource == true %} {% for pc in page.categories %} {% if pc == cat %} &lt;li&gt;&lt;a href="{{ page.url }}"&gt;{{ page.title }}&lt;/a&gt;&lt;/li&gt; {% endif %} &lt;!-- cat-match-p --&gt; {% endfor %} &lt;!-- page-category --&gt; {% endif %} &lt;!-- resource-p --&gt; {% endfor %} &lt;!-- page --&gt; &lt;/ul&gt; {% endfor %} &lt;!-- cat --&gt; </code></pre> <h2>Code Breakdown</h2> <p>Just a quick explanation of how this works:</p> <ul> <li>Loop through each of the categories specified in <code>_config.yml</code>.</li> <li>Display a heading with that category name.</li> <li>Start an unordered list for the pages that belong in that category.</li> <li>Loop through the pages on the site.</li> <li>If the page is a <em>resource</em> file as indicated by the file variable <code>resource</code>, then for each of the categories that the file belongs to, if one of them matches the current category being listed, display a link to that page.</li> </ul> <p><em>Note: the variables <code>category-list</code> in <code>_config.yml</code> and <code>categories</code> in the resource files can be called whatever you want, just make sure that you use the same variables in the file generating the list.</em></p> <p><em>Another Note: When you modify <code>_config.yml</code>, you have to completely restart Jekyll, even if you have the <code>--watch</code> option, you have to stop and restart it. It took me a while to figure out why my changes weren't taking effect!</em></p> <h2>The Final Product</h2> <p>You can see the final product on the resources page on <a href="http://www.m-renaud.com/resources/" rel="noreferrer">my site</a>, although I just put this together today so at the time of this writing, it's far from complete, but you can check out my bio if you want on the home page.</p> <p>Hope this helps!</p>
    singulars
    1. This table or related slice is empty.
    plurals
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. VO
      singulars
      1. This table or related slice is empty.
    2. VO
      singulars
      1. This table or related slice is empty.
    3. VO
      singulars
      1. This table or related slice is empty.
    1. This table or related slice is empty.
 

Querying!

 
Guidance

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload