如何在Jekyll中创建自定义液体/降价标签?

时间:2017-06-20 07:01:22

标签: markdown jekyll

这个Jekyll降价+ HTML代码运行良好:

<div class="row">
<div class="col-md-8"  markdown="1">

**Lorem** ipsum dolor sit amet, consectetur adipiscing elit. Donec nec eros eget nisl fringilla commodo. Maecenas ornare, augue ut ultricies tristique, enim lectus pretium quam, quis bibendum metus tellus sed magna. Donec eu dolor augue ut ultricies tristique, enim lectus pretium quam, quis bibendum metus tellus sed magna.

</div><div class="col-md-4" markdown="1">
![](images/exercise.jpg)
</div></div>

但我想在降价时避免HTML,以控制样式和放大网格系统只在一个地方(例如升级到bootstrap 4或更改整个模板)

这样的工作怎么样呢?

{% grid %} 
{% col:8 %}

**Lorem** ipsum dolor sit amet, consectetur adipiscing elit. Donec nec eros eget nisl fringilla commodo. Maecenas ornare, augue ut ultricies tristique, enim lectus pretium quam, quis bibendum metus tellus sed magna. Donec eu dolor augue ut ultricies tristique, enim lectus pretium quam, quis bibendum metus tellus sed magna.    

{% col:4 %}
![](images/exercise.jpg)
{% endgrid %}

欢迎任何没有HTML的语法,这只是一个例子。

1 个答案:

答案 0 :(得分:1)

您可以使用include。这使您可以将其他文件中的内容添加到HTML中。

因此,您的grid-start.html目录中包含_includes HTML的文件名为<div class="row">。类似于<div class="col-md-8" markdown="1">内容以及结束标记。另请注意,您可以将参数传递给包含文件。

然后在你的降价中,你会做这样的事情:

{% include grid-start.html %}
   {% include col-start col="8" %}
      **Lorem** ipsum dolor sit amet...
   {% include col-end %}  
   {% include col-start col="4" %}
      ![](images/exercise.jpg)
   {% include col-end %}  
{% grid-end %}

老实说,为了避免使用一些基本的html标签,这似乎是一个很大的困难。