How to Add Multiple Classes to Markdown Using Jekyll

Jekyll multiple custom repeatable content

I figured out the problem. First one is the folder structure. Simply keep all the postfiles in the _posts/ file in the root directory. The second one is the capitalization of the category name in your liquid tag. Although there are no semantic differences between JOBS and jobs, when used in liquid arguments, they act in a weird way. So try to keep them in lower case. Simply replace the line

{% for post in site.categories.JOBS %}

with this

{% for post in site.categories.jobs %}

This won't solve your problem right away. Jekyll expects you to wrap your posts YAML matter between --- 3 dashes. So you've to use the following format for you post markdown and everything will work:

---
title: test
category: jobs
length: April 2010 – April 2012
position: Junior Developer
---
Content to be displayed

Two Columns - One Ordered List Jekyll

Here's an idea: Use one column and add style="column-count: 2" to that. Done!

More css column options: https://css-tricks.com/almanac/properties/c/columns/#article-header-id-0

pass multiple content from layout to page

GitHub Pages disallow plugins, so I'll stick to vanilla Jekyll workarounds. You can of course use plugins, generate your site locally and host the results on GitHub.


This is ugly, but possible. Keep your layout as is:

<body>
<!-- varies with page -->
{{ page.other_content }}
</body>

Then in your page file, define the property other_content in the front matter:

---
other_content: |
<script>
console.log("You can't stop me!");
</script>
---

The pipe character denotes a multiline string. Per YAML's rules, your scripts must be indented by spaces (no tabs allowed).


If your scripts become too large, you can move them to separate files, and the front matter of your pages would refer to the script file names instead:

---
scripts: [test]
---

In the layout:

{% for s in page.scripts %}
<script src="{{ s }}.js"></script>
{% endfor %}

This works if test.js is in the same directory as the page using it. You can use site.baseurl to get absolute paths, etc.



Related Topics



Leave a reply



Submit