feat: add indicator to external links (#443)

This commit is contained in:
Óscar 2025-02-15 09:34:54 +01:00 committed by GitHub
parent 036b11b7da
commit a5ab6259c6
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
8 changed files with 103 additions and 6 deletions

Binary file not shown.

After

Width:  |  Height:  |  Size: 27 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 29 KiB

View file

@ -1,7 +1,7 @@
+++
title = "Domina la configuració de tabi: guia completa"
date = 2023-09-18
updated = 2025-02-09
updated = 2025-02-15
description = "Descobreix les múltiples maneres en què pots personalitzar tabi."
[taxonomies]
@ -237,6 +237,25 @@ Fes clic a la imatge a continuació per comparar les fonts:
{{ image_toggler(default_src="blog/mastering-tabi-settings/img/serif.webp", toggled_src="blog/mastering-tabi-settings/img/sans-serif.webp", default_alt="Font serif", toggled_alt="Font sans-serif", full_width=true) }}
### Indicador d'enllaços externs
| Pàgina | Secció | `config.toml` | Segueix Jerarquia | Requereix JavaScript |
|:------:|:------:|:-------------:|:-----------------:|:-------------------:|
| ❌ | ❌ | ✅ | ❌ | ❌ |
{{ admonition(type="info", text="Requereix Zola 0.20.0 o posterior.") }}
Si vols afegir una icona als enllaços externs, configura la secció `[markdown]` (no `[extra]`) al teu `config.toml`:
```toml
[markdown]
external_links_class = "external"
```
Això afegirà una petita icona al costat dels enllaços externs:
{{ dual_theme_image(light_src="blog/mastering-tabi-settings/img/external_link_light.webp", dark_src="blog/mastering-tabi-settings/img/external_link_dark.webp", alt="Icona d'enllaç extern", full_width=true) }}
### Estils CSS personalitzats
| Pàgina | Secció | `config.toml` | Segueix la jerarquia | Requereix JavaScript |

View file

@ -1,7 +1,7 @@
+++
title = "Domina la configuración de tabi: guía completa"
date = 2023-09-18
updated = 2025-02-09
updated = 2025-02-15
description = "Descubre las múltiples maneras en que puedes personalizar tabi."
[taxonomies]
@ -238,6 +238,25 @@ Haz clic en la imagen para comparar las fuentes:
{{ image_toggler(default_src="blog/mastering-tabi-settings/img/serif.webp", toggled_src="blog/mastering-tabi-settings/img/sans-serif.webp", default_alt="Fuente serif", toggled_alt="Fuente sans-serif", full_width=true) }}
### Indicador de enlaces externos
| Página | Sección | `config.toml` | Sigue Jerarquía | Requiere JavaScript |
|:------:|:-------:|:-------------:|:----------------:|:------------------:|
| ❌ | ❌ | ✅ | ❌ | ❌ |
{{ admonition(type="info", text="Requiere Zola 0.20.0 o posterior.") }}
Si deseas añadir un icono a los enlaces externos, configura la sección `[markdown]` (no `[extra]`) en tu `config.toml`:
```toml
[markdown]
external_links_class = "external"
```
Esto añadirá un pequeño icono junto a los enlaces externos:
{{ dual_theme_image(light_src="blog/mastering-tabi-settings/img/external_link_light.webp", dark_src="blog/mastering-tabi-settings/img/external_link_dark.webp", alt="Icono de enlace externo", full_width=true) }}
### Estilos CSS personalizados
| Página | Sección | `config.toml` | Sigue la jerarquía | Requiere JavaScript |

View file

@ -1,7 +1,7 @@
+++
title = "Mastering tabi Settings: A Comprehensive Guide"
date = 2023-09-18
updated = 2025-02-09
updated = 2025-02-15
description = "Discover the many ways you can customise your tabi site."
[taxonomies]
@ -242,6 +242,25 @@ Click on the image below to compare the two looks:
{{ image_toggler(default_src="blog/mastering-tabi-settings/img/serif.webp", toggled_src="blog/mastering-tabi-settings/img/sans-serif.webp", default_alt="Serif font", toggled_alt="Sans-serif font", full_width=true) }}
### External Link Indicator
| Page | Section | `config.toml` | Follows Hierarchy | Requires JavaScript |
|:----:|:-------:|:-------------:|:-----------------:|:-------------------:|
| ❌ | ❌ | ✅ | ❌ | ❌ |
{{ admonition(type="info", text="Requires Zola 0.20.0 or later.") }}
If you'd like to add an icon to external links, configure the `[markdown]` (not `[extra]`) section in your `config.toml`:
```toml
[markdown]
external_links_class = "external"
```
This will add a small icon next to external links:
{{ dual_theme_image(light_src="blog/mastering-tabi-settings/img/external_link_light.webp", dark_src="blog/mastering-tabi-settings/img/external_link_dark.webp", alt="External link icon", full_width=true) }}
### Custom CSS
| Page | Section | `config.toml` | Follows Hierarchy | Requires JavaScript |