Lo más destacado del complemento Divi: Divi – Módulo de blog filtrable

Módulos de blog filtrables en Divi Builder

Una vez que cargue y active el complemento, verá dos módulos agregados a Divi Builder. El módulo normal le permite personalizar las fuentes de las publicaciones destacadas y las publicaciones filtrables de forma independiente (lo que le permite anular los estilos de las publicaciones filtrables). La versión Lite elimina esta función, lo que reduce el tamaño de la plantilla y mejora el rendimiento.

Me gusta que los dos módulos estén incluidos. Tener ambos módulos le permite elegir entre características y velocidad. Estoy usando el módulo estándar en mis ejemplos.

La pestaña Contenido incluye:

• Diseño: incluye el diseño (ancho completo y mampostería), la ubicación del contenido, el espacio entre los elementos y la animación (atornillada o difuminada).
• Fondo
• Publicaciones destacadas
• Navegación por categorías
• Opciones de publicación: muestra los tipos de publicaciones para publicaciones o proyectos, incluye y excluye categorías y etiquetas, cuenta de publicaciones, opciones de orden y compensación. Al seleccionar etiquetas en lugar de categorías, puede usar el módulo prácticamente en el tipo de publicación personalizada.
• Elementos de contenido: ocultar contenido, color de fondo, mostrar como superposición, evento de superposición (pasar el cursor o hacer clic), mostrar imagen, mostrar encabezado, publicar etiqueta de encabezado, mostrar extracto, meta y leer más botón.
• Botón Paginación/Agregar más
• Configuración de superposición
• Configuración de la caja de luz
• Configuración de secuencias de comandos: origen de CDN y fuentes de audio/video.
• Animación de desplazamiento
• Etiqueta de administrador

La pestaña Diseño incluye:

• Configuración de sombra: sombra interna, sombra paralela
• Texto: color, fuentes independientes, orientación, sombra
• Imagen
• Texto de cabecera
• metatexto
• Texto del metaenlace
• Texto del contenido de la publicación
• Cuerpo de texto
• Texto de paginación
• Paginación Texto actual
• Texto de publicaciones filtrables de encabezado
• Texto de publicaciones metafiltrables
• Texto de publicaciones filtrables de metaenlace
• Publicar contenido Filtrable Publicaciones Texto
• Texto de publicaciones filtrables del cuerpo
• Publicaciones destacadas: botón Leer más
• Publicaciones filtrables: botón Leer más
• Añadir más botón
• Dimensionamiento
• Espaciado
• Borde
• Sombra de la caja
• filtros
• Animación

La pestaña Avanzado incluye:

• CSS: todas las características esperadas de CSS están aquí, pero incluye un cuadro de CSS para prácticamente todos los elementos que se pueden diseñar.
• Atributos: incluye el botón Leer más de las publicaciones destacadas, el botón Leer más de las publicaciones filtradas y la relación Agregar más botones
• Visibilidad

La mayoría de las características son intuitivas. Cada ajuste incluye una descripción detallada. Hay muchas configuraciones en la pestaña Diseño que tienen nombres similares y se agregan aún más si elige Fuentes independientes. Puede ser necesario experimentar para descubrir a qué se aplican algunos de ellos.

Configuración predeterminada del módulo de blog filtrable

Aquí hay un vistazo al módulo de blog filtrable usando la configuración predeterminada. Elegí algunas categorías específicas. Esas categorías se enumeran en el filtro en la parte superior de la sección del blog. Al hacer clic en una categoría, se filtran todas las demás.

Aquí está el módulo de blog filtrable usando el diseño de mampostería. De forma predeterminada, hemos agregado algunos elementos de diseño agradables, incluido el diseño de diseño, un botón de leer más con algunos estilos agregados, navegación posterior, borde, etc.

Ejemplos de módulos de blog filtrables

Esto es de ancho completo con el contenido debajo de la imagen.

Este usa Masonería con la distancia del artículo aumentada de 5 a 7, el número máximo de columnas cambiado a 5 y el número de palabras reducido a 20.

Este ejemplo oculta el contenido para que solo se muestre la imagen. Lo he configurado para mostrar 2 por columna. El filtro muestra texto en lugar de botones.

Este ejemplo establece las imágenes a la misma altura. Estoy usando la configuración predeterminada, pero puede establecer su propia altura de píxel si lo desea.

Este usa una superposición con texto iluminado. El texto se muestra al pasar el mouse y se puede desplazar.

Esto usa Lightbox. Las imágenes de las publicaciones del blog se abren en una caja de luz. Incluye un botón para leer más, el título de la imagen y flechas para navegar entre las publicaciones del blog. Agregué encabezado y texto de cierre, un color de fondo y coloqué la imagen sobre el texto.

Este establece la distancia del artículo en 0 para eliminar el espacio entre ellos. Configuré el tamaño de la imagen al mismo y lo configuré en 440 píxeles. Está usando una superposición de contenido y he diseñado el fondo.

Aquí he ajustado los colores del meta y el texto del contenido. Puede diseñar todo el texto de forma independiente.

Uso del módulo de blog filtrable para proyectos

El módulo también muestra los tipos de publicaciones del proyecto. Este ejemplo utiliza la página de cartera del paquete de diseño de Copywriter . Reemplacé la cartera con el módulo de blog filtrable. Estoy usando 3 columnas con el diseño de mampostería con una distancia de artículo de 30. Estoy ocultando el filtro de categoría, pero puedo ver una ventaja en usarlo para esto. Lo agregaremos nuevamente para nuestro ejemplo adicional .

Estoy mostrando el contenido como una superposición sobre un fondo oscuro con alrededor del 50 % de transparencia. Limité el contenido a 10 palabras y deshabilité toda la metainformación. Habilité el botón Agregar más y lo diseñé por separado del botón Leer más.

Este usa el módulo como un blog filtrable. He diseñado la lectura más y agregué más botones para que coincida con el estilo del diseño. He incluido un poco más del diseño para que puedas ver cómo se combina. Encaja perfectamente con el diseño.

Crear publicaciones destacadas con el módulo de blog filtrable

Una de las características más interesantes son las publicaciones destacadas. Esto crea un diseño estilo revista. Agregue los ID de la publicación separados por comas. Encontrarás el ID de la publicación en la barra de direcciones de la publicación en la pantalla de edición de la publicación (aparecerá post= y te dará el número). Puede ajustar la superposición de las publicaciones destacadas dentro de esta configuración.

Aquí está el resultado. Este usa el diseño de ancho completo, que muestra las publicaciones del blog debajo de las publicaciones destacadas en modo de ancho completo. Las publicaciones destacadas se muestran con una imagen grande y dos imágenes pequeñas para crear un diseño de revista.

Esta es la misma configuración con el diseño de mampostería. Podría haber deshabilitado el filtro si quisiera que las publicaciones destacadas y las publicaciones del blog se combinaran mejor. Otra cosa interesante es la capacidad de colocar otros diseños entre las publicaciones destacadas y las publicaciones del blog.

Agregue una ID de diseño para mostrar un diseño de mi Biblioteca Divi entre las publicaciones destacadas y las publicaciones del blog. Obtenga el ID del diseño de la Biblioteca Divi y péguelo en el campo denominado Mostrar diseño antes de las publicaciones filtrables.

Guardé una de las secciones del diseño de Copywriter en la biblioteca y luego agregué su ID para mostrar.

Uso del módulo de blog filtrable con extra

Funciona perfectamente con Extra. En este ejemplo, le di un poco más de estilo al ejemplo de Proyectos dentro del paquete de diseño de Copywriter. He diseñado el texto del encabezado, el texto del contenido, leí más texto, agregué más texto y el texto del filtro.

Este es el diseño de Publicaciones destacadas del ejemplo Divi anterior con un diseño de mampostería. Las imágenes de las publicaciones se ajustan automáticamente al diseño de Extra, que se puede ajustar manualmente dentro del módulo.

Licencia y Documentación

El complemento se puede instalar en sitios web ilimitados para usted y sus clientes. La documentación incluye tutoriales en vídeo , un artículo de blog .

Consulte el sitio web del desarrollador para obtener información de compra.

pensamientos finales

No tuve muchos puntos negativos al probar el complemento. Todo el estilo que quería estaba allí, pero parte de él era un poco difícil de encontrar. Por ejemplo, el estilo del filtro está etiquetado como Texto del cuerpo. Pude diseñar el texto del filtro, pero el etiquetado hizo que fuera difícil averiguar qué estaba diseñando.

Además, podría diseñar el texto del encabezado si habilité Fuentes independientes. Si lo deshabilité, el estilo todavía estaba allí, pero la función para cambiar el estilo estaba oculta. Una vez que descubrí esto, fue fácil diseñar cualquier cosa que quisiera. Me gustaría tener la posibilidad de cambiar Leer más y agregar más texto. Podía diseñar el botón pero no podía cambiar la redacción.

Divi: el módulo de blog filtrable agrega algunas características interesantes y crea muchas posibilidades de diseño de blog. Cree un diseño de revista, un feed de blog o un feed con cualquier tipo de publicación personalizada, y cada uno de ellos se puede filtrar. El botón Agregar más es una buena ventaja. Puede crear un diseño solo con este módulo e incluso puede hacer que muestre otros módulos dentro de su diseño.

Mis ejemplos recién comienzan con el estilo que puede hacer con este complemento. Si está interesado en agregar algunas características nuevas e interesantes a la fuente de su blog, Divi – Filterable Blog Module podría ser el complemento que está buscando.

Queremos escuchar de ti. ¿Has probado el módulo de blog filtrable? Háganos saber lo que piensa al respecto en los comentarios.

Imagen destacada a través de PODIS / shutterstock.com