Есть ли в жидкостном синтаксисе дополнительный жидкостный синтаксис?

Я пытаюсь провести рефакторинг своего сайта, используя метод СУХОЙ, частично используя жидкостный синтаксис, чтобы помочь.

В настоящее время все работает с тем, что у меня здесь:

страниц internal.html

---

макет: по умолчанию

<div>

  <div class="d-flex" style="background-color: #e9ecef;">

    <div class="jumbotron mx-auto mb-0 py-3 px-5" style="max-width: 1200px">
      <div class="col-lg-12 p-3 mx-auto">

        <img width="50" height="50"
        class="rounded-circle float-left mr-2"
        src="/assets/img/internal/{{ page.image }}" />
        <h1 class="display-4">{{ page.title | escape }}</h1>
        <p class="lead">{{ content }}</p>
      </div>
    </div>
  </div>

  <div>
    <div class="d-flex justify-content-center">
      {% include card-post-{{ page.passname }}.html %}
    </div>
  </div>
</div>

{{Page.passname }} извлекается из файла.md следующим образом:

---
layout: page-internal
title: User Interface
permalink: /pages/design-ui
image: ui.svg
passname: ui
---

Это тоже отлично работает. Но затем мне нужно создать несколько страниц для извлечения, а не просто ссылаться на пароль, чтобы получить нужную страницу.md (я надеюсь, что здесь есть смысл, извиняюсь, если нет). Эта страница выглядит так

карты post.ui.html

И HTML на этой странице:

<div class="container-fluid">
  <div class="col-lg-12 mx-auto row d-flex justify-content-center mt-3" style="max-width: 1400px">
    {% for post in site.categories.ui %}
    <div class="card col-sm-12 col-lg-3 m-2">
      <div class="card-body d-flex flex-column">
        <div class="media">
          <div class="d-flex mr-3">
            <a href="{{ post.url }}">
              <img width="40" height="40"
              class="rounded-circle"
              src="/assets/img/{{ post.image }} " alt="{{ post.title }}" />
            </a>
          </div>
          <div class="media-body">
            <h6 class="mb-1">{{ post.title }}</h6>
          </div>
        </div>
        <div class="d-flex flex-column" style="height: 105px;">
         <div class="p-2">
           <p class="text-muted">{{ post.excerpt }}</p>
         </div>
        </div>
        <div class=" flex-column align-items-end">
          <button type="button" class="btn btn-secondary btn-sm btn-block" onclick="location.href = '{{ post.url }}';">View project</button>
        </div>
      </div>
    </div>
    {% endfor %}
  </div>
</div>

То, что я хотел бы сделать, это взять два сайта HTML и иметь его так:

---
layout: default
---
<div>

  <div class="d-flex" style="background-color: #e9ecef;">

    <div class="jumbotron mx-auto mb-0 py-3 px-5" style="max-width: 1200px">
      <div class="col-lg-12 p-3 mx-auto">

        <img width="50" height="50"
        class="rounded-circle float-left mr-2"
        src="/assets/img/internal/{{ page.image }}" />
        <h1 class="display-4">{{ page.title | escape }}</h1>
        <p class="lead">{{ content }}</p>
      </div>
    </div>
  </div>

  <div>
    <div class="d-flex justify-content-center">
      {% include card-post-{{ page.passname }}.html %}

      <div class="container-fluid">
        <div class="col-lg-12 mx-auto row d-flex justify-content-center mt-3" style="max-width: 1400px">
          {% for post in site.categories.ui %}
          <div class="card col-sm-12 col-lg-3 m-2">
            <div class="card-body d-flex flex-column">
              <div class="media">
                <div class="d-flex mr-3">
                  <a href="{{ post.url }}">
                    <img width="40" height="40"
                    class="rounded-circle"
                    src="/assets/img/{{ post.image }} " alt="{{ post.title }}" />
                  </a>
                </div>
                <div class="media-body">
                  <h6 class="mb-1">{{ post.title }}</h6>
                </div>
              </div>
              <div class="d-flex flex-column" style="height: 105px;">
               <div class="p-2">
                 <p class="text-muted">{{ post.excerpt }}</p>
               </div>
              </div>
              <div class=" flex-column align-items-end">
                <button type="button" class="btn btn-secondary btn-sm btn-block" onclick="location.href = '{{ post.url }}';">View project</button>
              </div>
            </div>
          </div>
          {% endfor %}
        </div>
      </div>
    </div>
  </div>
</div>

Это будет работать, однако, синтаксис здесь:

{% for post in site.categories.ui %}

Должен быть (и здесь я не могу понять, что делать)

{% for post in site.categories. {{ page.passname }} %}

Это выдает ошибку:

 Liquid Warning: Liquid syntax error (line 23): Unexpected character { in "post in site.categories.{{ page.passname }}" in /_layouts/page-internal.html

Итак, мой вопрос, как я могу получить пароль из указанного сообщения.md (в этом случае это будет design-ui.md) и положить его в {% for post in site.categories.ui %} где слово ui будет зависеть от.md

Надеюсь, я все сказал правильно, извиняюсь, если нет.

1 ответ

Ваш синтаксис цикла {% for post in site.categories. {{ page.passname }} %} это неверно:

Вы можете достичь своей категории с помощью скобок:

{% for post in site.categories[page.passname] %}

Другие вопросы по тегам