在 jekyll 中重复 html 以获得 post 摘录
repeating html for post excerpt in jekyll
我正在迁移我用 php 和 wordpress 在 jekyll 中制作的网站。除了我在博客部分遇到的一些问题外,一切都很顺利。
这是我的 blog/index.html 的样子:
---
layout: posts
---
{% for post in paginator.posts %}
<h2><a href="{{ post.url }}">{{ post.title }}</a></h2>
<p>
<span class="date"><i class="fa fa-date"></i> {{ post.date | date: "%m-%d-%Y"}}</span>
</p>
{{ post.excerpt }}
<a class="more-link" href="{{ post.url }}">Read more...</a>
{% endfor %}
我希望发生的是布局的 html:posts 对我拥有的每个 {{ post.excerpt }} 重复。相反,它只是将所有 post 摘录包装到那个 html 位中。这是布局:
<div class="page-container">
<div class="sub-container blog">
<h1>Blog</h1>
<div class="entry">
{{ content }}
</div>
<!-- Pagination links -->
<div class="pagination">
<ul>
{% if paginator.previous_page %}
{% if paginator.previous_page == 1 %}
<li>
<a href="/blog/">Prev</a>
</li>
{% else %}
<li>
<a href="/blog/{{ paginator.previous_page }}">Prev</a>
</li>
{% endif %}
{% else %}
<li>
<span class="disabled">Prev</span>
</li>
{% endif %}
{% if paginator.page == 1 %}
<li>
<span class="active">1</span>
</li>
{% else %}
<li>
<a href="/blog/">1</a>
</li>
{% endif %}
{% for count in (2..paginator.total_pages) %}
{% if count == paginator.page %}
<li>
<span class="active">{{ count }}</span>
</li>
{% else %}
<li>
<a href="/blog/{{ count }}">{{ count }}</a>
</li>
{% endif %}
{% endfor %}
{% if paginator.next_page %}
<li>
<a href="/blog/{{ paginator.next_page }}">Next</a>
</li>
{% else %}
<li>
<span class="disabled">Next</span>
</li>
{% endif %}
</ul>
</div>
</div>
</div>
我必须使用 post 摘录来创建 for 循环吗?语法是什么?我不知道如何实现。
谢谢!
为什么您将带摘录的循环放在一个文件中,而将分页放在另一个文件中?
此 post 模板仅供博客索引和分页页面使用,因此您可以合并 blog/index.html
中的所有内容并执行 :
---
layout: default
---
<div class="page-container">
<div class="sub-container blog">
<h1>Blog</h1>
<div class="entry">
{% for post in paginator.posts %}
<h2><a href="{{ post.url }}">{{ post.title }}</a></h2>
<p><span class="date"><i class="fa fa-date"></i> {{ post.date | date: "%m-%d-%Y"}}</span></p>
{{ post.excerpt }}
<a class="more-link" href="{{ post.url }}">Read more...</a>
{% endfor %}
</div>
<!-- Pagination links -->
<div class="pagination">
<ul>
... pagination code here
</ul>
</div>
</div>
</div>
实际上我只需要将 for 循环的开始和结束移动到 div.entry
之外,就像这样:
{% for post in paginator.posts %}
<div class="entry">
<h1><a href="{{ post.url }}">{{ post.title }}</a></h1>
<p>
<span class="date"><i class="fa fa-calendar"></i> {{ post.date | date: "%m-%d-%Y"}}</span>
</p>
{{ post.excerpt }}
<a class="more-link" href="{{ post.url }}">Read more...</a>
</div>
{% endfor %}
我正在迁移我用 php 和 wordpress 在 jekyll 中制作的网站。除了我在博客部分遇到的一些问题外,一切都很顺利。
这是我的 blog/index.html 的样子:
---
layout: posts
---
{% for post in paginator.posts %}
<h2><a href="{{ post.url }}">{{ post.title }}</a></h2>
<p>
<span class="date"><i class="fa fa-date"></i> {{ post.date | date: "%m-%d-%Y"}}</span>
</p>
{{ post.excerpt }}
<a class="more-link" href="{{ post.url }}">Read more...</a>
{% endfor %}
我希望发生的是布局的 html:posts 对我拥有的每个 {{ post.excerpt }} 重复。相反,它只是将所有 post 摘录包装到那个 html 位中。这是布局:
<div class="page-container">
<div class="sub-container blog">
<h1>Blog</h1>
<div class="entry">
{{ content }}
</div>
<!-- Pagination links -->
<div class="pagination">
<ul>
{% if paginator.previous_page %}
{% if paginator.previous_page == 1 %}
<li>
<a href="/blog/">Prev</a>
</li>
{% else %}
<li>
<a href="/blog/{{ paginator.previous_page }}">Prev</a>
</li>
{% endif %}
{% else %}
<li>
<span class="disabled">Prev</span>
</li>
{% endif %}
{% if paginator.page == 1 %}
<li>
<span class="active">1</span>
</li>
{% else %}
<li>
<a href="/blog/">1</a>
</li>
{% endif %}
{% for count in (2..paginator.total_pages) %}
{% if count == paginator.page %}
<li>
<span class="active">{{ count }}</span>
</li>
{% else %}
<li>
<a href="/blog/{{ count }}">{{ count }}</a>
</li>
{% endif %}
{% endfor %}
{% if paginator.next_page %}
<li>
<a href="/blog/{{ paginator.next_page }}">Next</a>
</li>
{% else %}
<li>
<span class="disabled">Next</span>
</li>
{% endif %}
</ul>
</div>
</div>
</div>
我必须使用 post 摘录来创建 for 循环吗?语法是什么?我不知道如何实现。
谢谢!
为什么您将带摘录的循环放在一个文件中,而将分页放在另一个文件中?
此 post 模板仅供博客索引和分页页面使用,因此您可以合并 blog/index.html
中的所有内容并执行 :
---
layout: default
---
<div class="page-container">
<div class="sub-container blog">
<h1>Blog</h1>
<div class="entry">
{% for post in paginator.posts %}
<h2><a href="{{ post.url }}">{{ post.title }}</a></h2>
<p><span class="date"><i class="fa fa-date"></i> {{ post.date | date: "%m-%d-%Y"}}</span></p>
{{ post.excerpt }}
<a class="more-link" href="{{ post.url }}">Read more...</a>
{% endfor %}
</div>
<!-- Pagination links -->
<div class="pagination">
<ul>
... pagination code here
</ul>
</div>
</div>
</div>
实际上我只需要将 for 循环的开始和结束移动到 div.entry
之外,就像这样:
{% for post in paginator.posts %}
<div class="entry">
<h1><a href="{{ post.url }}">{{ post.title }}</a></h1>
<p>
<span class="date"><i class="fa fa-calendar"></i> {{ post.date | date: "%m-%d-%Y"}}</span>
</p>
{{ post.excerpt }}
<a class="more-link" href="{{ post.url }}">Read more...</a>
</div>
{% endfor %}