2

In Jekyll, I would like to include a block of HTML code (creating a bootstrap multiple tabs structure) in my output page. Since the content of each tab is quite long, I would like to keep writing it in markdown, with support for named links.

However, I have different pages with a different number of tabs, so I would like to pass the captured contents as parameters of the include statement. For example, I want my .md files to be something like:

---
layout: default
title: Test 
keywords: Test 
description: Test
datecreated: 24 Apr 2014
---

# Test Page

{% capture content1 %}
Some content here.

I want to be able to render **markdown markup**, like _this_.
{% endcapture %}

{% capture content2 %}
Some more content.

I want to be able to have [links][google] as well.

[google]: http://www.google.it/
{% endcapture %}

{% include myparametrictemplate.html sections="content1,content2" %}

So far, I have created the following myparametrictemplate.html:

## This is a test, to confirm that "content1" and "content2" are accessible

### Section1

<div class="mytab">
{{ content1 | markdownify }}
</div>

### Section2

<div class="mytab">
{{ content2 | markdownify }}
</div>

<hr/>


## Here is the part I would like to have working

Check that `include.sections = "content1,content2"`: {{ include.sections }}

{% assign arr = include.sections | split:"," %}

{% for item in arr %}

Here I got printed the string "content1" (or "content2"), not the actual content of that Liquid tag:

<div class="mytab">
{{ item | markdownify }}
</div>

{% endfor %}

<hr/>



## The ugly workaround

{% if content1 %}
### Section1

<div class="mytab">
{{ content1 | markdownify }}
</div>
{% endif %}


{% if content2 %}
### Section2

<div class="mytab">
{{ content2 | markdownify }}
</div>
{% endif %}


{% if content3 %}
### Section3

<div class="mytab">
{{ content3 | markdownify }}
</div>
{% endif %}

As you can see, {{ item }} prints the name (either content1 or content2 in the above example), while I would like to output the contents of content1 or content2. Is the latter achievable in some way? I was not able to locate anything in the Liquid documentation.

The last part of the example shows the ugly workaround I devised, which I am not happy with (because that way I cannot have multiple includes --- each with a different set of tabs --- on the same page).

EDIT: a slightly less ugly workaround (yet, still not elegant) is the following:

## The slightly less ugly workaround

{% assign arr = include.sections | split:"," %}

{% if arr contains "content1" %}
### Section1

<div class="mytab">
{{ content1 | markdownify }}
</div>
{% endif %}


{% if arr contains "content2" %}
### Section2

<div class="mytab">
{{ content2 | markdownify }}
</div>
{% endif %}


{% if arr contains "content3" %}
### Section3

<div class="mytab">
{{ content3 | markdownify }}
</div>
{% endif %}

I admit I am rather novice to Jekyll, hence I might be taking a wrong path to solve my problem. Any directions will be appreciated, thanks.

NOTE: I would like to avoid the solution proposed in https://stackoverflow.com/a/14247353/2452440 ( or http://wolfslittlestore.be/2013/10/rendering-markdown-in-jekyll/ ) because I would like to keep the contents sections on the same page .md file.

Community
  • 1
  • 1
Alberto Pettarin
  • 894
  • 6
  • 12

1 Answers1

0

One simple way to do that would be:

# myparametrictemplate.html

<div class="mytab">
{{ content1 | markdownify }}
</div>

<div class="mytab">
{{ content2 | markdownify }}
</div>

<div class="mytab">
{{ content3 | markdownify }}
</div>

You don't need to pass parameters to include as the included file will inherit the scope of the including file.

So you can just call:

{% include myparametrictemplate.html %}

Unfortunately there is no way to pass or to create a new array within a liquid template. So there is no way you can loop through your "contents".

NoRkin
  • 1
  • 1
  • This suggestion is essentially what I did in my first workaround. However, with this solution you are constrained to know the variable names (`contentX`) and how many of them you have. Moreover, you cannot have more than one include of the same template, say the first one printing `content1` and `content3`, while the second printing `content2`. My second workaround, which I dubbed "less ugly", has a series of "if" blocks, and you can pass the argument `include.sections`, partially solves the problem. You still have to put in the template, say, `content1, content2, ... contentN`. – Alberto Pettarin Apr 29 '14 at 16:50