문제

나는 내 게시물 아래의 NAV 링크에 대한 루프를 시도합니다. 이것은 posts.html의 _layout로 이동합니다

게시물이 마지막 또는 첫 번째인지 표시하지 않도록 링크를 얻을 수 없습니다. 모든 도움은 굉장 할 것입니다.

{% for post in site.posts %}

    {% if post.previous != forloop.last %} 
        ← Last
    {% elsif post.next != forloop.first %} 
        Next →
    {% endif %}

{% endfor %}
도움이 되었습니까?

해결책

나는 page.next/previous를 사용하여 더 나은 행운을 빕니다

    {% if page.previous %} 
        <a rel="prev" href="{{ page.previous.url }}">&larr; Older</a>
    {% endif %}
    {% if page.next %} 
        <a rel="next" href="{{ page.next.url }}">Newer &rarr;</a>
    {% endif %}

다른 팁

당신의 변화 if 만 확인하는 진술 post.previous 존재합니다.

{% if post.previous %}
<span class="page-nav-item">
    <a rel="prev" href="{{ post.previous.url }}" title="View {{ post.previous.title }}">&larr; View previous article</a>
</span>
{% endif %}
{% if post.next %}
<span class="page-nav-item">
    <a rel="next" href="{{ post.next.url }}" title="View {{ post.next.title }}">View next article &rarr;</a>
</span>
{% endif %}

링크 배경에 이미지를 추가하십시오. 이미지가 나타나려면 추가하십시오 image: [image location] Yaml Front Matter에서

<div class="postNav clearfix">
    {% if page.previous.url %} 
      <a class="prev{% if page.previous.image %} image{% endif %}" href="{{ page.previous.url }}"><span>&laquo;&nbsp;{{ page.previous.title }}</span>
      {% if page.previous.image %} 
        <img src="{{ '/assets/blog-img/' |  append: page.previous.image }}" alt="">
      {% endif %}
    </a>
    {% endif %}  
    {% if page.next.url %}  
      <a class="next{% if page.next.image %} image{% endif %}" href="{{ page.next.url }}"><span>{{ page.next.title }}&nbsp;&raquo;</span>
      {% if page.next.image %} 
        <img src="{{ '/assets/blog-img/' | append: page.next.image }}" alt="">
      {% endif %} 
      </a>
        {% endif %}
 </div> 
라이센스 : CC-BY-SA ~와 함께 속성
제휴하지 않습니다 StackOverflow
scroll top