如何切换 div 而不会弄乱？

Question

我想将“类别”部分放在“最近的帖子”部分上方，但不会搞砸，但我遇到了麻烦。有什么建议吗？

 <div align="center"> 
  <h3>Recent Articles</h3> </div>
  <ul id="posts">
    {% for article in blog.articles  %}
    <li><a href="{{article.url}}">{{ article.title }}</a>
      <p>{{ article.published_at | date: "%b %d %Y" }}</p>
      {{ article.excerpt_or_content }}
      <p>{{ article.content | strip_html | truncate: 100 }}</p>
    </li>
    {% endfor %} 
    <div align="center"> 
      <h3 style="margin: 20px 0">Categories</h3> </div>
    {% for tag in blog.all_tags %}
    <li class="tags">
      <a href="{{ shop.url}}/blogs/{{ blog.handle }}/tagged/{{ tag | handleize }}">{{ tag }}</a>
    </li>


    {% endfor %} 
  </ul>
</div>

Answer 1

鉴于标签 {% %} 最有可能用于 Shopify 网站 - 它们必须与 html 块一起移动。以下代码将起作用：

<div align="center"><h3>Categories</h3></div>
<ul id="posts">
    {% for tag in blog.all_tags %}
    <li class="tags">
      <a href="{{ shop.url}}/blogs/{{ blog.handle }}/tagged/{{ tag | handleize }}">{{ tag }}</a>
    </li>
    {% endfor %} 

    <div align="center"><h3 style="margin: 20px 0">Recent Articles</h3></div>
    {% for article in blog.articles  %}
    <li><a href="{{article.url}}">{{ article.title }}</a>
      <p>{{ article.published_at | date: "%b %d %Y" }}</p>
      {{ article.excerpt_or_content }}
      <p>{{ article.content | strip_html | truncate: 100 }}</p>
    </li>
    {% endfor %} 
</ul>

您给出的代码最后还有一个额外的</div> 标签，在这种情况下不需要，所以我删除了它。