1

我正在使用 Grav CMS 创建模块化网页;但是,我很难根据内容的生成方式自定义布局。

我已经按照文档找到了 Grav 主站点,我在该站点之后对我的站点进行了建模。

我的文件夹结构本质上是:

pages
    01.home
         _section1
         _section2

在每个部分文件夹中,我都有我的 .md 文件。每个部分都被视为“主页”的子页面。

我创建了模板文件 modules.html.twig,其中包含以下代码:

{% extends 'partials/base.html.twig' %}

{% block content %}
{% for child in page.children() %}
    {{ child.content() }}
{% endfor %}
{% endblock %}

此代码遍历子页面以将内容加载到主页上。在我的模板中,我只是使用打印内容的结果{{ content }}

我最终得到的是一个具有垂直堆叠内容和重复 html 的页面, 因此

我想要做的是唯一地定义每个子页面(部分),以便我可以在我的 html 中以不同方式操作内容,例如.

我曾考虑为每个部分创建单独的模板文件,但我的大部分内容都是嵌套的。

例如,我有类似的东西:

<div class="row">
   <div class="section-1">
      <h1>{{ content }}</h1>  <!--Needs to be unique-->
   </div>
   <div class="section-2">
      <h1>{{ content }}</h1>  <!--Needs to be unique-->
   </div>
</div>

是否有可能用这个框架完成我想要做的事情?如果是这样,我该怎么做?

谢谢

4

1 回答 1

0

我认为有很多方法可以做到这一点。对我来说,我使用页面的标题来设置每个部分的 CSS 类。

我部分的 md 文件可能如下所示(例如 mysection.md)

---
title: Section 1
section_class: section-1
---
This is the content of section 1.

这是我的模块化.html.twig:

{% extends 'partials/base.html.twig' %}

{% block content %}
<div class="row">
    {% for child in page.children() %}
    <div class="{{ child.header.section_class }}">
        {{ child.content() }}
    </div>
    {% endfor %}
</div>
{% endblock %}

在我的 mysection.html.twig 中,我打印了该部分的内容

<h1>{{ page.content }}</h1>

我希望这有帮助。

于 2016-03-28T15:43:22.287 回答