jekyll 中使用分页功能

2024-02-21 19:32
文章标签 使用 功能 分页 jekyll

本文主要是介绍jekyll 中使用分页功能,希望对大家解决编程问题提供一定的参考价值,需要的开发者们随着小编来一起学习吧!

对于大多数网站(尤其是博客),当文章越来越多的时候,就会有分页显示文章列表的需求。Jekyll 已经自建分页功能,你只需要根据约定放置文件即可。

分页功能只支持 HTML 文件

Jekyll 的分页功能不支持 Markdown 或 Textile 文件,而是只支持 HTML 文件。当然,这不会让你不爽。

开启分页功能

开启分页功能很简单,只需要在 _config.yml 里边加一行,并填写每页需要几行:

paginate: 5

下边是对需要带有分页页面的配置:

paginate_path: "blog/page:num"

blog/index.html 将会读取这个设置,把他传给每个分页页面,然后从第 2 页开始输出到 blog/page:num , :num 是页码。如果有 12 篇文章并且做如下配置 paginate: 5 , Jekyll 会将前 5 篇文章写入 blog/index.html,把接下来的 5 篇文章写入 blog/page2/index.html,最后 2 篇写入 blog/page3/index.html

与 paginator 相同的属性

属性描述

page

当前页码

per_page

每页文章数量

posts

当前页的文章列表

total_posts

总文章数

total_pages

总页数

previous_page

上一页页码 或 nil

previous_page_path

上一页路径 或 nil

next_page

下一页页码 或 nil

next_page_path

下一页路径 或 nil

不支持对“标签”和“类别”分页

分页功能仅仅遍历文章列表并计算出结果,并未读取 YAML 头信息,现在不支持对“标签”和“类别”分页。

生成带分页功能的文章

接下来要做的事情就是展现在页面上了,下边是一个简单的例子:

---
layout: default
title: My Blog
---<!-- 遍历分页后的文章 -->
{% for post in paginator.posts %}<h1><a href="{{ post.url }}">{{ post.title }}</a></h1><p class="author"><span class="date">{{ post.date }}</span></p><div class="content">{{ post.content }}</div>
{% endfor %}<!-- 分页链接 -->
<div class="pagination">{% if paginator.previous_page %}<a href="/page{{ paginator.previous_page }}" class="previous">Previous</a>{% else %}<span class="previous">Previous</span>{% endif %}<span class="page_number ">Page: {{ paginator.page }} of {{ paginator.total_pages }}</span>{% if paginator.next_page %}<a href="/page{{ paginator.next_page }}" class="next">Next</a>{% else %}<span class="next ">Next</span>{% endif %}
</div>
注意首尾页

Jekyll 没有生成文件夹 ‘page1’ ,所以上边的代码有 bug ,下边的代码解决了这个问题。

下边的 HTML 片段是第一页,他除自己外,为每个页面生成了链接。

<div id="post-pagination" class="pagination">{% if paginator.previous_page %}<p class="previous">{% if paginator.previous_page == 1 %}<a href="/">Previous</a>{% else %}<a href="{{ paginator.previous_page_path }}">Previous</a>{% endif %}</p>{% else %}<p class="previous disabled"><span>Previous</span></p>{% endif %}<ul class="pages"><li class="page">{% if paginator.page == 1 %}<span class="current-page">1</span>{% else %}<a href="/">1</a>{% endif %}</li>{% for count in (2..paginator.total_pages) %}<li class="page">{% if count == paginator.page %}<span class="current-page">{{ count }}</span>{% else %}<a href="/page{{ count }}">{{ count }}</a>{% endif %}</li>{% endfor %}</ul>{% if paginator.next_page %}<p class="next"><a href="{{ paginator.next_page_path }}">Next</a></p>{% else %}<p class="next disabled"><span>Next</span></p>{% endif %}</div>

这篇关于jekyll 中使用分页功能的文章就介绍到这儿,希望我们推荐的文章对编程师们有所帮助!



http://www.chinasem.cn/article/732836

相关文章

Java使用Javassist动态生成HelloWorld类

《Java使用Javassist动态生成HelloWorld类》Javassist是一个非常强大的字节码操作和定义库,它允许开发者在运行时创建新的类或者修改现有的类,本文将简单介绍如何使用Javass... 目录1. Javassist简介2. 环境准备3. 动态生成HelloWorld类3.1 创建CtC

使用Python批量将.ncm格式的音频文件转换为.mp3格式的实战详解

《使用Python批量将.ncm格式的音频文件转换为.mp3格式的实战详解》本文详细介绍了如何使用Python通过ncmdump工具批量将.ncm音频转换为.mp3的步骤,包括安装、配置ffmpeg环... 目录1. 前言2. 安装 ncmdump3. 实现 .ncm 转 .mp34. 执行过程5. 执行结

Java使用jar命令配置服务器端口的完整指南

《Java使用jar命令配置服务器端口的完整指南》本文将详细介绍如何使用java-jar命令启动应用,并重点讲解如何配置服务器端口,同时提供一个实用的Web工具来简化这一过程,希望对大家有所帮助... 目录1. Java Jar文件简介1.1 什么是Jar文件1.2 创建可执行Jar文件2. 使用java

C#使用Spire.Doc for .NET实现HTML转Word的高效方案

《C#使用Spire.Docfor.NET实现HTML转Word的高效方案》在Web开发中,HTML内容的生成与处理是高频需求,然而,当用户需要将HTML页面或动态生成的HTML字符串转换为Wor... 目录引言一、html转Word的典型场景与挑战二、用 Spire.Doc 实现 HTML 转 Word1

Java中的抽象类与abstract 关键字使用详解

《Java中的抽象类与abstract关键字使用详解》:本文主要介绍Java中的抽象类与abstract关键字使用详解,本文通过实例代码给大家介绍的非常详细,感兴趣的朋友跟随小编一起看看吧... 目录一、抽象类的概念二、使用 abstract2.1 修饰类 => 抽象类2.2 修饰方法 => 抽象方法,没有

MyBatis ParameterHandler的具体使用

《MyBatisParameterHandler的具体使用》本文主要介绍了MyBatisParameterHandler的具体使用,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参... 目录一、概述二、源码1 关键属性2.setParameters3.TypeHandler1.TypeHa

Spring 中的切面与事务结合使用完整示例

《Spring中的切面与事务结合使用完整示例》本文给大家介绍Spring中的切面与事务结合使用完整示例,本文通过实例代码给大家介绍的非常详细,对大家的学习或工作具有一定的参考借鉴价值,需要的朋友参考... 目录 一、前置知识:Spring AOP 与 事务的关系 事务本质上就是一个“切面”二、核心组件三、完

使用docker搭建嵌入式Linux开发环境

《使用docker搭建嵌入式Linux开发环境》本文主要介绍了使用docker搭建嵌入式Linux开发环境,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面... 目录1、前言2、安装docker3、编写容器管理脚本4、创建容器1、前言在日常开发全志、rk等不同

使用Python实现Word文档的自动化对比方案

《使用Python实现Word文档的自动化对比方案》我们经常需要比较两个Word文档的版本差异,无论是合同修订、论文修改还是代码文档更新,人工比对不仅效率低下,还容易遗漏关键改动,下面通过一个实际案例... 目录引言一、使用python-docx库解析文档结构二、使用difflib进行差异比对三、高级对比方

sky-take-out项目中Redis的使用示例详解

《sky-take-out项目中Redis的使用示例详解》SpringCache是Spring的缓存抽象层,通过注解简化缓存管理,支持Redis等提供者,适用于方法结果缓存、更新和删除操作,但无法实现... 目录Spring Cache主要特性核心注解1.@Cacheable2.@CachePut3.@Ca