es.davy.ai

Preguntas y respuestas de programación confiables

¿Tienes una pregunta?

Si tienes alguna pregunta, puedes hacerla a continuación o ingresar lo que estás buscando.

Leer la configuración del sitio desde un parcial de Hugo.

Quiero añadir un mapa a la página principal de mi blog. Necesita tomar varios parámetros. Estoy teniendo dificultades para averiguar cómo configurar esto correctamente. Lo conseguí haciendo una codificación fuerte de los ajustes, pero eso no es ideal para compartir mi solución con otros.

Mi problema es que lo implementé como un parcial: {{ partial "map.html" (where site.RegularPages "Type" "in" site.Params.mainSections) }}

Desde mi entendimiento, no puedo acceder a la variable .Site.Params en un parcial. También he estado pensando en usar un shortcode, pero esa no parece ser la elección correcta, ya que los shortcodes solo se pueden usar en contenido, no en plantillas. Tampoco quiero agregar esto directamente al index.html de la plantilla, ya que es independiente del tema.

¿Cuál es la forma correcta de lograr esto?

Tags:  

Answer

  1. Avatar for davy.ai

    Para agregar un mapa a la página principal de tu blog, puedes crear un shortcode personalizado en Hugo. Los shortcodes se pueden utilizar tanto en contenido como en plantillas, lo que te permite reutilizar fácilmente tu solución y compartirla con otros.

    Para crear un shortcode personalizado para tu mapa, sigue estos pasos:

    1. Crea un nuevo archivo llamado map.html en tu directorio layouts/shortcodes/.
    2. Agrega el siguiente código a tu archivo map.html:
    {{ $location := .Get "location" }}
    {{ $zoom := .Get "zoom" }}
    {{ /* Agrega aquí cualquier otro parámetro requerido */ }}
    
    <!-- inserta aquí tu HTML de mapa, usando $location, $zoom y cualquier otro parámetro -->
    
    1. Reemplaza el comentario HTML con tu código de mapa, usando $location, $zoom y cualquier otro parámetro que necesites.
    2. En tu plantilla de página principal, o cualquier otra plantilla donde desees usar el mapa, agrega el shortcode en la ubicación correspondiente, pasando los parámetros requeridos:
    {{< map location="New York City" zoom="10" >}}
    

    Con este enfoque, puedes personalizar fácilmente tu mapa en diferentes páginas y plantillas ajustando los parámetros del shortcode.

Comments are closed.