如何在 Voog 上的博客文章中添加上一篇和下一篇文章的链接？答案

【问题标题】：How can I add links to the previous and next articles to my blog article on Voog?如何在 Voog 上的博客文章中添加上一篇和下一篇文章的链接？
【发布时间】：2016-07-02 21:31:47
【问题描述】：

在 Joomla、Wordpress 和其他各种基于 php 的博客文章中添加上一个和下一个链接似乎很容易。但是，如何将这样的功能添加到我的 Voog 网站？我查看了他们的开发人员文档，但没有找到任何信息。

【问题讨论】：

标签： navigation blogs article voog

【解决方案1】：

现在可以使用最新的 Voog 更新。见docs。

来自 Voog 开发者文档的来源：

上一篇（旧）文章

{% if article.older %}
  <a href="{{ article.older.url }}">{{ article.older.title }}</a>
{% endif %}

下一篇（较新的）文章

{% if article.newer %}
  <a href="{{ article.newer.url }}">{{ article.newer.title }}</a>
{% endif %}

【讨论】：

【解决方案2】：

目前，没有直接的方法来获取上一篇和/或下一篇文章，但使用以下代码很容易实现：

首先我们要找到当前文章来获取上一篇和下一篇

{% for blog_article in blog.articles %}
 {% if article.id == blog_article.id %}

请注意，blog.articles 是按最新排序的，因此下一篇文章实际上排在上一篇之前

   {% assign next_article_idx = forloop.index0 | minus: 1 %}
   {% assign prev_article_idx = forloop.index0 | plus: 1 %}
 {% endif %}
{% endfor %}

然后，再次循环浏览文章并获取之前找到的文章

{% for blog_article in blog.articles %}
 {% if prev_article_idx == forloop.index0 %}
   <a class="prev" href="{{ blog_article.url }}">{{ blog_article.title }}</a>
 {% endif %}

 {% if next_article_idx == forloop.index0 %}
   <a class="next" href="{{ blog_article.url }}">{{ blog_article.title }}</a>
 {% endif %}
{% endfor %}

Anchorage 模板中的article page footer 有点高级，但使用相同的方法——你可以看到代码here。

【讨论】：