html - 用于在两个 div 类之间交替的 Twig 规则

Question

首先，我不是程序员/网页设计师，我只是在制作一个小型粉丝网站，所以如果我自己尝试做这件事似乎付出了太少的努力，我很抱歉。

基本上，我正在尝试以某种方式修改网站模板，以便它不仅可以在文章预览的右侧显示新闻缩略图，而且可以在左侧和右侧之间交替显示。该模板使用 HTML、CSS 和 Twig。 imageholder-right 和 imageholder-left 是有效的 CSS 类。

原来是这样的:

        {% if record.image!="" %}
            <div class="large-4 imageholder-right">
                <a href="{{ image(record.image) }}">
                    <img src="{{ thumbnail(record.image, 400, 260) }}">
                </a>
            </div>
        {% endif %}

这就是我尝试做的，以便它可以像我想要的那样运行:

        {% if record.image!="" %}
            {% set imagepos = 'right' %}
            {% if imagepos == right %}
                <div class="large-4 imageholder-left">
                    <a href="{{ image(record.image) }}">
                        <img src="{{ thumbnail(record.image, 400, 260) }}">
                    </a>
                </div>
                {% set imagepos = 'left' %}
            {% else %}
                <div class="large-4 imageholder-right">
                    <a href="{{ image(record.image) }}">
                        <img src="{{ thumbnail(record.image, 400, 260) }}">
                    </a>
                </div>  
                {% set imagepos = 'right' %}
            {% endif %}
        {% endif %}

但是，使用此代码，每个图像预览都保留在右侧。

Answer 1

您可以查看{% loop.index %} .

Twig - Loops

我猜你的代码处于循环中？

编辑:

正如@DarkBee建议的，最干净的方法是使用 <div class="large-4 imageholder-{{ loop.index is even ? 'right' : 'left' }}"> .

{% for record in records %}
    {% if record.image != "" %}
        <div class="large-4 imageholder-{{ loop.index is even ? 'right' : 'left' }}">
            <a href="{{ image(record.image) }}">
                <img src="{{ thumbnail(record.image, 400, 260) }}">
            </a>
        </div>
    {% endif %}
{% endfor %}