Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Jekyll on GitHub Pages: include markdown in another markdown file

I'm using kramdown with Jekyll on GitHub Pages. I have a piece of markdown that I want to use twice, and don't want to maintain two versions of it. How can I include this in other markdown files?

For example, I want to type something like

{: include otherFile.md }

and have the contents of otherFile.md rendered directly where this command is. Note that the parent file is also a markdown file, and not an HTML template.

Additional consideration: it would be great to be able to do this with the default GitHub pages workflow, and not have to use a plugin that is disabled by GH pages and have to push compiled versions of the site manually.

like image 384
Andrew Mao Avatar asked Jan 31 '17 20:01

Andrew Mao


People also ask

Can Markdown include other files?

You can now attach files, including images, to markdown files while you're editing them in the web. This works just like file attachments in issues and pull requests and supports the same file types.

Does Jekyll support Markdown?

Jekyll supports Markdown in addition to HTML when building pages. Markdown is a great choice for pages with a simple content structure (just paragraphs, headings and images), as it's less verbose than raw HTML. Create a new Markdown file named about.md in your site's root folder.

Does GitHub Pages support Markdown?

GitHub Pages supports two Markdown processors: kramdown and GitHub's own Markdown processor, which is used to render GitHub Flavored Markdown (GFM) throughout GitHub.

Do I have to use Jekyll with GitHub Pages?

So it turns out the answer is that you can use jekyll source code, but only if it's in the gh-pages branch. If you use the docs/ folder or the master branch, it seems that you need to build locally before pushing (these options just allow you to host compiled HTML files rather than the raw jekyll source files).


2 Answers

The way to go seems to be include_relative. I found this answer by user geraldb on the old Jekyll forums:

Yes, there's a simple way. It works "out-of-the-box" in Jekyll (and GitHub Pages). Just tried it. See the Vienna.html test page e.g.:

--- layout: default ---  some text here  {% include_relative test_header.md %}  some more text here  {% include_relative test_footer.md %} 

See the source -> test.md and the live page.

The "trick" if you want to call it so - is to use include_relative if you want to have the building block texts (e.g. intro.md, explanation.md, conclusion.md, etc.) along with your page (in the same folder). Cheers. Happy Jekylling.


Since I've first written this answer, the original forum post seems to be completely gone and I haven't found it archived on archive.org. The answer link on the old forum was this (now points to an unrelated post), and the profile of geraldb in the new forum is here.

The first link in the quoted answer has been updated to point to the correct file in the repo as it exists today,1 and the second link is dead but left unchanged as I'm quoting the original author here.


1Thanks to Ben Leggiero for finding it!

like image 60
Benjamin W. Avatar answered Oct 03 '22 23:10

Benjamin W.


For me, the problem couldn't be solved with importing by include_relative and using the normal include does not render the included Markdown files.

But capturing the include and then piping it through markdownify is a pretty good workaround:

{% capture my_include %}{% include a_markdown_file.md %}{% endcapture %}
{{ my_include | markdownify }}

I found this in GH:/jekyll/jekyll#1303 (comment). That's a feature request for avoiding the capturing. It's closed, unfortunately.

like image 26
biolauri Avatar answered Oct 03 '22 23:10

biolauri