La funcionalidad de content pages permite desplegar contenido en solo un par de clicks sin prácticamente hacer código adicional. Esta poderosa herramienta nos permite desplegar datos, crear rutas y hasta clasificar automáticamente información.
Esta nueva herramienta nos da una gran flexibilidad para modificar el Look and feel de nuestros sitios web e incluso realizar procesos avanzados en la información que se despliega, por ejemplo filtrados y orden de acuerdo a categorías personalizadas.
Ordenar registros eso es un proceso común y valioso para los usuarios por qué les permite conocer cuáles son los registros más recientes o destacar información de forma automática, por eso vamos a aprender tres formas diferentes de organizar las entradas de un content page.
Todas las propiedades que usamos aquí - y muchas más - están disponibles en el menu "Entry Attributes" de tu Content Page.
Vamos a partir acá utilizando el código que se genera automáticamente en la plantilla index al momento de crear un content page :
Cómo podemos ver acá tenemos un valor llamado “entries” qué contiene un Array o lista que contiene todos las entradas definidas al momento de crear el content page.
Para ordenar una lista específico debemos asignarlo una nueva variable lo que significa que tenemos que realizar dos cambios mínimos en el código. El primero es crear donde se almacenarán ordenados de esta forma:
Ahora en esta variable se encuentra en todos los registros ordenados y necesitamos desplegarlos dentro del html
El siguiente paso es actualizar el bucle para que utilice esta nueva variable
¡Eso es todo! ahora se va a desplegar la información ordenada por fecha de publicación
En este caso es exactamente el mismo código solo se reemplaza el valor de “sort_by” a "updated_at"
Aprovechemos para examinar los campos, sort_by es un filtro de orden y tiene dos valores, el primero es el criterio de selección, el segundo el orden, que puede ser ascendente o descendente
Ahora que ya conocemos el código y la sintaxis, esta ultima opción es la más sencilla de aprender, solo se necesita cambiar la propiedad de orden por “name”
Conclusión
Los Content Pages son rápidos y fáciles de usar, pero con solo un par de lineas extra de código puedes llevarlos al siguiente nivel y personalizar la experiencia.
Puedes encontrar más información acerca de la sintaxis de Liquid en la documentación de Modyo
Photo by Andre-taissin via unsplash
Carlos Solís
Descubre cómo Domain Driven Design te permite construir aplicaciones que se alinean perfectamente con tu negocio. Aplica DDD en arquitecturas de microservicios y micro frontends para crear soluciones más escalables y adaptables, aprovechando el potencial de Modyo.
Carlos Solís
La depuración es una parte esencial del desarrollo de software. Nos permite identificar y corregir errores, optimizando el rendimiento y la estabilidad de nuestras aplicaciones
Carlos Solís
Optimizar imágenes es esencial para cualquier sitio web, sobre todo si buscas que cargue rápido y ofrezca una buena experiencia de usuario