Skip to content

Commit 44da14f

Browse files
andorthehoodandorthehood
authored
Merge pull request #83 from andorthehood/copilot/fix-a1d7feb8-f902-461c-beda-0ca7505e2cfa
Add configurable pagination layout templates with Liquid template support, comprehensive dynamic page links, and optional pagination generation
2 parents fb02714 + 6c407da commit 44da14f

17 files changed

+1041
-143
lines changed

‎docs/PAGINATION_LAYOUT_TEMPLATES.md‎

Lines changed: 159 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,159 @@
1+
# Pagination Layout Templates
2+
3+
This feature adds support for configurable pagination layouts in the lepkefing static site generator. Instead of being limited to hardcoded HTML for pagination pages, sites can now define custom layouts that integrate with the existing template system.
4+
5+
## Configuration
6+
7+
Add the following settings to your site's `config.md` to enable custom pagination layouts:
8+
9+
```yaml
10+
---
11+
title: My Site
12+
posts_per_page: 10
13+
pagination_layout: pagination # Optional: layout for regular pagination pages
14+
category_pagination_layout: category-pagination # Optional: layout for category pagination pages
15+
---
16+
```
17+
18+
## Layout Files
19+
20+
Create layout files in your site's `layouts/` directory:
21+
22+
- `pagination.html` - Used for regular pagination pages (e.g., `/page1.html`, `/page2.html`)
23+
- `category-pagination.html` - Used for category pagination pages (e.g., `/category/tech/page1.html`)
24+
25+
## Available Template Variables
26+
27+
### Regular Pagination Layout
28+
29+
Your pagination layout has access to these variables:
30+
31+
- `page_number` - Current page number (e.g., "1", "2")
32+
- `total_pages` - Total number of pagination pages
33+
- `has_previous` - Boolean ("true"/"false") if previous page exists
34+
- `has_next` - Boolean ("true"/"false") if next page exists
35+
- `previous_page_number` - Previous page number (if exists)
36+
- `previous_page_url` - URL to previous page (e.g., "/page1")
37+
- `next_page_number` - Next page number (if exists)
38+
- `next_page_url` - URL to next page (e.g., "/page3")
39+
- `page_posts.*` - Collection of posts on this page (accessible via for loops)
40+
41+
### Category Pagination Layout
42+
43+
Category layouts have all regular pagination variables plus:
44+
45+
- `category_name` - Display name of the category (e.g., "Technology")
46+
- `category_slug` - URL-safe category slug (e.g., "technology")
47+
- `category_index_url` - URL to category's first page (e.g., "/category/tech/page1")
48+
- `site_index_url` - URL to site home ("/")
49+
50+
## Example Templates
51+
52+
### Basic Pagination Layout (`pagination.html`)
53+
54+
```html
55+
<div class="pagination-page">
56+
<header>
57+
<h1>Archive - Page {{page_number}}</h1>
58+
<p>Showing page {{page_number}} of {{total_pages}} pages</p>
59+
</header>
60+
61+
<section class="posts-list">
62+
{% for post in page_posts %}
63+
<article class="post-preview">
64+
<h2><a href="/posts/{{post.slug}}">{{post.title}}</a></h2>
65+
<time>{{post.date}}</time>
66+
<div class="excerpt">{{post.content}}</div>
67+
</article>
68+
{% endfor %}
69+
</section>
70+
71+
<nav class="pagination-navigation">
72+
<ul class="pagination-links">
73+
{% if has_previous %}
74+
<li><a href="{{previous_page_url}}">← Previous</a></li>
75+
{% endif %}
76+
77+
<li><a href="/">Home</a></li>
78+
79+
{% if has_next %}
80+
<li><a href="{{next_page_url}}">Next →</a></li>
81+
{% endif %}
82+
</ul>
83+
</nav>
84+
</div>
85+
```
86+
87+
### Category Pagination Layout (`category-pagination.html`)
88+
89+
```html
90+
<div class="category-pagination-page">
91+
<header>
92+
<h1>{{category_name}} - Page {{page_number}}</h1>
93+
<p>Posts in <strong>{{category_name}}</strong> category</p>
94+
</header>
95+
96+
<section class="posts-list">
97+
{% for post in page_posts %}
98+
<article class="post-preview category-post">
99+
<h2><a href="/posts/{{post.slug}}">{{post.title}}</a></h2>
100+
<time>{{post.date}}</time>
101+
<span class="category">📁 {{post.category}}</span>
102+
<div class="excerpt">{{post.content}}</div>
103+
</article>
104+
{% endfor %}
105+
</section>
106+
107+
<nav class="category-pagination-navigation">
108+
<ul class="pagination-links">
109+
{% if has_previous %}
110+
<li><a href="{{previous_page_url}}">← Previous</a></li>
111+
{% endif %}
112+
113+
<li><a href="{{category_index_url}}">Category Index</a></li>
114+
<li><a href="{{site_index_url}}">Site Home</a></li>
115+
116+
{% if has_next %}
117+
<li><a href="{{next_page_url}}">Next →</a></li>
118+
{% endif %}
119+
</ul>
120+
</nav>
121+
</div>
122+
```
123+
124+
## Fallback Behavior
125+
126+
The system provides robust fallback behavior:
127+
128+
1. **No layout configured**: Uses original hardcoded HTML pagination
129+
2. **Layout file not found**: Shows warning message and falls back to hardcoded HTML
130+
3. **Layout render error**: Shows warning message and falls back to hardcoded HTML
131+
4. **Category layout preference**:
132+
- First tries `category_pagination_layout`
133+
- Then tries `pagination_layout`
134+
- Finally falls back to hardcoded HTML
135+
136+
This ensures existing sites continue to work without any changes, and new sites can gradually adopt custom layouts.
137+
138+
## Migration
139+
140+
Existing sites require no changes - they will continue to use the original hardcoded pagination HTML. To adopt custom layouts:
141+
142+
1. Add `pagination_layout` and/or `category_pagination_layout` to your `config.md`
143+
2. Create corresponding layout files in your `layouts/` directory
144+
3. Use the available template variables to create your desired pagination UI
145+
146+
## Technical Implementation
147+
148+
- Layouts are processed through the full template pipeline (Liquid tags, variables, includes)
149+
- Template variables use the existing collection system (e.g., `page_posts.0.title`, `page_posts.1.title`)
150+
- Layout resolution uses the same path-building logic as regular page layouts
151+
- All existing tests continue to pass, ensuring backward compatibility
152+
153+
## Related Files
154+
155+
- `src/layout.rs` - Layout loading and rendering utilities
156+
- `src/generate_pagination_pages.rs` - Regular pagination generator
157+
- `src/generate_category_pages.rs` - Category pagination generator
158+
- `sites/test/layouts/pagination.html` - Example regular pagination layout
159+
- `sites/test/layouts/category-pagination.html` - Example category pagination layout

‎sites/lepkef.ing/config.md‎

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -3,4 +3,6 @@ title: "Andor Polgar's Visual Journal"
33
posts_per_page: 6
44
site_url: "https://lepkef.ing"
55
description: "Visual experiments, photography, and creative projects by Andor Polgar"
6+
pagination_layout: pagination
7+
category_pagination_layout: category-pagination
68
---

‎sites/lepkef.ing/layouts/category-pagination.html‎

Lines changed: 32 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,32 @@
1+
{% for post in page_posts %}
2+
<article>
3+
<h2><a href="/posts/{{post.slug}}">{{post.title}}</a></h2>
4+
{% if post.content %}
5+
{{post.content}}
6+
{% endif %}
7+
</article>
8+
{% endfor %}
9+
10+
<ul class="pagination">
11+
{% if has_previous %}
12+
<li>
13+
<a href="{{previous_page_url}}" rel="prev">
14+
← Previous ({{previous_page_number}})
15+
</a>
16+
</li>
17+
{% endif %}
18+
19+
{% for page in page_numbers %}
20+
<li>
21+
<a href="{{page.url}}">{{page.number}}</a>
22+
</li>
23+
{% endfor %}
24+
25+
{% if has_next %}
26+
<li>
27+
<a href="{{next_page_url}}" rel="next">
28+
Next ({{next_page_number}}) →
29+
</a>
30+
</li>
31+
{% endif %}
32+
</ul>

‎sites/lepkef.ing/layouts/pagination.html‎

Lines changed: 32 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,32 @@
1+
{% for post in page_posts %}
2+
<article>
3+
<h2><a href="/posts/{{post.slug}}">{{post.title}}</a></h2>
4+
{% if post.content %}
5+
{{post.content}}
6+
{% endif %}
7+
</article>
8+
{% endfor %}
9+
10+
<ul class="pagination">
11+
{% if has_previous %}
12+
<li>
13+
<a href="{{previous_page_url}}" rel="prev">
14+
← Previous ({{previous_page_number}})
15+
</a>
16+
</li>
17+
{% endif %}
18+
19+
{% for page in page_numbers %}
20+
<li>
21+
<a href="{{page.url}}">{{page.number}}</a>
22+
</li>
23+
{% endfor %}
24+
25+
{% if has_next %}
26+
<li>
27+
<a href="{{next_page_url}}" rel="next">
28+
Next ({{next_page_number}}) →
29+
</a>
30+
</li>
31+
{% endif %}
32+
</ul>

‎sites/polgarhivatal.nl/config.md‎

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,6 @@
11
---
22
title: "Polgar Hivatal"
33
posts_per_page: 5
4+
pagination_layout: pagination
5+
category_pagination_layout: category-pagination
46
---

‎sites/polgarhivatal.nl/layouts/category-pagination.html‎

Lines changed: 76 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,76 @@
1+
<!-- Category pagination layout template for polgarhivatal.nl -->
2+
<div class="category-pagination-page">
3+
<header class="category-pagination-header">
4+
<h1>{{category_name}} - Page {{page_number}}</h1>
5+
<p>{{category_name}} entries (Page {{page_number}} of {{total_pages}})</p>
6+
</header>
7+
8+
<section class="posts-list">
9+
{% for post in page_posts %}
10+
<article class="post-preview category-post">
11+
<h2><a href="/posts/{{post.slug}}">{{post.title}}</a></h2>
12+
<time class="post-date">{{post.date}}</time>
13+
<span class="post-category">📁 {{post.category}}</span>
14+
{% if post.content %}
15+
<div class="post-excerpt">
16+
{{post.content}}
17+
</div>
18+
{% endif %}
19+
</article>
20+
{% endfor %}
21+
</section>
22+
23+
<nav class="category-pagination-navigation" aria-label="Category Navigation">
24+
<ul class="pagination-links">
25+
{% if has_previous %}
26+
<li>
27+
<a href="{{previous_page_url}}" rel="prev">
28+
← Previous ({{previous_page_number}})
29+
</a>
30+
</li>
31+
{% endif %}
32+
33+
<li>
34+
<a href="{{category_index_url}}" rel="category-home">📂 {{category_name}} Index</a>
35+
</li>
36+
37+
<li>
38+
<a href="{{site_index_url}}" rel="home">🏠 Polgár Hivatal Home</a>
39+
</li>
40+
41+
<li>
42+
{% if page_number == 1 %}
43+
<span class="current-page" aria-current="page">1</span>
44+
{% else %}
45+
<a href="/category/{{category_slug}}/page1">1</a>
46+
{% endif %}
47+
</li>
48+
{% if total_pages > 1 %}
49+
<li>
50+
{% if page_number == 2 %}
51+
<span class="current-page" aria-current="page">2</span>
52+
{% else %}
53+
<a href="/category/{{category_slug}}/page2">2</a>
54+
{% endif %}
55+
</li>
56+
{% endif %}
57+
{% if total_pages > 2 %}
58+
<li>
59+
{% if page_number == 3 %}
60+
<span class="current-page" aria-current="page">3</span>
61+
{% else %}
62+
<a href="/category/{{category_slug}}/page3">3</a>
63+
{% endif %}
64+
</li>
65+
{% endif %}
66+
67+
{% if has_next %}
68+
<li>
69+
<a href="{{next_page_url}}" rel="next">
70+
Next ({{next_page_number}}) →
71+
</a>
72+
</li>
73+
{% endif %}
74+
</ul>
75+
</nav>
76+
</div>

‎sites/polgarhivatal.nl/layouts/pagination.html‎

Lines changed: 71 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,71 @@
1+
<!-- Pagination layout template for polgarhivatal.nl -->
2+
<div class="pagination-page">
3+
<header class="pagination-header">
4+
<h1>Polgár Hivatal Archive - Page {{page_number}}</h1>
5+
<p>Page {{page_number}} of {{total_pages}}</p>
6+
</header>
7+
8+
<section class="posts-list">
9+
{% for post in page_posts %}
10+
<article class="post-preview">
11+
<h2><a href="/posts/{{post.slug}}">{{post.title}}</a></h2>
12+
<time class="post-date">{{post.date}}</time>
13+
{% if post.content %}
14+
<div class="post-excerpt">
15+
{{post.content}}
16+
</div>
17+
{% endif %}
18+
</article>
19+
{% endfor %}
20+
</section>
21+
22+
<nav class="pagination-navigation" aria-label="Archive Navigation">
23+
<ul class="pagination-links">
24+
{% if has_previous %}
25+
<li>
26+
<a href="{{previous_page_url}}" rel="prev">
27+
← Previous ({{previous_page_number}})
28+
</a>
29+
</li>
30+
{% endif %}
31+
32+
<li>
33+
<a href="/" rel="home">🏠 Home</a>
34+
</li>
35+
36+
<li>
37+
{% if page_number == 1 %}
38+
<span class="current-page" aria-current="page">1</span>
39+
{% else %}
40+
<a href="/page1">1</a>
41+
{% endif %}
42+
</li>
43+
{% if total_pages > 1 %}
44+
<li>
45+
{% if page_number == 2 %}
46+
<span class="current-page" aria-current="page">2</span>
47+
{% else %}
48+
<a href="/page2">2</a>
49+
{% endif %}
50+
</li>
51+
{% endif %}
52+
{% if total_pages > 2 %}
53+
<li>
54+
{% if page_number == 3 %}
55+
<span class="current-page" aria-current="page">3</span>
56+
{% else %}
57+
<a href="/page3">3</a>
58+
{% endif %}
59+
</li>
60+
{% endif %}
61+
62+
{% if has_next %}
63+
<li>
64+
<a href="{{next_page_url}}" rel="next">
65+
Next ({{next_page_number}}) →
66+
</a>
67+
</li>
68+
{% endif %}
69+
</ul>
70+
</nav>
71+
</div>

0 commit comments

Comments
 (0)