Add pagination to blog

_layouts/_includes/header.html

@@ -3,7 +3,7 @@
   <h1 class="site-title">
     <a class="logo-text" href="/index.html"><img src="{{ '/assets/images/black_python_devs_logo-horizontal-white.png' }}" alt="Black Python Devs" /></a>
   </h1>
-  <nav class="site-navigation" aria-label="Main navigation">
+  <nav class="site-navigation" aria-label="Main navigation" style="padding-right: 2em">
     <div class="site-navigation-wrap">
       <ul class="menu" role="menu">
         {% for item in navigation %} {% set current = nil %} {% set nav_lang = nil %} {% if url == item.url %} {% set current = 'nav-current' %} {% endif %} {% if lang != 'en' %} {% set nav_lang = lang %} {% endif %}

_layouts/blog-list.html

@@ -17,4 +17,14 @@ <h2><a href="{{ page }}.html">
       </article>
     {% endfor %}
     </section>
-{% endblock %}
+<section>
+  <div role="group">
+    <h4>Pages:</h4>
+    <div>
+  {% for page in range(1, num_of_pages + 1) %}
+      <a role="button" {% if page == archive_index %} disabled {% endif %} href="/blog/blog{{page}}.html">{{ page }}</a>
+  {% endfor %}
+  </div>
+  </div>
+</section>
+{%endblock %}

app.py

@@ -9,7 +9,7 @@
 
 navigation = [
     {"text": "Home", "url": "/index.html", "fa": "fa fa-home fa-fw"},
-    {"text": "Blog", "url": "/blog", "fa": "fa fa-newspaper fa-fw"},
+    {"text": "Blog", "url": "/blog/blog1.html", "fa": "fa fa-newspaper fa-fw"},
     {"text": "About Us", "url": "/about.html", "fa": "fa fa-info-circle fa-fw"},
     {"text": "BPD Events", "url": "/bpd-events", "fa": "fa fa-calendar fa-fw"},
     {
@@ -86,3 +86,4 @@ class Blog(Blog):
     routes = ["./blog"]
     has_archive = True
     archive_template = "blog-list.html"
+    items_per_page = 10

pyproject.toml

@@ -2,7 +2,7 @@
 name = "blackpythondevs-site"
 version = "0.1.0"
 description = "Black Python Devs community website"
-dependencies = ["render-engine[cli]==2025.6.1b2", "pyyaml"]
+dependencies = ["render-engine[cli]>=2025.7.1a1", "pyyaml"]
 
 [project.optional-dependencies]
 dev = [