✨ feat(footer): add configurable footer menu (#197)

config.toml

@@ -154,7 +154,6 @@ menu = [
     { name = "archive", url = "archive", trailing_slash = true },
     { name = "tags", url = "tags", trailing_slash = true },
     { name = "projects", url = "projects", trailing_slash = true },
-    { name = "about", url = "about", trailing_slash = true },
 ]
 
 # The RSS icon will be shown if (1) it's enabled and (2) the following variable is set to true.
@@ -181,6 +180,13 @@ socials = [
     { name = "spotify", url = "https://open.spotify.com/artist/5Hv2bYBhMp1lUHFri06xkE", icon = "spotify" },
 ]
 
+# Extra menu to show on the footer, below socials section.
+footer_menu = [
+    {url = "about", name = "about", trailing_slash = true},
+    # {url = "privacy", name = "privacy", trailing_slash = true},
+    {url = "sitemap.xml", name = "sitemap", trailing_slash = false},
+]
+
 # Enable a copyright notice for the footer, shown between socials and the "Powered by" text.
 # You can use $CURRENT_YEAR to automatically insert the current year.
 # $SEPARATOR will be replaced by the `separator` variable.

content/blog/mastering-tabi-settings.ca.md

@@ -1,7 +1,7 @@
 +++
 title = "Domina la configuració de tabi: guia completa"
 date = 2023-09-18
-updated = 2023-09-29
+updated = 2023-10-05
 description = "Descobreix les múltiples maneres en què pots personalitzar tabi."
 
 [taxonomies]
@@ -458,7 +458,7 @@ Llegeix la [documentació](/ca/blog/comments/) per a més informació sobre els
 
 ### Anàlisi web
 
-| Pàgina | Secció  | `config.toml` | Segueix Jerarquia | Requereix JavaScript |
+| Pàgina | Secció  | `config.toml` | Segueix la jerarquia | Requereix JavaScript |
 |:------:|:-------:|:-------------:|:-----------------:|:--------------------:|
 |   ❌   |    ❌   |       ✅       |         ❌         |          ✅          |
 
@@ -513,19 +513,31 @@ Le icones provenen de Font Awesome. Per veure una llista de tots els icones disp
 
 ### Icona de feed
 
-| Pàgina | Secció  | `config.toml` | Respecta la jerarquia | Requereix JavaScript |
+| Pàgina | Secció  | `config.toml` | Segueix la jerarquia | Requereix JavaScript |
 |:------:|:-------:|:-------------:|:---------------------:|:-------------------:|
 |   ❌   |   ❌    |      ✅       |          ❌           |         ❌          |
 
 Pots afegir un enllaç al teu feed RSS/Atom al peu de pàgina amb `feed_icon = true`.
 
----
+#### Menú de peu de pàgina
 
-## Metadades
+| Pàgina | Secció  | `config.toml` | Segueix la jerarquia | Requereix JavaScript |
+|:------:|:-------:|:-------------:|:-----------------:|:--------------------:|
+|   ❌   |   ❌    |      ✅       |        ❌         |          ❌          |
+
+Pots afegir un menú al peu de pàgina amb `footer_menu`, que accepta una llista d'elements de menú. Per exemple:
+
+```toml
+footer_menu = [
+    {url = "about", name = "about", trailing_slash = true},
+    {url = "privacy", name = "privacy", trailing_slash = true},
+    {url = "sitemap.xml", name = "sitemap", trailing_slash = false},
+]
+```
 
 ### Copyright
 
-| Pàgina | Secció  | `config.toml` | Respecta la jerarquia | Requereix JavaScript |
+| Pàgina | Secció  | `config.toml` | Segueix la jerarquia | Requereix JavaScript |
 |:------:|:-------:|:-------------:|:---------------------:|:-------------------:|
 |   ❌   |   ❌    |      ✅       |          ❌           |         ❌          |
 
@@ -544,9 +556,13 @@ Si tens un lloc multilingüe i vols establir diferents notificacions de drets d'
 1. Configura `translate_copyright = true` a `config.toml`.
 2. Afegeix una clau `copyright` als arxius `i18n`. Consulta la [documentació](/ca/blog/faq-languages/#com-puc-personalitzar-o-sobreescriure-una-cadena-de-text-específica-al-meu-lloc-web).
 
+---
+
+## Metadades
+
 ### Temps de lectura
 
-| Pàgina | Secció  | `config.toml` | Respecta la jerarquia | Requereix JavaScript |
+| Pàgina | Secció  | `config.toml` | Segueix la jerarquia | Requereix JavaScript |
 |:------:|:-------:|:-------------:|:---------------------:|:-------------------:|
 |   ✅   |   ✅    |      ✅       |          ✅           |         ❌          |
 
@@ -558,7 +574,7 @@ Com que segueix [la jerarquia](#jerarquia-de-configuracio), pots activar-lo o de
 
 ### Format de data
 
-| Pàgina | Secció  | `config.toml` | Respecta la jerarquia | Requereix JavaScript |
+| Pàgina | Secció  | `config.toml` | Segueix la jerarquia | Requereix JavaScript |
 |:------:|:-------:|:-------------:|:---------------------:|:-------------------:|
 |   ❌   |   ❌    |      ✅       |          ❌           |         ❌          |
 
@@ -570,7 +586,7 @@ A Zola, la sintaxi per al format de temps està inspirada en strftime. Una refer
 
 ### Separador personalitzat
 
-| Pàgina | Secció  | `config.toml` | Respecta la jerarquia | Requereix JavaScript |
+| Pàgina | Secció  | `config.toml` | Segueix la jerarquia | Requereix JavaScript |
 |:------:|:-------:|:-------------:|:---------------------:|:-------------------:|
 |   ❌   |   ❌    |      ✅       |          ❌           |         ❌          |
 
@@ -580,7 +596,7 @@ El separador per defecte és un punt de llista (`•`), però pots canviar-lo co
 
 ### Ordre del títol
 
-| Pàgina | Secció  | `config.toml` | Respecta la jerarquia | Requereix JavaScript |
+| Pàgina | Secció  | `config.toml` | Segueix la jerarquia | Requereix JavaScript |
 |:------:|:-------:|:-------------:|:---------------------:|:-------------------:|
 |   ❌   |   ❌    |      ✅       |          ❌           |         ❌          |
 

content/blog/mastering-tabi-settings.es.md

@@ -1,7 +1,7 @@
 +++
 title = "Domina la configuración de tabi: guía completa"
 date = 2023-09-18
-updated = 2023-09-29
+updated = 2023-10-05
 description = "Descubre las múltiples maneras en que puedes personalizar tabi."
 
 [taxonomies]
@@ -487,7 +487,7 @@ self_hosted_url = ""
 
 ---
 
-## Iconos en el pie de página
+## Pie de página
 
 ### Iconos de redes sociales
 
@@ -517,9 +517,21 @@ Los iconos provienen de Font Awesome. Para ver una lista de todos los iconos dis
 
 Puedes añadir un enlace a tu feed RSS/Atom en el pie de página con `feed_icon = true`.
 
----
+### Menú de pie de página
 
-## Metadatos
+| Página | Sección | `config.toml` | Respeta jerarquía | Requiere JavaScript |
+|:------:|:-------:|:-------------:|:---------------:|:------------------:|
+|   ❌   |   ❌    |      ✅       |        ❌       |        ❌          |
+
+Puedes añadir un menú al pie de página con `footer_menu`, que acepta una lista de elementos de menú. Por ejemplo:
+
+```toml
+footer_menu = [
+    {url = "about", name = "about", trailing_slash = true},
+    {url = "privacy", name = "privacy", trailing_slash = true},
+    {url = "sitemap.xml", name = "sitemap", trailing_slash = false},
+]
+```
 
 ### Copyright
 
@@ -542,6 +554,10 @@ Si tienes un sitio multilingüe y deseas establecer diferentes notificaciones de
 1. Configura `translate_copyright = true` en `config.toml`.
 2. Añade una clave `copyright` a los archivos `i18n`. Consulta la [documentación](/es/blog/faq-languages/#cómo-personalizo-o-sobrescribo-una-cadena-de-texto-específica-en-mi-sitio-web).
 
+---
+
+## Metadatos
+
 ### Tiempo de lectura
 
 | Página | Sección | `config.toml` | Respeta jerarquía | Requiere JavaScript |

content/blog/mastering-tabi-settings.md

@@ -1,7 +1,7 @@
 +++
 title = "Mastering tabi Settings: A Comprehensive Guide"
 date = 2023-09-18
-updated = 2023-09-29
+updated = 2023-10-05
 description = "Discover the many ways you can customise your tabi site."
 
 [taxonomies]
@@ -491,7 +491,7 @@ self_hosted_url = ""
 
 ---
 
-## Footer Icons
+## Footer
 
 ### Social Media Icons
 
@@ -521,9 +521,21 @@ The icons are from Font Awesome. To see a list of all the available icons, take
 
 You can add a link to your RSS/Atom feed to the footer with `feed_icon = true`.
 
----
+### Footer Menu
 
-## Metadata
+| Page | Section | `config.toml` | Follows Hierarchy | Requires JavaScript |
+|:----:|:-------:|:-------------:|:-----------------:|:-------------------:|
+|  ❌  |   ❌    |      ✅       |         ❌        |         ❌          |
+
+You can add a menu to the footer with `footer_menu`, which takes a list of menu items. For example:
+
+```toml
+footer_menu = [
+    {url = "about", name = "about", trailing_slash = true},
+    {url = "privacy", name = "privacy", trailing_slash = true},
+    {url = "sitemap.xml", name = "sitemap", trailing_slash = false},
+]
+```
 
 ### Copyright
 
@@ -546,6 +558,10 @@ If you have a multilingual site and want to set different copyright notices for
 1. Set `translate_copyright = true` in `config.toml`.
 2. Add a `copyright` key to the `i18n` files. See the [documentation](/blog/faq-languages/#how-do-i-customise-or-override-a-specific-text-string-on-my-website).
 
+---
+
+## Metadata
+
 ### Reading Time
 
 | Page | Section | `config.toml` | Follows Hierarchy | Requires JavaScript |

i18n/ca.toml

@@ -3,12 +3,15 @@ date_locale = "ca_ES"
 full_stop ="."  # Used at the end of a sentence.
 
 # Menu items.
-# Should match the names in config.extra.menu
+# Should match the names in config.extra.menu and config.extra.footer_menu.
 blog = "blog"
 archive = "arxiu"
 tags = "etiquetes"
 projects = "projectes"
 about = "sobre mi"
+contact = "contacte"
+privacy = "política de privadesa"
+sitemap = "mapa del lloc"
 
 # Navigation.
 read_more = "Llegir més"

i18n/de.toml

@@ -7,12 +7,15 @@ date_locale = "de_DE"
 full_stop = "."  #  Used at the end of a sentence.
 
 # Menu items.
-# Should match the names in config.extra.menu
+# Should match the names in config.extra.menu and config.extra.footer_menu.
 blog = "blog"
 archive = "archiv"
 tags = "tags"
 projects = "projekte"
 about = "über"
+contact = "kontakt"
+privacy = "datenschutzrichtlinie"
+sitemap = "seitenübersicht"
 
 # Navigation.
 read_more = "Weiterlesen"

i18n/en.toml

@@ -3,12 +3,15 @@ date_locale = "en_GB"
 full_stop = "."  # Used at the end of a sentence.
 
 # Menu items.
-# Should match the names in config.extra.menu
+# Should match the names in config.extra.menu and config.extra.footer_menu.
 blog = "blog"
 archive = "archive"
 tags = "tags"
 projects = "projects"
 about = "about"
+contact = "contact"
+privacy = "privacy policy"
+sitemap = "sitemap"
 
 # Navigation.
 read_more = "Read more"

i18n/es.toml

@@ -3,12 +3,15 @@ date_locale = "es_ES"
 full_stop = "."  # Used at the end of a sentence.
 
 # Menu items.
-# Should match the names in config.extra.menu
+# Should match the names in config.extra.menu and config.extra.footer_menu.
 blog = "blog"
 archive = "archivo"
 tags = "etiquetas"
 projects = "proyectos"
 about = "sobre mí"
+contact = "contacto"
+privacy = "política de privacidad"
+sitemap = "mapa del sitio"
 
 # Navigation.
 read_more = "Leer más"

i18n/fr.toml

@@ -7,12 +7,15 @@ date_locale = "fr_FR"
 full_stop = "."  # Used at the end of a sentence.
 
 # Menu items.
-# Should match the names in config.extra.menu
+# Should match the names in config.extra.menu and config.extra.footer_menu.
 blog = "blog"
 archive = "archives"
 tags = "étiquettes"
 projects = "projets"
 about = "à propos"
+contact = "contact"
+privacy = "politique de confidentialité"
+sitemap = "plan du site"
 
 # Navigation.
 read_more = "Lire plus"

i18n/hi.toml

@@ -5,12 +5,15 @@ date_locale = "hi_IN"
 full_stop ="।"  # Used at the end of a sentence.
 
 # Menu items.
-# Should match the names in config.extra.menu
+# Should match the names in config.extra.menu and config.extra.footer_menu.
 blog = "ब्लॉग"
 archive = "संग्रह"
 tags = "टैग"
 projects = "परियोजनाएं"
 about = "बारे में"
+contact = "संपर्क"
+privacy = "गोपनीयता नीति"
+sitemap = "साइटमैप"
 
 # Navigation.
 read_more = "और पढ़ें"

i18n/it.toml

@@ -3,12 +3,15 @@ date_locale = "it_IT"
 full_stop = "."  # Used at the end of a sentence.
 
 # Menu items.
-# Should match the names in config.extra.menu.
+# Should match the names in config.extra.menu and config.extra.footer_menu.
 blog = "blog"
 archive = "archivio"
 tags = "tag"
 projects = "progetti"
 about = "chi sono"
+contact = "contatto"
+privacy = "politica sulla privacy"
+sitemap = "mappa del sito"
 
 # Navigation.
 read_more = "Leggi di più"

i18n/ja.toml

@@ -7,12 +7,15 @@ date_locale = "ja_JP"
 full_stop = "。"  # Used at the end of a sentence.
 
 # Menu items.
-# Should match the names in config.extra.menu
+# Should match the names in config.extra.menu and config.extra.footer_menu.
 blog = "ブログ"
 archive = "アーカイブ"
 tags = "タグ"
 projects = "プロジェクト"
 about = "自己紹介"
+contact = "お問い合わせ"
+privacy = "プライバシーポリシー"
+sitemap = "サイトマップ"
 
 # Navigation.
 read_more = "続きを読む"

i18n/ko.toml

@@ -7,12 +7,15 @@ date_locale = "ko_KR"
 full_stop = "."  # Used at the end of a sentence.
 
 # Menu items.
-# Should match the names in config.extra.menu
+# Should match the names in config.extra.menu and config.extra.footer_menu.
 blog = "블로그"
 archive = "아카이브"
 tags = "태그"
 projects = "프로젝트"
 about = "소개"
+contact = "연락처"
+privacy = "개인정보 처리방침"
+sitemap = "사이트맵"
 
 # Navigation.
 read_more = "더 읽기"

i18n/pt-PT.toml

@@ -3,12 +3,15 @@ date_locale = "pt_PT"
 full_stop = "."  # Used at the end of a sentence.
 
 # Menu items.
-# Should match the names in config.extra.menu
+# Should match the names in config.extra.menu and config.extra.footer_menu.
 blog = "blog"
 archive = "arquivo"
 tags = "etiquetas"
 projects = "projetos"
 about = "sobre"
+contact = "contacto"
+privacy = "política de privacidade"
+sitemap = "mapa do site"
 
 # Navigation.
 read_more = "Ler mais"

i18n/ru.toml

@@ -3,12 +3,15 @@ date_locale = "ru_RU"
 full-stop = "."  # Used at the end of a sentence.
 
 # Menu items.
-# Should match the names in config.extra.menu.
+# Should match the names in config.extra.menu and config.extra.footer_menu.
 blog = "блог"
 archive = "архив"
 tags = "теги"
 projects = "проекты"
 about = "обо мне"
+contact = "контакт"
+privacy = "политика конфиденциальности"
+sitemap = "карта сайта"
 
 # Navigation.
 read_more = "Читать далее"

i18n/uk.toml

@@ -7,12 +7,15 @@ date_locale = "uk_UA"
 full-stop = "."  # Used at the end of a sentence.
 
 # Menu items.
-# Should match the names in config.extra.menu
+# Should match the names in config.extra.menu and config.extra.footer_menu.
 blog = "блог"
 archive = "архів"
 tags = "теги"
 projects = "проєкти"
 about = "про мене"
+contact = "контакт"
+privacy = "політика конфіденційності"
+sitemap = "карта сайту"
 
 # Navigation.
 read_more = "Читати далі"

i18n/zh-Hans.toml

@@ -3,12 +3,15 @@ date_locale = "zh_CN"
 full_stop = "。"  # Used at the end of a sentence.
 
 # Menu items.
-# Should match the names in config.extra.menu.
+# Should match the names in config.extra.menu and config.extra.footer_menu.
 blog = "博客"
 archive = "归档"
 tags = "标签"
 projects = "项目"
 about = "关于"
+contact = "联系方式"  # Machine translated.
+privacy = "隐私政策"  # Machine translated.
+sitemap = "站点地图"  # Machine translated.
 
 # Navigation.
 read_more = "阅读全文"

i18n/zh-Hant.toml

@@ -3,12 +3,15 @@ date_locale = "zh_TW"
 full_stop = "。"  # Used at the end of a sentence.
 
 # Menu items.
-# Should match the names in config.extra.menu
+# Should match the names in config.extra.menu and config.extra.footer_menu.
 blog = "網誌"
 archive = "歸檔"
 tags = "標籤"
 projects = "專案"
 about = "關於"
+contact = "聯絡方式"  # Machine translated.
+privacy = "隱私政策"  # Machine translated.
+sitemap = "網站地圖"  # Machine translated.
 
 # Navigation.
 read_more = "閱讀全文"

sass/parts/_footer.scss

@@ -1,7 +1,14 @@
 footer {
     margin-top: auto;
     margin-bottom: 1.4rem;
+    color: var(--meta-color);
+    font-size: 0.88rem;
     font-family: var(--post-font-family);
+    text-align: center;
+
+    .nav-links {
+        color: var(--primary-color);
+    }
 }
 
 footer section {
@@ -68,13 +75,3 @@ footer nav {
         }
     }
 }
-
-.credits {
-    color: var(--meta-color);
-    font-size: 0.88rem;
-    text-align: center;
-
-    p {
-        margin: 0;
-    }
-}

templates/partials/footer.html

@@ -58,6 +58,32 @@
                 </ul>
             {% endif %}
         </nav>
+
+        {# Footer menu #}
+        <nav class="nav-navs">
+            {%- if config.extra.footer_menu %}
+                <small>
+                    <ul>
+                        {% for menu in config.extra.footer_menu %}
+                        <li>
+                            {%- set trailing_slash = menu.trailing_slash | default(value=true) -%}
+
+                            {%- if menu.url == "sitemap.xml" -%}
+                                {%- set url = get_url(path=menu.url, trailing_slash=trailing_slash) -%}
+                            {%- else -%}
+                                {%- set url = get_url(path=menu.url, lang=lang, trailing_slash=trailing_slash) -%}
+                            {%- endif -%}
+
+                            <a class="nav-links no-hover-padding" href="{{ url }}">
+                                {{ macros_translate::translate(key=menu.name, default=menu.name, language_strings=language_strings) }}
+                            </a>
+                        </li>
+                    {% endfor %}
+                    </ul>
+                </small>
+        {% endif %}
+        </nav>
+
         <div class="credits">
             <small>
                 {# Shows optional Copyright notice #}

theme.toml

@@ -133,7 +133,6 @@ menu = [
     { name = "archive", url = "archive", trailing_slash = true },
     { name = "tags", url = "tags", trailing_slash = true },
     { name = "projects", url = "projects", trailing_slash = true },
-    { name = "about", url = "about", trailing_slash = true },
 ]
 
 # The RSS icon will be shown if (1) it's enabled and (2) the following variable is set to true.
@@ -160,6 +159,13 @@ encode_plaintext_email = true  # Setting is ignored if email is already encoded.
 #     { name = "spotify", url = "https://open.spotify.com/artist/5Hv2bYBhMp1lUHFri06xkE", icon = "spotify" },
 # ]
 
+# Extra menu to show on the footer, below socials section.
+# footer_menu = [
+#     {url = "about", name = "about", trailing_slash = true},
+#     {url = "privacy", name = "privacy", trailing_slash = true},
+#     {url = "sitemap.xml", name = "sitemap", trailing_slash = false},
+# ]
+
 # Enable a copyright notice for the footer, shown between socials and the "Powered by" text.
 # You can use $CURRENT_YEAR to automatically insert the current year.
 # $SEPARATOR will be replaced by the `separator` variable.