How to render a Jekyll markdown page on sites index

Question

I'm probably missing something simple but I have no way to test Jekyll locally.

I'm using GitHub pages to render Jekyll, for starters I only want to render markdown content on the main index.html from one markdown page.

The structure is:

Index.html

--- layout: default --- 

_layouts
- default.html

//html stuff.. <section>  {{page.content}}  </section> 

In root folder I have a page called content.md that I wish to render for {{page.content}} the layout renders but the liquid tags section is blank.

How do I render content.md?

Example: https://github.com/wycks/wordpress-gears-jekyll

Answer 1

There are a few things going on here.

1. In your _layouts/default.html file (and any of the other _layouts directory files for that matter), instead of:

   {{ page.content }} 

   you need to use:

   {{ content }} 

2. Jekyll only lets you includes files from a site root level _includes directory. So, you need to move your content.md from the root to that directory (making it if it doesn't already exist).

3. Finally, you need to actually make the call to the include file from your index.html file. This can be done by changing the content of your index.html file to:

   --- layout: default ---  {% include content.md %} 

That will setup the behavior you are looking for.

---

I'd point out two other things:

1. You may find that changing the extension of your index file from .html to .md works better. An important note though: you need to use .html if you want pagination. Per the Jekyll Pagination documentation, that feature only works when the file is named index.html.

2. If all you are doing in your index file is calling an include that only resides on that page, you might be just as well off simply putting the content directly in the index file.

Answer 2

include only allows you to include files directly under _includes/. There is is also include_relative which allows you to use paths and include from other places. The include has to be relative to the given file however:

{% include_relative somedir/footer.html %} 

---

There is one issue with either include method I can't resolve: If the file you include has front matter Jekyll won't strip it out. So you can't use front matter to store include specific meta data - like say "title". Of course you can use variables - {% assign title = "My Title" %} but it's not equivalent, because if you want the thing your including to be part of a collection or rendered independently you have to have a front matter.