tarjeta
Ejemplo
usar
{{< cards >}}
{{< card link="../callout" title="Callout" icon="warning" >}}
{{< card link="/" title="No Icon" >}}
{{< /cards >}}{{< cards >}}
{{< card link="/" title="Image Card" image="https://source.unsplash.com/featured/800x600?landscape" subtitle="Unsplash Landscape" >}}
{{< card link="/" title="Local Image" image="/images/card-image-unprocessed.jpg" subtitle="Raw image under static directory." >}}
{{< card link="/" title="Local Image" image="images/space.jpg" subtitle="Image under assets directory, processed by Hugo." method="Resize" options="600x q80 webp" >}}
{{< /cards >}}Parámetros de la tarjeta
| Parameter | Description |
|---|---|
link |
URL (interna o externa) |
title |
título de la tarjeta |
subtitle |
Título del subtítulo (admite Markdown) |
icon |
El nombre del icono. |
Image Card
Además, la tarjeta admite la adición de imágenes y el procesamiento mediante los siguientes parámetros:
| Parameter | Description |
|---|---|
image |
Especifica la URL de la imagen de la tarjeta. |
method |
Establezca el método de procesamiento de imágenes de Hugo. |
options |
Configure las opciones de procesamiento de imágenes de Hugo. |
Las tarjetas admiten tres imágenes:
- Imagen remota: la URL completa debe colocarse en el parámetro de image.
- Imágenes estáticas: use rutas relativas en el directorio static/ de Hugo
- Imágenes procesadas: use rutas relativas en el directorio de assets/de Hugo
Hextra detecta automáticamente durante el proceso de construcción si la imagen necesita procesamiento y aplica el parámetro de opciones o la configuración predeterminada (escala, 800x, calidad 80, formato WebP) según sea necesario.
Actualmente admite los siguientes métodos de procesamiento: Cambiar tamaño, Ajustar, Rellenar y Recortar.
Para obtener más información sobre los comandos, métodos y opciones de procesamiento de imágenes integrados de Hugo, consulte su [Image Processing Documentation] (https://gohugo.io/content-management/image-processing/).