Blog de noticias tipo Newspaper con Divi (paso a paso)

Si alguna vez te preguntaste cómo crear un blog de noticias estilo Newspaper con Divi, la respuesta casi siempre termina en el mismo lugar: necesitas módulos de blog más potentes que los que trae Divi por defecto. El módulo nativo está bien para un blog sencillo, pero cuando quieres replicar la densidad visual de un portal de noticias — varias columnas, carruseles, filtros por categoría, diseños mansory — te quedas corto rápidamente. Ahí entra el plugin Divi Blog Pro, la herramienta que uso en este tutorial para construir ese tipo de portal desde cero.

¿Por qué Divi Blog Pro y no el módulo nativo?

El módulo de blog nativo de Divi es funcional, pero limitado para un portal de noticias real. Solo te da dos o tres layouts básicos, sin soporte para Custom Post Types, sin filtros por categoría nativos y sin opciones de mansory o carrusel integradas. Si has intentado replicar la apariencia de un periódico digital con el módulo estándar, ya sabes que terminas parchando con CSS y shortcodes de terceros.

Divi Blog Pro, desarrollado por Divi People, resuelve eso con más de 8 módulos distintos especializados en visualización de posts. Cada módulo tiene entre 4 y 6 diseños visuales preconfigurados, y todos comparten las mismas opciones de control: mostrar u ocultar categorías, autor y fecha; configurar paginación en tres modos distintos (estándar, carga más, scroll infinito); y filtrar contenido por categorías con una barra interactiva. Si ya usas Divi y quieres armar algo que se vea como un portal de noticias de verdad, este plugin es el camino más directo. También lo puedes explorar junto a otras soluciones en el review completo de Divi Flash, otro plugin que extiende Divi con módulos avanzados.

Consejo: Divi Blog Pro soporta Custom Post Types, así que si en tu sitio tienes contenido estructurado más allá de los posts estándar (por ejemplo, un portafolio o eventos), puedes visualizarlo con los mismos módulos sin configuración adicional.

Qué necesitas preparar antes de empezar

Aquí es donde la mayoría comete el error de ir directo al diseño sin tener el contenido listo. Un portal de noticias con layout tipo Newspaper se ve vacío o roto con 5 o 10 posts. Para que los módulos rendericen bien, necesitas volumen y estructura.

El mínimo de contenido publicado

Mi recomendación es llegar al tutorial con al menos 50 artículos publicados. No es un número arbitrario: con menos de eso, los módulos de carrusel se repiten, la mansory queda desequilibrada y los filtros por categoría no tienen suficiente contenido para mostrar diferencias visibles. Además de la cantidad, cada post debe cumplir con:

• Imagen destacada asignada (sin imagen, el módulo muestra un espacio gris).
• Extracto definido manualmente (entre 20 y 40 palabras). Si dejas que WordPress genere el extracto automático, suele cortar en lugares incómodos.
• Título de menos de 80 caracteres para que no se corte en los módulos más compactos.
• Mínimo 400 palabras de contenido (para que el post valga el clic).
• Categoría asignada, siempre. Sin categoría, los filtros no funcionan.

Consejo: Dedica 30 minutos a revisar los posts más viejos antes de construir el layout. Elimina los que no tienen imagen destacada o tienen menos de 400 palabras — elevan la calidad promedio del portal y el resultado visual mejora notablemente.

Estructura de categorías pensada para la navegación

El filtro de categorías interactivo de Divi Blog Pro muestra todas las categorías asignadas a los posts que el módulo carga. Si tienes 15 categorías con 1 o 2 posts cada una, el resultado visual es un menú de filtros caótico. Lo ideal es trabajar con entre 5 y 8 categorías principales, con distribución pareja de contenido entre ellas.

Los módulos de Divi Blog Pro que más uso en este tipo de portal

Una vez instalado y activado el plugin, aparecen los módulos nuevos en el Divi Builder. Hay más de 8, pero en el tutorial me concentro en los que dan la apariencia tipo Newspaper de forma más directa.

Módulo de lista de posts inteligente

Este es el que más uso para la sección principal del portal — el equivalente de la "portada" de un diario. Muestra un post grande destacado junto a una lista de posts secundarios. El diseño ya viene balanceado, así que el trabajo visual es mínimo: elegir el número de posts, definir si muestras categoría y fecha, y elegir el layout.

Módulos de carrusel (4 diseños)

Los carruseles funcionan muy bien para secciones temáticas — una zona de "Últimas noticias de tecnología" o "Más leído esta semana". Divi Blog Pro trae 4 diseños distintos de carrusel, desde uno minimalista hasta uno con imagen de fondo grande. La navegación con flechas y dots ya viene configurada, igual que el autoplay. Si ya usaste alguna vez el slider de Divi Pixel para contenidos personalizados, la lógica es similar pero orientada 100% a posts de blog.

Layouts de mansory

Divi Blog Pro incluye dos diseños de mansory. El resultado visual es el más cercano al estilo de un periódico digital clásico: cards de distintos tamaños distribuidas en columnas. Ojo: en mobile, el mansory colapsa a una sola columna de forma automática. Si necesitas controlar el orden en que aparecen las cards en móvil, la guía sobre cómo cambiar el orden de columnas en móvil con Divi te ayuda a entender la lógica de reordenamiento.

🎓 ¿Quieres aprender a construir layouts de blog avanzados con Divi?
En uxdivi.com/cursos tenemos cursos donde cubrimos el flujo completo de diseño editorial con Divi 5, incluyendo cómo combinar módulos nativos y de terceros en un mismo layout. Accede como suscriptor y aplica lo aprendido en proyectos reales.

Cómo construir el portal sección por sección

El proceso en el Divi Builder es directo: activas el editor, agregas una sección y dentro de ella insertas los módulos de Divi Blog Pro como cualquier otro módulo de Divi. No hay configuración especial del plugin fuera del Builder.

La estructura de portal de noticias que armo en el video sigue esta lógica:

1. Sección hero — módulo de lista inteligente con 1 post destacado grande + 4 posts secundarios. Categoría y fecha visibles.
2. Sección de últimas noticias — módulo de grilla estándar con 6-9 posts, paginación tipo "carga más" para no romper el scroll.
3. Sección por categoría — módulo con filtro interactivo activo para que el lector filtre por tema.
4. Sección de carrusel — para darle movimiento a la parte inferior del portal, generalmente enfocada en contenido evergreen o más popular.

Cada sección usa fondo neutro diferente (blanco y gris muy claro alternados) para que el ojo perciba separación sin necesidad de separadores visuales ni border. Este truco de contraste sutil funciona muy bien en portales de noticias y evita que la página se sienta fragmentada.

🎓 ¿Quieres profundizar en diseño de blogs con Divi?
En el tutorial completo de cómo crear un blog con Divi cubro los fundamentos del módulo nativo, la estructura de secciones y los ajustes de tipografía editorial. Es el complemento ideal a este tutorial de Divi Blog Pro.

Errores comunes al armar un portal tipo Newspaper

Después de ver varios proyectos de estudiantes de la plataforma, los problemas que más se repiten son estos:

• Demasiadas categorías en el filtro. El filtro interactivo carga todas las categorías asignadas a los posts que el módulo muestra. Con 12 o 15 categorías, el filtro se convierte en un menú horizontal que se desborda en móvil. Solución: limitar las categorías visibles desde las opciones del módulo, o limpiar la taxonomía de categorías antes de construir.
• Imágenes sin relación de aspecto consistente. Si algunas imágenes destacadas son horizontales y otras verticales, la grilla queda irregular aunque uses el mismo módulo. Estandariza las imágenes en una relación 16:9 o 3:2 antes de construir el layout.
• Usar paginación estándar en la portada. En una portada de noticias, la paginación estándar (con números de página) rompe la experiencia. La opción "carga más" o scroll infinito es mucho más natural. Reserva la paginación estándar para páginas de archivo por categoría.
• No verificar en mobile antes de publicar. Los módulos de mansory y carrusel tienen comportamiento distinto en pantallas pequeñas. Siempre revisa en viewport de 375px y 768px antes de dar por terminado el diseño. Puedes apoyarte con las 9 herramientas para pruebas de diseño responsive que cubro en otro post.

Preguntas frecuentes sobre Divi Blog Pro y portales tipo Newspaper

¿Divi Blog Pro funciona con Divi 5?

Sí. Divi People actualizó el plugin para ser compatible con Divi 5 y su nuevo sistema de módulos. Los módulos aparecen en el panel del Divi Builder igual que cualquier módulo nativo. Si tienes Divi 4 activo, también funciona, pero en el tutorial usamos Divi 5.

¿Cuántos posts necesito para que el portal se vea bien desde el primer día?

Mi mínimo recomendado es 50 posts con imagen destacada y categoría asignada. Con menos, los módulos de carrusel y mansory se repiten y la portada se ve pobre. Si estás en proceso de poblar el sitio, puedes lanzar con una versión más simple del portal (solo grilla estándar) y activar los módulos avanzados cuando tengas el volumen adecuado.

¿Se puede usar Divi Blog Pro para mostrar Custom Post Types, no solo posts estándar?

Sí, es una de las ventajas del plugin sobre el módulo nativo de Divi. Puedes seleccionar el tipo de contenido que cada módulo muestra, incluyendo CPTs creados con plugins como Toolset, JetEngine o ACF. Esto lo hace útil para portales de noticias que mezclan distintos tipos de contenido editorial.

¿El layout descargable del tutorial es editable?

Sí. El layout que construyo en el video está disponible para descarga en la sección de miembros de UXDivi (justo debajo de este post). Lo puedes importar directamente al Divi Builder y modificar cada sección según las necesidades de tu proyecto.

Conclusión

Crear un portal de noticias tipo Newspaper con Divi es completamente viable cuando tienes el plugin correcto y el contenido preparado con el volumen y la estructura adecuados. Divi Blog Pro te da los módulos que el editor nativo no tiene — carruseles, mansory, filtros interactivos — y el proceso de construcción sección por sección dentro del Divi Builder es directo. Una vez que tengas el portal activo, el siguiente paso natural es optimizar el diseño para móvil y trabajar la velocidad de carga, ya que los portales de noticias con mucho contenido visual suelen ser exigentes en performance.

🎓 ¿Quieres construir sitios editoriales profesionales con Divi?
En uxdivi.com/cursos encuentras el catálogo completo de cursos donde cubrimos diseño editorial, módulos avanzados y flujos de trabajo reales con Divi 5. Accede como suscriptor y empieza a construir portales que se vean y funcionen como los de los medios profesionales.