diff --git a/config.toml b/config.toml index 37f488123..66f94b4fc 100644 --- a/config.toml +++ b/config.toml @@ -109,6 +109,10 @@ footnote_backlinks = false # Can be set at page or section levels, following the hierarchy: page > section > config. See: https://welpo.github.io/tabi/blog/mastering-tabi-settings/#settings-hierarchy katex = false +# Show links to previous and next articles at the bottom of posts. +# Can be set at page or section levels, following the hierarchy: page > section > config. See: https://welpo.github.io/tabi/blog/mastering-tabi-settings/#settings-hierarchy +show_previous_next_article_links = false + # Quick navigation buttons. # Adds "go up" and "go to comments" buttons on the bottom right (hidden for mobile). # Can be set at page or section levels, following the hierarchy: page > section > config. See: https://welpo.github.io/tabi/blog/mastering-tabi-settings/#settings-hierarchy diff --git a/content/blog/_index.ca.md b/content/blog/_index.ca.md index 48a7546ad..319313910 100644 --- a/content/blog/_index.ca.md +++ b/content/blog/_index.ca.md @@ -8,4 +8,5 @@ insert_anchor_links = "left" [extra] social_media_card = "blog/social_cards/ca_blog.jpg" +show_previous_next_article_links = true +++ diff --git a/content/blog/_index.es.md b/content/blog/_index.es.md index a50c1c17c..366dc5293 100644 --- a/content/blog/_index.es.md +++ b/content/blog/_index.es.md @@ -8,4 +8,5 @@ insert_anchor_links = "left" [extra] social_media_card = "blog/social_cards/es_blog.jpg" +show_previous_next_article_links = true +++ diff --git a/content/blog/_index.md b/content/blog/_index.md index bfeaf54ba..6e4c2e95a 100644 --- a/content/blog/_index.md +++ b/content/blog/_index.md @@ -8,4 +8,5 @@ insert_anchor_links = "left" [extra] social_media_card = "blog/social_cards/blog.jpg" +show_previous_next_article_links = true +++ diff --git a/content/blog/mastering-tabi-settings/img/show_previous_next_article_links_dark.webp b/content/blog/mastering-tabi-settings/img/show_previous_next_article_links_dark.webp new file mode 100644 index 000000000..64cef44ff Binary files /dev/null and b/content/blog/mastering-tabi-settings/img/show_previous_next_article_links_dark.webp differ diff --git a/content/blog/mastering-tabi-settings/img/show_previous_next_article_links_light.webp b/content/blog/mastering-tabi-settings/img/show_previous_next_article_links_light.webp new file mode 100644 index 000000000..5a7debc0c Binary files /dev/null and b/content/blog/mastering-tabi-settings/img/show_previous_next_article_links_light.webp differ diff --git a/content/blog/mastering-tabi-settings/index.ca.md b/content/blog/mastering-tabi-settings/index.ca.md index 41f5850c3..6f9bb8f16 100644 --- a/content/blog/mastering-tabi-settings/index.ca.md +++ b/content/blog/mastering-tabi-settings/index.ca.md @@ -401,6 +401,18 @@ Activa l'índex de continguts just sota del títol i metadades de l'article amb Per saber més sobre com personalitzar-ho, consulta [la documentació sobre la Taula de continguts](/ca/blog/toc/). +### Enllaços als articles anterior i següent + +| Pàgina | Secció | `config.toml` | Segueix la jerarquia | Requereix JavaScript | +|:------:|:------:|:-------------:|:--------------------:|:--------------------:| +| ✅ | ✅ | ✅ | ✅ | ❌ | + +Mostra enllaços als articles anterior i següent a la part inferior dels posts. Es veu així: + +{{ dual_theme_image(light_src="blog/mastering-tabi-settings/img/show_previous_next_article_links_light.webp", dark_src="blog/mastering-tabi-settings/img/show_previous_next_article_links_dark.webp", alt="Enllaços als articles anterior i següent", full_width=true) }} + +Per activar aquesta funció, estableix `show_previous_next_article_links = true`. + ### Enllaços de retorn a les notes a peu de pàgina | Pàgina | Secció | `config.toml` | Segueix la jerarquia | Requereix JavaScript | diff --git a/content/blog/mastering-tabi-settings/index.es.md b/content/blog/mastering-tabi-settings/index.es.md index eb0c9eafa..f23d27e91 100644 --- a/content/blog/mastering-tabi-settings/index.es.md +++ b/content/blog/mastering-tabi-settings/index.es.md @@ -399,6 +399,18 @@ Habilita el índice de contenidos justo debajo del título y metadatos del artí Para saber más sobre cómo personalizarlo, consulta [la documentación sobre la Tabla de contenido](/es/blog/toc/). +### Enlace a los artículos anterior y siguiente + +| Página | Sección | `config.toml` | Sigue la jerarquía | Requiere JavaScript | +|:------:|:-------:|:-------------:|:------------------:|:-------------------:| +| ✅ | ✅ | ✅ | ✅ | ❌ | + +Muestra enlaces a los artículos anterior y siguiente en la parte inferior de los posts. Se ve así: + +{{ dual_theme_image(light_src="blog/mastering-tabi-settings/img/show_previous_next_article_links_light.webp", dark_src="blog/mastering-tabi-settings/img/show_previous_next_article_links_dark.webp", alt="Enlaces a los artículos anterior y siguiente", full_width=true) }} + +Para activar esta función, configura `show_previous_next_article_links = true`. + ### Enlaces de retorno en notas al pie | Página | Sección | `config.toml` | Sigue la jerarquía | Requiere JavaScript | diff --git a/content/blog/mastering-tabi-settings/index.md b/content/blog/mastering-tabi-settings/index.md index f5648e99e..18345e3f7 100644 --- a/content/blog/mastering-tabi-settings/index.md +++ b/content/blog/mastering-tabi-settings/index.md @@ -8,6 +8,7 @@ description = "Discover the many ways you can customise your tabi site." tags = ["showcase", "tutorial", "FAQ"] [extra] +show_previous_next_article_links = true footnote_backlinks = true quick_navigation_buttons = true social_media_card = "social_cards/blog_mastering_tabi_settings.jpg" @@ -403,6 +404,18 @@ Enable the table of contents right below the post's title and metadata with `toc Read more about the table of contents and how to customise it by reading [the docs](/blog/toc/). +### Previous and Next Article Links + +| Page | Section | `config.toml` | Follows Hierarchy | Requires JavaScript | +|:----:|:-------:|:-------------:|:-----------------:|:-------------------:| +| ✅ | ✅ | ✅ | ✅ | ❌ | + +Displays links to the previous and next articles at the bottom of posts. It looks like this: + +{{ dual_theme_image(light_src="blog/mastering-tabi-settings/img/show_previous_next_article_links_light.webp", dark_src="blog/mastering-tabi-settings/img/show_previous_next_article_links_dark.webp" alt="Previous and next article links", full_width=true) }} + +To activate this feature, set `show_previous_next_article_links = true`. + ### Footnote Backlinks | Page | Section | `config.toml` | Follows Hierarchy | Requires JavaScript | diff --git a/sass/parts/_misc.scss b/sass/parts/_misc.scss index 9add72f83..54e8a7d11 100644 --- a/sass/parts/_misc.scss +++ b/sass/parts/_misc.scss @@ -167,3 +167,28 @@ hr { details summary { cursor: pointer; } + +.article-navigation { + display: flex; + margin-top: 2rem; + border-top: var(--divider-color) solid 0.5px; + padding-top: 2rem; + + div:first-child { + flex: 1; + text-align: left; + } + + div:last-child { + flex: 1; + text-align: right; + } + + @media (max-width: 600px) { + flex-direction: column; + + div { + text-align: center !important; + } + } +} diff --git a/templates/page.html b/templates/page.html index a2045966c..6d50ae45c 100644 --- a/templates/page.html +++ b/templates/page.html @@ -22,6 +22,7 @@ "show_reading_time", "show_remote_changes", "toc", + "show_previous_next_article_links", ] %} @@ -129,6 +130,23 @@

TL;DR:

{{ throw(message="ERROR: Multiple comment systems have been enabled for the same page. Check your config.toml and individual page settings to ensure only one comment system is activated at a time.") }} {% endif %} + {% if macros_settings::evaluate_setting_priority(setting="show_previous_next_article_links", page=page, default_global_value=true) == "true" %} + {%- if page.lower or page.higher -%} + + {%- endif -%} + {%- endif -%} + {% if comment_system %} {% include "partials/comments.html" %} {% endif %} diff --git a/theme.toml b/theme.toml index d6762a7f8..28fa830f0 100644 --- a/theme.toml +++ b/theme.toml @@ -88,6 +88,10 @@ footnote_backlinks = false # Can be set at page or section levels, following the hierarchy: page > section > config. See: https://welpo.github.io/tabi/blog/mastering-tabi-settings/#settings-hierarchy katex = false +# Show links to previous and next articles at the bottom of posts. +# Can be set at page or section levels, following the hierarchy: page > section > config. See: https://welpo.github.io/tabi/blog/mastering-tabi-settings/#settings-hierarchy +show_previous_next_article_links = false + # Quick navigation buttons. # Adds "go up" and "go to comments" buttons on the bottom right (hidden for mobile). # Can be set at page or section levels, following the hierarchy: page > section > config. See: https://welpo.github.io/tabi/blog/mastering-tabi-settings/#settings-hierarchy