Seleccionar página

El popular tema Divi, de Elegant Themes, incluye un constructor de páginas muy atractivo, que hace que la creación de diseños personalizados sea simple y fácil para cualquiera, incluso sin saber programación. Uno de los módulos más utilizados es un Blog incorporado para el constructor de Divi. Este módulo permite configurar rápidamente una buena página de blog en su sitio de WordPress con una lista de entradas predeterminada. Por desgracia, sólo tiene dos opciones de diseño: ancho completo o rejilla. Tampoco permite, por ejemplo, modificar la imagen destacada en el blog Divi.

¿Qué pasaría si queremos cambiar el tamaño de la imagen destacada en la lista de entradas del blog para que flote hacia la izquierda o la derecha en lugar de situarse por encima de ella ?

Afortunadamente podemos añadir unas funciones personalizadas, modificar algunos filtros y con un poco de CSS conseguiremos personalizar la lista de entradas del blog a nuestro gusto.

Modificar la imagen destacada en el blog Divi

Para crear el tamaño personalizado de la imagen destacada y poder usarlo en el módulo Blog de Divi, lo único que debemos hacer es añadir las siguientes líneas al functions.php:

Ahora WordPress personalizará el tamaño de todas las imágenes destacadas que se usen en el módulo Blog de Divi. Como podeís ver en las funciones anteriores, con solo cambiar los valores de ancho y alto podemos obtener el tamaño deseado para nuestras entradas del blog.

Dando estilo a la imagen destacada del blog Divi

Todo lo que queda hacer es definir los estilos de la imagen para que flote a la izquierda, colocando un margen del lado derecho (o viceversa). Debido a que Divi es un tema sensible, hemos optado por hacer esto en anchos que sean mayores de 768px (o sea descartando los móviles). Añadimos esto al código CSS personalizado (mejor si se coloca en un tema hijo, por aquello de no perder los cambios):

Con estas simples instrucciones CSS conseguimos que las entradas luzcan realmente bien, y con un poco de imaginación podemos conseguir diseños realmente chulos.

 

 

Título
Modificar la imagen destacada en el blog Divi
Título
Modificar la imagen destacada en el blog Divi
Descripción
Pequeños tips para modificar la imagen destacada en el blog Divi, colocándola a la izquierda o derecha y modificando su anchura y altura.
Autor

Pin It on Pinterest

Share This