diff --git a/config.toml b/config.toml
index 304c780..bd9d561 100644
--- a/config.toml
+++ b/config.toml
@@ -12,9 +12,8 @@ build_search_index = true
 ignored_content = ["*.kate-swp"]
 
 taxonomies = [
-    { name = "tags", feed = true},
-    { name = "categorie", feed = true},
-    { name = "type", feed = false},
+    { name = "Dossier", feed = true, paginate_by = 9},
+    { name = "Tag", feed = true, paginate_by = 9},
 ]
 
 [markdown]
@@ -25,3 +24,7 @@ highlight_code = true
 
 [extra]
 # Put all your custom variables here
+friend_sites = [
+    { name = "chosto", url = "https://blog.chosto.me" },
+    { name = "deuxfleurs", url = "https://plume.deuxfleurs.fr/" },
+]
diff --git a/content/blog/fifth.md b/content/blog/fifth.md
index 75aded6..5840d5a 100644
--- a/content/blog/fifth.md
+++ b/content/blog/fifth.md
@@ -2,12 +2,12 @@
 title = "My third post"
 date = 2012-11-28
 [taxonomies]
-tags = [
-    "rust",
+Tag = [
+    "Rust",
     "cirque"
 ]
-categorie = [
-    "rust"
+Dossier = [
+    "Rust"
     ]
 [extra]
 image="/img/lantern.png"
diff --git a/content/blog/first/index.md b/content/blog/first/index.md
index 502ef04..7e174c8 100644
--- a/content/blog/first/index.md
+++ b/content/blog/first/index.md
@@ -2,14 +2,14 @@
 title = "Fabriquer son vélo cargo"
 date = 2023-02-15
 [taxonomies]
-tags = [
+Tag = [
     "velo_cargo",
     "DIY",
-    "rust"
+    "Rust"
 ]
-categorie = [
+Dossier = [
     "Vélo-cargo",
-    "rust"
+    "Rust"
     ]
 [extra]
 image = "cover.jpg"
diff --git a/content/blog/fourth.md b/content/blog/fourth.md
index 75aded6..5840d5a 100644
--- a/content/blog/fourth.md
+++ b/content/blog/fourth.md
@@ -2,12 +2,12 @@
 title = "My third post"
 date = 2012-11-28
 [taxonomies]
-tags = [
-    "rust",
+Tag = [
+    "Rust",
     "cirque"
 ]
-categorie = [
-    "rust"
+Dossier = [
+    "Rust"
     ]
 [extra]
 image="/img/lantern.png"
diff --git a/content/blog/huit.md b/content/blog/huit.md
index 75aded6..5840d5a 100644
--- a/content/blog/huit.md
+++ b/content/blog/huit.md
@@ -2,12 +2,12 @@
 title = "My third post"
 date = 2012-11-28
 [taxonomies]
-tags = [
-    "rust",
+Tag = [
+    "Rust",
     "cirque"
 ]
-categorie = [
-    "rust"
+Dossier = [
+    "Rust"
     ]
 [extra]
 image="/img/lantern.png"
diff --git a/content/blog/neuf.md b/content/blog/neuf.md
index 75aded6..5840d5a 100644
--- a/content/blog/neuf.md
+++ b/content/blog/neuf.md
@@ -2,12 +2,12 @@
 title = "My third post"
 date = 2012-11-28
 [taxonomies]
-tags = [
-    "rust",
+Tag = [
+    "Rust",
     "cirque"
 ]
-categorie = [
-    "rust"
+Dossier = [
+    "Rust"
     ]
 [extra]
 image="/img/lantern.png"
diff --git a/content/blog/second.md b/content/blog/second.md
index 1f6e825..2bb0ad0 100644
--- a/content/blog/second.md
+++ b/content/blog/second.md
@@ -2,13 +2,13 @@
 title = "My second post"
 date = 2019-11-28
 [taxonomies]
-tags = [
-    "rust",
+Tag = [
+    "Rust",
     "cirque"
 ]
-categorie = [
+Dossier = [
     "Vélo-cargo",
-    "rust"
+    "Rust"
     ]
 [extra]
 image="placeholder.jpg"
diff --git a/content/blog/sept.md b/content/blog/sept.md
index 75aded6..5840d5a 100644
--- a/content/blog/sept.md
+++ b/content/blog/sept.md
@@ -2,12 +2,12 @@
 title = "My third post"
 date = 2012-11-28
 [taxonomies]
-tags = [
-    "rust",
+Tag = [
+    "Rust",
     "cirque"
 ]
-categorie = [
-    "rust"
+Dossier = [
+    "Rust"
     ]
 [extra]
 image="/img/lantern.png"
diff --git a/content/blog/sixth.md b/content/blog/sixth.md
index 75aded6..5840d5a 100644
--- a/content/blog/sixth.md
+++ b/content/blog/sixth.md
@@ -2,12 +2,12 @@
 title = "My third post"
 date = 2012-11-28
 [taxonomies]
-tags = [
-    "rust",
+Tag = [
+    "Rust",
     "cirque"
 ]
-categorie = [
-    "rust"
+Dossier = [
+    "Rust"
     ]
 [extra]
 image="/img/lantern.png"
diff --git a/content/notes/_index.md b/content/notes/_index.md
index b5598a5..8a003ee 100644
--- a/content/notes/_index.md
+++ b/content/notes/_index.md
@@ -1,9 +1,9 @@
 +++
 title = "List of notes posts"
 sort_by = "date"
-template = "index.html"
-page_template = "blog-page.html"
+template = "note.html"
+page_template = "note-page.html"
 
-paginate_by = 4
+paginate_by = 10
 
 +++
diff --git a/content/notes/fourth.md b/content/notes/fourth.md
index 75aded6..5840d5a 100644
--- a/content/notes/fourth.md
+++ b/content/notes/fourth.md
@@ -2,12 +2,12 @@
 title = "My third post"
 date = 2012-11-28
 [taxonomies]
-tags = [
-    "rust",
+Tag = [
+    "Rust",
     "cirque"
 ]
-categorie = [
-    "rust"
+Dossier = [
+    "Rust"
     ]
 [extra]
 image="/img/lantern.png"
diff --git a/content/notes/second.md b/content/notes/second.md
index 1f6e825..2bb0ad0 100644
--- a/content/notes/second.md
+++ b/content/notes/second.md
@@ -2,13 +2,13 @@
 title = "My second post"
 date = 2019-11-28
 [taxonomies]
-tags = [
-    "rust",
+Tag = [
+    "Rust",
     "cirque"
 ]
-categorie = [
+Dossier = [
     "Vélo-cargo",
-    "rust"
+    "Rust"
     ]
 [extra]
 image="placeholder.jpg"
diff --git a/content/notes/sept.md b/content/notes/sept.md
index 75aded6..5840d5a 100644
--- a/content/notes/sept.md
+++ b/content/notes/sept.md
@@ -2,12 +2,12 @@
 title = "My third post"
 date = 2012-11-28
 [taxonomies]
-tags = [
-    "rust",
+Tag = [
+    "Rust",
     "cirque"
 ]
-categorie = [
-    "rust"
+Dossier = [
+    "Rust"
     ]
 [extra]
 image="/img/lantern.png"
diff --git a/content/notes/sixth.md b/content/notes/sixth.md
index 75aded6..5840d5a 100644
--- a/content/notes/sixth.md
+++ b/content/notes/sixth.md
@@ -2,12 +2,12 @@
 title = "My third post"
 date = 2012-11-28
 [taxonomies]
-tags = [
-    "rust",
+Tag = [
+    "Rust",
     "cirque"
 ]
-categorie = [
-    "rust"
+Dossier = [
+    "Rust"
     ]
 [extra]
 image="/img/lantern.png"
diff --git a/content/notes/third.md b/content/notes/third.md
index e0fa7af..15c1743 100644
--- a/content/notes/third.md
+++ b/content/notes/third.md
@@ -2,12 +2,12 @@
 title = "My third post"
 date = 2023-04-28
 [taxonomies]
-tags = [
-    "rust",
+Tag = [
+    "Rust",
     "cirque"
 ]
-categorie = [
-    "rust"
+Dossier = [
+    "Rust"
     ]
 [extra]
 image="/img/lantern.png"
diff --git a/content/static/apropos.md b/content/static/apropos.md
index 47b1cc4..0936f3e 100644
--- a/content/static/apropos.md
+++ b/content/static/apropos.md
@@ -8,7 +8,7 @@ title = "D'où je parle"
 
 ## Pourquoi ce blog
 
-Convaincu par la philosophie des logiciels libres, je souhaite autant que possible partager mes expériences.
+Convaincu par la philosophie des logiciels libres, je souhaite autant que possible parTager mes expériences.
 Ce blog à pour vocation d'y contribuer en parlant d'un peu de tout et surtout du n'importe quoi. Ce blog comporte 
 une section **sites amis** parce que j'aime pouvoir naviguer sur internet sans utiliser un moteur de recherche.
 
diff --git a/static/custom.css b/static/custom.css
index 4f83293..2f689f2 100644
--- a/static/custom.css
+++ b/static/custom.css
@@ -72,8 +72,9 @@ box-shadow: 0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1);
 }
 
 @media screen and (max-width: 768px) {
-  .overlay {
-      background-image: linear-gradient(to bottom, rgba(190, 184, 184, 0), rgb(190, 184, 184));
+  .overlay {  
+      background-color: #eff5fb;
+      color: #296fa8;
       display: flex;
       justify-content: center;
       padding: 1em;
@@ -82,6 +83,9 @@ box-shadow: 0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1);
 
 .overlay:hover {
   box-shadow: 0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1);
+  background-color: #e6e9f7;
+  border-color: rgba(0,0,0,0);
+  color: #3850b7;
 }
 
 @media screen and (min-width: 769px) {
@@ -89,9 +93,10 @@ box-shadow: 0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1);
   display: flex;
   align-items: center;
   position: relative;
-  right: 11em;
+  right: 4.5em;
   border-radius: 0.25em;
   padding: 1em;
-  background-image: linear-gradient(to right, rgba(190, 184, 184, 0), rgb(190, 184, 184));
+  background-color: #eff1fa;
+  color: #3850b7;
   }  
 }
diff --git a/templates/base.html b/templates/base.html
index 725817a..80b3a3d 100644
--- a/templates/base.html
+++ b/templates/base.html
@@ -30,40 +30,21 @@
   </div>
 
   <div class="navbar-menu" id="navMenu">
-      <div class="navbar-item has-dropdown is-hoverable ">
-        <a class="navbar-link" >
-          Bricolage
-        </a>
-        <div class="navbar-dropdown">
-          <a class="navbar-item" href="{{ get_url(path="categorie/velo_cargo",
-    trailing_slash=false) }}">
-            Vélo cargo
-          </a>
-          <a class="navbar-item" href="{{ get_url(path="cirque_lumineux",
-    trailing_slash=false) }}">
-            Matériel de cirque lumineux
-          </a>
-        </div>
-      </div>
-        <div class="navbar-item has-dropdown is-hoverable">
+    {% for taxonomy in config.taxonomies%}
+    <div class="navbar-item has-dropdown is-hoverable">
             <a class="navbar-link">
-            Informatique
+            {{ taxonomy.name }}
             </a>
+            {% set tax = get_taxonomy(kind=taxonomy.name) %}
             <div class="navbar-dropdown">
-                <a class="navbar-item" href="{{ get_url(path="categorie/rust",
-    trailing_slash=false) }}">
-                    Rust
-                </a>
-                <a class="navbar-item" href="{{ get_url(path="categorie/arduino",
-    trailing_slash=false) }}">
-                    Arduino
+            {% for term in  tax.items %}
+                <a class="navbar-item" href="{{ term.permalink }}">
+                  {{ term.name }}
                 </a>
+            {% endfor %}
             </div>
-            <a class="navbar-item" href="{{ get_url(path="categorie/autre",
-    trailing_slash=false) }}">
-                Autre
-            </a>
-    </div>
+      </div>
+      {% endfor %}
 
     <div class="navbar-end">
       <div class="navbar-item">
@@ -77,9 +58,11 @@
         </a>
 
         <div class="navbar-dropdown">
-          <a class="navbar-item" href="https://blog.chosto.me">
-            Chosto
+         {% for site in config.extra.friend_sites %}
+          <a class="navbar-item" href="{{ site.url }}">
+            {{ site.name }}
           </a>
+          {% endfor %}
         </div>
       </div>
             <a class="navbar-item" href="https://yuno.oiseauroch.fr/gitea">
diff --git a/templates/blog-list.html b/templates/blog-list.html
index c8dc0ef..7ba910a 100644
--- a/templates/blog-list.html
+++ b/templates/blog-list.html
@@ -4,12 +4,12 @@
 {% block content %}
     <div class="columns is-multiline mt-6">
     {% for page in paginator.pages %}
-        {{ macro_card::create_card(link=page.permalink, img=page.extra.image, title=page.title, subtitle="la génèse", abstract=page.summary, tags=page.taxonomies.tags, date=page.date) }}
+        {{ macro_card::create_card(link=page.permalink, img=page.extra.image, title=page.title, subtitle="la génèse", abstract=page.summary, tags=page.taxonomies.Tag, date=page.date) }}
     {% endfor %}
     </div>
     
-<nav class="pagination is-rounded" role="navigation" aria-label="pagination">
-  <ul class="pagination-list" style="justify-content: center;">
+<nav class="pagination is-rounded is-centered" role="navigation" aria-label="pagination">
+  <ul class="pagination-list">
     {% if paginator.current_index > 2 %}
     <li><a href="{{ paginator.first }}" class="pagination-link" aria-label="Page 1">1</a></li>
     {% endif %}
diff --git a/templates/blog-page.html b/templates/blog-page.html
index 1d046fd..9a4a54d 100644
--- a/templates/blog-page.html
+++ b/templates/blog-page.html
@@ -1,11 +1,31 @@
 {% extends "base.html" %}
 
 {% block content %}
-<h1 class="title">
+
+{{ __tera_context }}
+
+<h1 class="title is-1">
   {{ page.title }}
 </h1>
 <p class="subtitle"><strong>{{ page.date }}</strong></p>
 <div class="content">
 {{ page.content | safe }}
 </div>
+
+<aside class="container level my-5">
+        <div class="level-left">
+          {% if page.higher %}
+          <div class="level-item">
+            <a class="button is-link is-light is-medium has-text-weight-bold" href="{{ page.higher.permalink }}">{{ page.higher.title }}</a>
+          </div>
+           {% endif %}
+        </div>
+        <div class="level-right">
+         {% if page.lower %}
+          <div class="level-item">
+            <a class="button is-link is-light is-medium has-text-weight-bold" href="{{ page.lower.permalink }}">{{ page.lower.title }}</a>
+          </div>
+           {% endif %}
+        </div>
+</aside>
 {% endblock content %}
diff --git a/templates/index.html b/templates/index.html
index 7fc35cd..39da7da 100644
--- a/templates/index.html
+++ b/templates/index.html
@@ -5,20 +5,18 @@
 {% block content %}
 
 
-      <div class="columns is-multiline mt-6">
+  <div class="columns is-multiline mt-6">
   {% set blog = get_section(path="blog/_index.md") %}
     {% for page in blog.pages %}
          {% if loop.index0 == 3 %}{% break %}{% endif %}
-        {{ macro_card::create_card(link=page.permalink, img=page.extra.image, title=page.title, subtitle="la génèse", abstract=page.summary, tags=page.taxonomies.tags, date=page.date) }}
+        {{ macro_card::create_card(link=page.permalink, img=page.extra.image, title=page.title, subtitle="la génèse", abstract=page.summary, tags=page.taxonomies.Tag, date=page.date) }}
                     
     {% endfor %}
     
-    <div class="plus-articles">
-      <a href="#" class="title is-4" style="width: 6em; text-align: center;">
-            Plus 
+    <a class="plus-articles button is-link is-light is-medium has-text-weight-bold" href="{{ blog.permalink }}">
+           Plus d'articles
             <i class="computer fas fa-chevron-right"></i>
-      </a>
-    </div>
+    </a>
     </div>
     
     <section class="section">
@@ -31,15 +29,14 @@
     {% for page in notes.pages %}
     <div class="column  is-one-fifth ">
          {% if loop.index0 == 5 %}{% break %}{% endif %}
-        {{ macro_media::create_media(link=page.permalink, img=page.extra.image, title=page.title, subtitle="la génèse", abstract=page.summary, tags=page.taxonomies.tags, date=page.date) }}
+        {{ macro_media::create_media(link=page.permalink, img=page.extra.image, title=page.title, subtitle="la génèse", abstract=page.summary, tags=page.taxonomies.Tag, date=page.date) }}
     </div>
     {% endfor %}
-    <div class="overlay">
-      <a href="#" class="title is-4" style="width: 6em; text-align: center;">
+     {% set notes = get_section(path="notes/_index.md") %}
+    <a class="overlay has-text-weight-bold" href="{{ notes.permalink }} ">
             Plus 
-            <i class="computer fas fa-chevron-right"></i>
+            <i class="computer fas fa-chevron-right" style="padding: 0.25em;"></i>
       </a>
-    </div>
   </div>
   </section>
 
diff --git a/templates/macros/card.html b/templates/macros/card.html
index 65c7ca0..5f4e76a 100644
--- a/templates/macros/card.html
+++ b/templates/macros/card.html
@@ -2,21 +2,11 @@
         <div class="column is-one-third">
             <div class="card has-equal-height">
             <a href="{{ link | safe }}"  style="height:100%">
-<!--                <div class="card-image" >
-                    <figure class="image is-3by2">
-                        {% if img is not starting_with("/") %}
-                        <img src={{ link }}{{ img }} alt="Placeholder image">
-                        {% endif %}
-                        {% if img isstarting_with("/") %}
-                        <img src="{{ get_url(path=img, trailing_slash=false) }}" alt="Placeholder image">
-                        {% endif %}
-                    </figure>
-                </div>-->
                 <div class="card-content" style="height:100%">
                         <div class="title is-3 has-text-centered">{{ title }}</div>
                         <div class="title is-5 has-text-centered">{{ subtitle }}</div>
                     <div class="media">
-                        <div class="content">
+                        <div class="content" style="width:100%;">
                             <hr/>
                             {{ abstract | markdown | safe }}
                         </div>
@@ -26,7 +16,7 @@
                 <footer class="card-footer">
                     <div  class="card-footer-item">
                     {% for tag in tags %}
-                        <a class="button is-small is-info is-light is-rounded" href="{{ get_url(path="tags/")  }}/{{ tag }}"> {{ tag }}</a>
+                        <a class="button is-small is-info is-light is-rounded mx-1" href="{{ get_url(path="tags/")  }}/{{ tag }}"> {{ tag }}</a>
                       {% endfor %}
                     </div>
                     <div class="card-footer-item">
diff --git a/templates/note-page.html b/templates/note-page.html
new file mode 100644
index 0000000..9a4a54d
--- /dev/null
+++ b/templates/note-page.html
@@ -0,0 +1,31 @@
+{% extends "base.html" %}
+
+{% block content %}
+
+{{ __tera_context }}
+
+<h1 class="title is-1">
+  {{ page.title }}
+</h1>
+<p class="subtitle"><strong>{{ page.date }}</strong></p>
+<div class="content">
+{{ page.content | safe }}
+</div>
+
+<aside class="container level my-5">
+        <div class="level-left">
+          {% if page.higher %}
+          <div class="level-item">
+            <a class="button is-link is-light is-medium has-text-weight-bold" href="{{ page.higher.permalink }}">{{ page.higher.title }}</a>
+          </div>
+           {% endif %}
+        </div>
+        <div class="level-right">
+         {% if page.lower %}
+          <div class="level-item">
+            <a class="button is-link is-light is-medium has-text-weight-bold" href="{{ page.lower.permalink }}">{{ page.lower.title }}</a>
+          </div>
+           {% endif %}
+        </div>
+</aside>
+{% endblock content %}
diff --git a/templates/note.html b/templates/note.html
new file mode 100644
index 0000000..f4dd328
--- /dev/null
+++ b/templates/note.html
@@ -0,0 +1,47 @@
+{% extends "base.html" %}
+{% import 'macros/card.html' as macro_card -%}
+
+{% block content %}
+    {% for page in paginator.pages %}
+<article class="media note p-4" >
+  <div class="media-content media-flex" style="overflow-y: clip;">
+        <a href="#" class="" style="width: 100%">
+          <h2 class="title is-2">{{ page.title }}</h2>
+          <h4 class="subtitle">{{ page.date }}</h4>
+          <div class="content has-text-justified">
+              {{ page.summary | markdown | safe }}
+          </div>
+        </a>
+        <div class="buttons mt-1">
+         {% for tag in page.taxonomies.Tag %}
+                        <a class="button is-small is-info is-light is-rounded" href="{{ get_url(path="Tag/")  }}/{{ tag }}"> {{ tag }}</a>
+        {% endfor %}</a>
+        </div>
+  </article>
+{% endfor %}
+    </div>
+    
+<nav class="pagination is-rounded is-centered" role="navigation" aria-label="pagination">
+  <ul class="pagination-list">
+    {% if paginator.current_index > 2 %}
+    <li><a href="{{ paginator.first }}" class="pagination-link" aria-label="Page 1">1</a></li>
+    {% endif %}
+    {% if paginator.current_index > 3 %}
+    <li><span class="pagination-ellipsis">&hellip;</span></li>
+    {% endif %}
+    {% if paginator.previous %}
+    <li><a class="pagination-link" href="{{ paginator.previous }}" aria-label="Page {{ paginator.current_index -1 }}">{{ paginator.current_index - 1 }}</a></li>
+    {% endif %}
+    <li><a class="pagination-link is-current" aria-label="Page {{ paginator.current_index }}" aria-current="page">{{ paginator.current_index }}</a></li>
+    {% if paginator.next %}
+    <li><a class="pagination-link" href="{{ paginator.next }}" aria-label="Page {{ paginator.current_index +1 }}">{{ paginator.current_index + 1 }}</a></li>
+    {% endif %}
+    {% if paginator.current_index + 2 < paginator.number_pagers %}
+    <li><span class="pagination-ellipsis">&hellip;</span></li>
+    {% endif %}
+    {% if paginator.current_index < paginator.number_pagers - 1 %}
+    <li><a  href="{{ paginator.last }}" class="pagination-link" aria-label="Page {{ paginator.number_pagers }}">{{ paginator.number_pagers }}</a></li>
+    {% endif %}
+  </ul>
+</nav>
+{% endblock content %}
diff --git a/templates/taxonomy_list.html b/templates/taxonomy_list.html
index 8aed481..3ce961d 100644
--- a/templates/taxonomy_list.html
+++ b/templates/taxonomy_list.html
@@ -3,13 +3,19 @@
 
 {% block content %}
 
-  {% for taxo in terms %}
-    <div class="columns is-vcentered mt-6">
-    {{ macro_card::create_card_tag(link=current_url, title=taxo.name) }}
+
+    {% for taxo in terms %}
+  <div class="columns is-multiline mt-6">
+    <a class="plus-articles button is-link is-light is-medium has-text-weight-bold" href="{{ taxo.permalink }}">
+           {{ taxo.name }}
+            <i class="computer fas fa-chevron-right mx-2" ></i>
+    </a>
     {% for page in taxo.pages %}
-         {{ macro_card::create_card(link=page.permalink, img=page.extra.image, title=page.title, subtitle="la génèse", abstract=page.summary, tags=page.taxonomies.tags, date=page.date) }}
-        {% endfor %}
-      </div>
- {% endfor %}
+         {% if loop.index0 == 3 %}{% break %}{% endif %}
+        {{ macro_card::create_card(link=page.permalink, img=page.extra.image, title=page.title, subtitle="la génèse", abstract=page.summary, tags=page.taxonomies.Tag, date=page.date) }}
+                    
+    {% endfor %}
+    </div>
+    {% endfor %} 
 {% endblock content %}
     
diff --git a/templates/taxonomy_single.html b/templates/taxonomy_single.html
index 5b2d91f..6fecca3 100644
--- a/templates/taxonomy_single.html
+++ b/templates/taxonomy_single.html
@@ -1,26 +1,37 @@
 {% extends "base.html" %}
 {% import 'macros/card.html' as macro_card -%}
 
-
 {% block content %}
-<div class="container mt-6">
-
-        <div class="column is-full">
-        <div class="card">
-                <div class="card-content" >
-                    <div class="media">
-                     <div class="title is-3 has-text-centered">{{ term.name }}</div>
-                    </div>
-                </div>
-            </div>
-        </div>
-
     <div class="columns is-multiline mt-6">
+        <div class="plus-articles button is-link is-light is-medium has-text-weight-bold">
+           {{ term.name }}
+    </div>
+    {% for page in paginator.pages %}
+        {{ macro_card::create_card(link=page.permalink, img=page.extra.image, title=page.title, subtitle="la génèse", abstract=page.summary, tags=page.taxonomies.Tag, date=page.date) }}
+    {% endfor %}
+    </div>
     
-  {% for page in term.pages %}
-  
-      {{ macro_card::create_card(link=page.permalink, img=page.extra.image, title=page.title, subtitle="la génèse", abstract=page.summary, tags=page.taxonomies.tags, date=page.date) }}
-                   
-  {% endfor %}
-  </div>
+<nav class="pagination is-rounded is-centered" role="navigation" aria-label="pagination">
+  <ul class="pagination-list">
+    {% if paginator.current_index > 2 %}
+    <li><a href="{{ paginator.first }}" class="pagination-link" aria-label="Page 1">1</a></li>
+    {% endif %}
+    {% if paginator.current_index > 3 %}
+    <li><span class="pagination-ellipsis">&hellip;</span></li>
+    {% endif %}
+    {% if paginator.previous %}
+    <li><a class="pagination-link" href="{{ paginator.previous }}" aria-label="Page {{ paginator.current_index -1 }}">{{ paginator.current_index - 1 }}</a></li>
+    {% endif %}
+    <li><a class="pagination-link is-current" aria-label="Page {{ paginator.current_index }}" aria-current="page">{{ paginator.current_index }}</a></li>
+    {% if paginator.next %}
+    <li><a class="pagination-link" href="{{ paginator.next }}" aria-label="Page {{ paginator.current_index +1 }}">{{ paginator.current_index + 1 }}</a></li>
+    {% endif %}
+    {% if paginator.current_index + 2 < paginator.number_pagers %}
+    <li><span class="pagination-ellipsis">&hellip;</span></li>
+    {% endif %}
+    {% if paginator.current_index < paginator.number_pagers - 1 %}
+    <li><a  href="{{ paginator.last }}" class="pagination-link" aria-label="Page {{ paginator.number_pagers }}">{{ paginator.number_pagers }}</a></li>
+    {% endif %}
+  </ul>
+</nav>
 {% endblock content %}