Usando el Blog Module vs Divi 5's Loop Builder

El módulo de blog es el generador de alimentación incorporado de Divi que funciona fuera de la caja. Le brinda una forma rápida de enumerar publicaciones con alternancias para títulos, imágenes, extractos y metadatos.

El nuevo bucle de bucle de Divi 5 adopta un enfoque diferente. Diseñas el elemento con cualquier módulo, luego alimenta contenido dinámico. Ambas herramientas muestran contenido en bucle, pero cada una brilla en diferentes escenarios. Saber cuándo usar, lo que ahorra tiempo y evita la frustración. Comparemos los dos.

Suscríbete a nuestro canal de YouTube

Mini glosario

Este es un breve conjunto de términos para principiantes que son nuevos en el concepto de un constructor de bucle:

• Tipo de publicación personalizado (CPT): un tipo de contenido personalizado como productos o cursos. Se comporta como publicaciones, pero puede tener sus propios campos únicos.
• Campo personalizado: un campo que agrega a una publicación, página o CPT. Los ejemplos para un menú de alimentos pueden incluir precio, calificación, declaraciones de gluten/alergia y niveles de picante.
• Campo de repetidor: un campo que almacena una lista de elementos dentro de publicaciones individuales. Piense en sub-listas que podrían ser válidas para una pieza personalizada de contenido.
• Complementos de campo: ACF es la elección común, pero las vainas , meta box , ACPT y el conjunto de herramientas también funcionan.

Si se pierde en algunos de los detalles, consulte este glosario. Pero te simplificaremos en el camino.

Mostrando alimentos simples de publicación y publicación con el módulo de blog

El módulo de blog está creado para patrones de blog reconocibles. Asume elementos comunes y le permite alternar qué muestra, mantener la configuración rápida y las decisiones simples.

Piense en cómo funcionan las publicaciones de blog en WordPress. Cada publicación comparte ciertos elementos comunes que lo hacen reconocible como contenido de blog. Estas características compartidas incluyen:

1. 1. Post título
   2. Imagen destacada
   3. Publicar contenido
   4. URL Slug
   5. Autor
   6. Categorías
   7. y más

El módulo de blog fue diseñado con publicaciones tradicionales en mente. Los títulos te dicen lo que cubre la publicación. Las imágenes destacadas agregan dibujo visual. Extractos Vista previa del contenido. Los metadatos dicen quién lo escribió y cuándo.

El módulo de blog de Divi se sincroniza con estos elementos automáticamente. Lo dejas caer en la página y eliges qué mostrar. El feed aparece sin trabajo de consulta personalizada (a menos que desee limitar lo que se muestra, en cuyo caso hay herramientas de consulta incorporadas).

El enfoque de alternar hace que los cambios indoloros. Puede ocultar al autor pero mantener la fecha, mostrar la imagen o omitir el extracto. Pequeñas decisiones producen resultados rápidos.

Tipos de publicación personalizados: limitado pero funcional

El módulo de blog puede mostrar publicaciones normales y registrar correctamente los tipos de publicaciones personalizados.

El módulo de blog funciona bien cuando el CPT refleja los campos de publicación estándar. Se vuelve limitante cuando necesita datos personalizados verdaderos. Entonces, un miembro del equipo CPT funciona cuando las cosas se mantienen simples.

• El nombre se asigna al título.
• Un disparo en la cabeza/avatar se mapea a la imagen destacada.
• Un bio se asigna al contenido.

El módulo de blog maneja esta situación con facilidad.

Campos personalizados

Las limitaciones aparecen con cualquier campo que las publicaciones predeterminadas no compartan.

Los enlaces sociales, certificaciones o años de experiencia no aparecerán en el módulo de blog porque se creó para los campos estándar que se encuentran en las publicaciones de blog predeterminadas de WordPress. El módulo no tiene una palanca para esos campos personalizados.

Diseños personalizados

El control de diseño también está ligeramente limitado; El módulo incluye elementos dentro de una estructura fija en un orden fijo. No puede reordenar el título y la imagen a menos que use CSS personalizado. Puede administrar el diseño de cada tarjeta de blog a través de Flexbox o bloque, pero los elementos infantiles (las tarjetas) no tienen configuraciones de dimensionamiento para el control de FlexBox infantil (como el encogimiento para encajar o crecer para llenar).

El módulo de blog es excelente y rápido de usar para diseños de tarjetas estándar. Si obtiene un poco de error creativo, es posible que se encuentre buscando algo más personalizado.

Tipos de publicación personalizados + campos personalizados usando Loop Builder

Divi's Loop Builder le ofrece un enfoque diferente para mostrar contenido dinámico. En lugar de trabajar dentro de las restricciones de un solo módulo con elementos predeterminados, Loop Builder le permite construir su pantalla de contenido a partir de módulos DIVI individuales dispuestos exactamente mientras los imagina.

Usar el bucle de bucle requiere más pensamiento y preparación, pero no se limitará en las formas en que estaba con el módulo de blog. Con el módulo de blog, trabaja dentro de las limitaciones existentes y aprovecha lo mejor de las opciones predeterminadas. Con Loop Builder, comienza con un lienzo en blanco y construye exactamente lo que necesita utilizando cualquier combinación de módulos Divi.

Cómo funciona Loop Builder

Loop Builder no es un solo módulo. Es un contenedor con los módulos elegidos dentro de él. Cuando el contenedor está configurado en "Loop", se repite para cada resultado coincidente. Dentro del contenedor, puede colocar la imagen, el encabezado, el texto y los módulos de botones.

Vincula el contenido de cada uno de esos módulos al token correcto. La interfaz de usuario de Divi lo hace bastante simple. La imagen apunta a la imagen destacada. El encabezado apunta al título. El botón enlaza a la URL de publicación.

Este enfoque modular le brinda estructura y control de espaciado. Puedes poner imágenes arriba o junto a los títulos. También puede agregar dos bloques de texto para dos campos personalizados. De esta manera, puede construir la tarjeta que necesita, no una tarjeta preconfigurada a través de un módulo.

Ejemplos con tipos de publicaciones personalizados y campos personalizados

Hagamos esto concreto con un par de escenarios rápidos. Mantendremos el patrón e intercambiaremos los campos. Usemos el diseño de la tarjeta de nuestro ejemplo anterior y veamos cómo se puede adaptar utilizando tipos de publicación personalizados y campos personalizados.

Primero, cree un bucle personalizado para publicaciones de blog estándar. Use el 'tipo de publicación' de las publicaciones con los campos estándar para el título, la categoría, la fecha de publicación y la imagen de la función. Mapee cada uno al módulo respectivo en su diseño. Estos usan campos postales estándar, pero se organizan en un diseño único.

Podemos hacer algo similar para algunos listados de bienes raíces simples. Usando el mismo diseño de tarjeta, podemos llenar contenido de nuestro tipo de publicación personalizado con el encabezado asignado al título de propiedad, módulos de texto asignados a dormitorios, baños y descripción de la propiedad, y un botón vinculado a la URL de la lista de propiedades.

El resultado final se parece a nuestra tarjeta de blog, pero utiliza la capacidad del builder Loop Builder para asignar contenido de campos personalizados y tipos de publicaciones personalizadas.

Toda esta charla de CPTS, ¿cómo se hace? Advanced Custom Fields (ACF) es la elección de referencia aquí. Las vainas, meta box, ACPT y el conjunto de herramientas también crean campos que el bucle de bucle puede leer. Use lo que se ajusta a su presupuesto, experiencia y pila.

Una nota para los sitios web de bienes raíces : querrá usar un complemento dedicado que extraiga los listados de un IDX a WordPress como CPT. De esa manera, tiene datos nuevos y un trabajo manual mínimo (nadie quiere ingresar manualmente propiedades cada mañana).

Flexbox para diseños personalizados

Flexbox se combina naturalmente con el bucle de bucle. Puede usarlo en dos niveles para una estructura limpia y receptiva sin CSS personalizado.

Primero, diseñe el contenedor de bucle exterior . Seleccione el contenedor principal del bucle. Encienda el diseño flexible. Establezca la dirección para la fila. Habilitar envoltura si desea múltiples filas flexibles. Establezca la brecha para controlar el espacio entre los elementos. Luego, ajuste el tamaño del contenedor infantil donde se sienta su bucle usando las opciones de dimensionamiento. Puede crear un diseño receptivo y atractivo para sus elementos en bucle entre los controles flexibles del contenedor y los controles flexibles del niño.

En segundo lugar, diseñe el diseño de la tarjeta interna . Seleccione el contenedor raíz dentro del elemento de bucle (el módulo de columna o grupo, por ejemplo). En las opciones de diseño , establezca la dirección flexible para filmar si desea algunos elementos uno al lado del otro. Establezca el ancho del módulo de imagen para ocupar aproximadamente la mitad del espacio en el contenedor. Deje que el área de texto (en este caso, un contenedor grupal con varios módulos dentro) llene el resto (crece para completar las opciones de dimensionamiento del módulo de grupo).

Puede organizar los diversos contenedores o módulos como desee. No estás encerrado en un diseño preconfigurado. Aquí ponemos el título en el grupo izquierdo y configuramos el grupo derecho en la columna Flex. Esto nos da un cambio de diseño sutil pero único. Realmente no hay escasez de posibilidades.

Elegir la herramienta adecuada para su proyecto

Se trata menos de características en bruto y más de encontrar el ajuste correcto. Elija el camino más rápido que cumpla con el requisito. Cambiar herramientas cuando cambia la necesidad. A veces, el módulo de blog hará el truco, pero tienes un pivote fuerte con el bucle de bucle cuando no lo hace.

Cuando el módulo de blog es ideal

Alcance el módulo de blog cuando el contenido siga patrones de publicación estándar. Título, imagen destacada, extracto y meta básica son su punto óptimo. Los sitios de noticias básicos, las actualizaciones de la empresa y las carteras simples califican. Los visitantes esperan un diseño convencional, y es posible que desee una solución confiable con una configuración mínima.

Con el módulo de blog, puede enviar un feed de trabajo en minutos. Menos piezas móviles también significan menos posibilidades de romper las cosas (o confundirse).

Los usuarios no técnicos que aún podrían estar perdidos en el concepto de un "bucle" aún confiarán en gran medida en el módulo de blog. Es una gran herramienta y debe usarse absolutamente.

Cuando el constructor de bucle se vuelve esencial

Use Loop Builder cuando necesite campos que las publicaciones no tienen, o cuando la estructura de su tarjeta no coincida con un patrón de stock. El comercio electrónico, los bienes raíces y la educación son industrias típicas que tienden a necesitar más personalización. Cada uno necesita detalles que vivan en campos personalizados. Cuando trabaja con más contenido o más tipos de contenido, los diseños tienden a necesitar más flexibilidad.

Use el buque de bucle cuando las relaciones de contenido se vuelven complejas. Es posible que deba mezclar tipos de publicaciones en una vista y mostrar contenido de los repetidores.

Construya su propio diseño del módulo de blog con Divi 5

El módulo de blog de Divi sigue siendo la forma más rápida de enviar una alimentación estándar. The Loop Builder desbloquea tarjetas personalizadas, campos personalizados y repetidores. El bucle de bucle también se puede personalizar y moldear en el diseño y el diseño exactos que tiene en mente, mientras que el módulo de blog tiene algunas limitaciones allí.

La mejor parte de esta decisión es que puede mantener tanto en su kit de herramientas como elegir según el trabajo. Divi 5 se está uniendo y es más poderoso (y estable) que nunca. Si no lo ha usado, pruébelo en su próximo sitio web. La versión beta pública está a la vuelta de la esquina, y eso significa que los sitios Divi existentes están cerca de obtener el visto bueno para probar las migraciones de los sitios web existentes.

Descargar divi 5learn más sobre divi 5