簡體   English   中英

Jekyll:處理Markdown中的圖像

[英]Jekyll: Dealing with Images in Markdown

我已經為我的帖子頁面設計了一個由文本和圖像(更具體地說是畫廊)組成的設計。 看下面的插圖:

在此處輸入圖片說明

我已經將這些畫廊設置為我的首要任務,如下所示:

---
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文件上的頁面上。 我知道下面的代碼行不通,但是類似嗎?

This is my markdown

[gallery-1]

This is more markdown

[gallery-2]

Jekyll可能發生這種情況嗎?

任何幫助,不勝感激。 提前致謝!

首先,讓我們簡化您的yaml front matter

---
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文件:

Markdown
{% include gallery.html  gallery=1 %}
Other markdown
{% include gallery.html  gallery=2 %}

然后_includes/gallery.html文件:

{% 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模板文檔

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM