首页
学习
活动
专区
圈层
工具
发布
社区首页 >问答首页 >Jekyll:在Markdown中处理图像

Jekyll:在Markdown中处理图像
EN

Stack Overflow用户
提问于 2015-03-13 15:39:12
回答 1查看 2.5K关注 0票数 1

我有一个设计,我的贴子页,是由文字和图像,更具体地说,画廊。请看下面的插图:

我把这些画廊布置成这样:

代码语言:javascript
复制
---
gallery-1:
  rows:
    - images:
      -  { url: '1.jpg'}
    - images:
      -  { url: '2.jpg'}
      -  { url: '3.jpg'}
gallery-2:
  rows:
    - images:
      -  { url: '4.jpg'}
      -  { url: '5.jpg'}
---

有没有办法将这些图库打印到我的.md文件的页面上。我知道下面的代码不起作用,但是类似的东西呢?

代码语言:javascript
复制
This is my markdown

[gallery-1]

This is more markdown

[gallery-2]

杰基尔有这种可能吗?

对此的任何帮助都将不胜感激。提前感谢!

EN

回答 1

Stack Overflow用户

回答已采纳

发布于 2015-03-13 18:45:20

首先,让我们简化您的yaml front matter

代码语言:javascript
复制
---
galleries:
 # gallery number one
 1:
   # row one in gallery one
   -
     - { url: '1.jpg', alt: 'alt 1'}
   # row two in gallery one
   -
     - { url: '2.jpg', alt: 'alt 2'}
     - { url: '3.jpg', alt: 'alt 3'}

 # gallery number two
 2:
  # row one in gallery two
   -
     - { url: '4.jpg', alt: 'alt 4'}
     - { url: '5.jpg', alt: 'alt 5'}

您的.md文件:

代码语言:javascript
复制
Markdown
{% include gallery.html  gallery=1 %}
Other markdown
{% include gallery.html  gallery=2 %}

然后是_includes/gallery.html文件:

代码语言:javascript
复制
{% comment %}-----------------
  - This page receives a gallery index (include.gallery)
  - It then assign the gallery[include.gallery] to the rows variable
%}-----------------{% endcomment %}
{% assign rows = page.galleries[include.gallery] %}

{% comment %}%}-----------------
  We now loop over rows
%}-----------------{% endcomment %}
{% for row in rows %}
<div class="row">
    {% comment %}%}-----------------
      and then loop over images in row
    %}-----------------{% endcomment %}
    {% for img in row %}
        <p>src="{{ site.baseurl }}{{ img.url }}" alt="{{ img.alt }}"</p>
    {% endfor %}
</div>
{% endfor %}

yaml文档Jekyll模板文档

票数 2
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/29036378

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档