Nuevas funciones: columnas de texto, cursores CSS, listas en texto enriquecido y más

Columnas de texto

Un patrón de diseño clave para cualquier maquetación editorial o estilo revista: las columnas de texto te permiten aprovechar el espacio horizontal sin perder legibilidad. Además, son justo lo que necesitas para trasladar un periódico a la web.

Lo mejor de todo es que solo necesitas un par de clics. Selecciona un bloque de texto o su elemento principal, abre el panel de Tipografía, activa las opciones avanzadas y elige cuántas columnas quieres.

Puedes meter casi cualquier cosa en las columnas, desde imágenes hasta formularios. Incluso puedes hacer que los encabezados ocupen varias columnas o que se ajusten dentro de la suya. Solo tienes que hacer clic en el icono del engranaje junto a los ajustes de columna en el panel de Tipografía avanzada.

El medianil (el espacio entre columnas) viene por defecto en 1 em, pero puedes personalizarlo en los ajustes de columna y añadir un borde entre ellas si buscas ese toque de periódico de toda la vida.

Para asegurarte de que el contenido se vea en una sola columna en dispositivos móviles, cambia a la vista móvil y escribe "Auto" en el cuadro de recuento de columnas.

Cursores CSS

En la web, los usuarios tienen mil formas de interactuar con tus sitios, y los cursores personalizados son una manera sencilla y eficaz de indicarles qué pueden hacer en cada momento. Por eso hemos añadido una buena variedad de cursores CSS. ¡Échales un vistazo!

Para elegir el cursor adecuado para un elemento, solo tienes que seleccionarlo e ir a la sección Cursor del panel de Estilo. Para verlo en acción, cambia al modo de vista previa o echa un vistazo a tu sitio publicado.

Listas ordenadas y desordenadas en elementos de Texto enriquecido

Webflow siempre ha sido compatible con listas ordenadas y desordenadas (<ol> y <ul>) en el Diseñador, pero el lanzamiento inicial del CMS no incluía esta compatibilidad.

Hoy nos alegra decir que eso ya es historia.

Ahora puedes crear listas ordenadas y desordenadas fácilmente en elementos de Texto enriquecido dentro del Diseñador, o pasarte al CMS para crearlas en campos de Texto enriquecido o en el Editor de páginas de tus sitios en vivo.

Puedes empezar cualquier tipo de lista haciendo clic en el botón correspondiente de la barra de herramientas Añadir. O simplemente escribe un guion, un asterisco o un número y pulsa la barra espaciadora. Para continuar la lista, pulsa Intro una vez; para terminarla y volver a escribir párrafos, púlsalo dos veces.

Si no quieres que empiece una lista (por ejemplo, si estás creando un encabezado que comienza con un número), simplemente pulsa Suprimir o Retroceso después de que Webflow inicie la lista.

Selector de fecha y hora

Hemos añadido un práctico selector al campo de fecha/hora en las colecciones, para que tú y tus editores de contenido ya no tengáis que escribir las fechas y horas manualmente.

Para usar el selector, solo tienes que hacer clic en el icono del calendario junto al campo de fecha/hora cuando estés creando un nuevo elemento de colección.

Nuevas opciones de filtrado para listas dinámicas

También hemos añadido tres formas nuevas de determinar qué aparece en tus listas dinámicas: filtrado por fecha relativa, rangos personalizados y filtrado por multirreferencia o enlaces.

Filtrado por fecha relativa

Ahora puedes filtrar listas dinámicas usando una fecha de inicio de "Hoy" (es decir, el día en que alguien las visualiza).

Esto te permite crear listas y páginas dinámicas que se actualizan automáticamente con el paso del tiempo. Así, puedes crear listas de eventos para "hoy" o "la próxima semana", o destacar tus artículos de blog más populares del "año pasado".

Y lo que es mejor, si filtras por campos automáticos como "creado el", tu lista dinámica se actualizará automáticamente a medida que tus clientes añadan o cambien elementos. Esto funciona como cabría esperar con los rangos y la paginación de listas dinámicas.

Nota: Los sitios web basados en CMS se almacenan en caché durante periodos de 12 horas, por lo que el contenido sensible a la fecha se actualizará dos veces al día.

Rangos personalizados para listas dinámicas

Ahora puedes filtrar listas dinámicas usando un rango que tú definas, en lugar de limitarte a un número determinado de elementos.

Esta nueva función se lleva de maravilla tanto con el filtrado como con la ordenación. Además, es genial para mostrar tus listas dinámicas exactamente como quieras.

También puedes crear tu propia paginación: simplemente configura una página para que empiece en el 1 y muestre 20 elementos, configura la segunda para que empiece en el 21 y muestre otros 20, y así sucesivamente. También puedes crear diseños únicos usando varias listas dinámicas con diferentes estilos para mostrar distintos elementos.

Filtrado por referencia múltiple o enlace

Imagina que tienes una colección llamada Artículos que incluye un campo de referencia múltiple con sus etiquetas. Con esta función, ahora puedes crear una página para cada etiqueta que enumere todos los artículos que la contienen.

También puedes incluir o excluir elementos que no tengan un valor en un campo de enlace.

Excluir la página actual de las listas dinámicas

Seguro que has visto que tus listas de "Publicaciones relacionadas" y similares muestran... la misma entrada que el usuario está leyendo en ese momento.

¡Pero eso se acabó! Ahora puedes filtrar una lista dinámica para excluir el elemento de la colección que el usuario está viendo.

En otras palabras, esa lista de "Publicaciones relacionadas" de tu blog ya no mostrará el artículo que alguien está leyendo, siempre y cuando configures el filtro como "no es" el elemento actual. Si quieres que aparezca, solo tienes que cambiar el menú desplegable a "es".

¿Qué funciones te gustaría ver próximamente?

Por supuesto, queda mucho más por llegar mientras seguimos desarrollando el CMS y añadiendo funciones más potentes al Diseñador. Si tienes alguna idea o necesidad, cuéntanoslo en nuestro foro!