Tutorial Divi: Quitar borde y márgenes en el módulo blog estilo rejilla

Plantilla de entrada de blog Divi

¿Cómo hago que la cuadrícula del blog tenga la misma altura? Esta es una pregunta muy común para los usuarios de Divi configurar el módulo Blog. No hay otros tutoriales sobre esto, así que como siempre pensamos que deberíamos proporcionar una gran solución para esta necesidad. Así que en este tutorial, te mostraré cómo igualar la altura de la cuadrícula del módulo Blog Divi.

Antes de llegar al fragmento de código real, primero tenemos que ir al módulo Blog que queremos hacer igual altura y añadir una clase CSS personalizada. Esta clase CSS nos permitirá apuntar a cualquier módulo Blog en particular donde desea que el efecto de igualdad de altura a tener lugar, y no afectará a ningún otro. Para añadir esto, ve a la configuración del módulo Blog a la pestaña Avanzado y abre el selector ID y clases CSS. Allí debe añadir la clase “pa-blog-equal-height” al campo de entrada Clase CSS. Esta misma clase se utilizará en el siguiente fragmento de código para que coincida y vincule el código a este módulo.

Ahora llegamos a la gran parte del tutorial, el código que hace todo el trabajo. Esto es jQuery y a primera vista es un snippet más grande de lo normal, pero lo explicaré todo claramente más abajo. Por ahora, sigue adelante y añade el código a tu sitio web.

Más información

En este tutorial te mostraré como crear una hermosa caja de contenido usando los módulos Image y Blurb. Por supuesto, añadiremos varias animaciones al pasar el ratón por encima para que nuestro módulo sea más interactivo y llame más la atención. Esta sección es ideal para presentar servicios, productos, miembros del equipo y mucho más.

  Acelera la carga de tu web controlando lity-css GDPR Cookie Compliance

Suscríbete para descargar gratisÚnete a nuestro boletín y recibe recursos gratuitos, tutoriales, ofertas especiales y promociones directamente en tu buzón de correo. Lee nuestra Política de privacidad para saber cómo gestionamos y protegemos la información que nos envías.

Eso es todo y ¡gracias por su atención! Esta es la primera parte de la serie en la que te mostraré cómo se puede personalizar el módulo Blurb. Si te ha gustado este tutorial, házmelo saber en los comentarios.

Suscríbete para descargar gratisÚnete a nuestro boletín y recibe recursos gratuitos, tutoriales, ofertas especiales y promociones directamente en tu buzón de correo. Lee nuestra Política de privacidad para saber cómo gestionamos y protegemos la información que nos envías.

Maciej es el fundador y director general de B3 Multimedia Solutions. Es un diseñador web y experto en marketing hecho a sí mismo, y le gusta tanto su trabajo que apenas sale de la oficina. Transforma ideas creativas en estrategias eficaces para su empresa y sus clientes. A Maciej le fascina el fenómeno de las megalópolis. Se fija en los patrones y detalles que lo conforman todo, y utiliza estas habilidades en su trabajo.

12:06cómo cambiar el número de columnas en el módulo blog de divi pee-aye creativeyoutube – 7 jul 2020

– Añadida la función de Acceso Rápido que permite a los usuarios realizar y acceder a las acciones y ajustes del constructor respectivamente, desde un único punto de entrada. Este punto de entrada es un modal de búsqueda activado por un atajo de teclado: shift + espacio.

  Iphone blogging – navegador

– Actualización de seguridad importante. Tras una auditoría interna del código, se han introducido varias mejoras de seguridad y se han corregido varias vulnerabilidades de seguridad menores. Para más información, consulte la divulgación aquí: https://us7.campaign-archive.com/?u=9ae7aa91c578052b052b864d6&id=a9763c15f2

– Se ha corregido un error lógico en el sistema de compatibilidad con versiones anteriores para la configuración predeterminada de módulos de terceros que hacía que muchos módulos de terceros devolvieran valores vacíos, lo que provocaba módulos rotos en la interfaz.

– Actualización de la lógica de color del divisor automático de secciones adyacentes para que el color de reserva sólo aparezca si la sección anterior/siguiente es idéntica a la sección actual y la sección actual no tiene fondo de degradado, imagen o vídeo.

– Añadido el sistema de ayuda de Divi Builder. Ahora puedes ver videos de documentación y seguir más de 70 videos instructivos completos mientras construyes tu página, ¡sin salir del constructor!

15:48cómo hacer que la cuadrícula del blog de divi tenga la misma alturapee-aye creativeyoutube – 6 jul 2021

Tenemos una serie emocionante en el módulo Divi Blog, y esto será una gran adición. Este es un rápido fragmento de código CSS que cambia el módulo de blog Divi en una bonita lista con la imagen en el lado y los detalles en el otro lado. Te mostraré cómo tener la imagen a la izquierda o a la derecha. ¡Estoy muy entusiasmado con esto, porque es tan rápido y fácil, incluso para los principiantes!

Ir a la configuración del módulo Blog a la pestaña Diseño y establecer el diseño de ancho completo. No te preocupes si esto se ve mal. Necesitamos establecerlo de esta manera para hacer el siguiente paso mucho más fácil. Si lo mantuviéramos como un diseño de cuadrícula, sería mucho más difícil lograr el diseño deseado.

  ¡acabemos con los temas wordpress hinchados!

Con el fin de afectar sólo a determinados módulos Blog en el sitio, podemos utilizar una clase personalizada. Así que abre la configuración del módulo Divi Blog y ve a la pestaña Avanzado. A partir de ahí, abra el CSS ID y Classess alternar. Coloca la clase “pa-blog-list” en el campo de entrada CSS Class.

Básicamente, le estamos diciendo a la imagen que tenga sólo un 30% de ancho. Luego le decimos al título, meta y extracto que tengan un ancho del 70%. Al añadir un flotador a la izquierda en ellos, hace que se apilen uno al lado del otro. Esto es mejor que algunos de los otros tutoriales similares, ya que mantiene todo el texto en el lado en lugar de envolver alrededor de la imagen.