[Jefferson Maldonado]

¡Hola Maritzel!

Gracias por compartir todos los detalles y capturas, esto ayuda muchísimo

Parece que estás usando el módulo Filter Posts en la plantilla de archivo de especialistas, y en el constructor se ve bien, pero en el frontend no aparecen los select de filtro. Esto suele suceder por una de estas dos razones principales:

1. El filtro aplicado a un tipo de campo incompatible

El módulo Filter Posts funciona mejor cuando filtras contenido basado en taxonomías o campos seleccionables (checkbox, radio, select), no con campos de texto (como tus campos ACF “estado” o “país”). Si usas texto puro, aunque esté visible en el constructor, no se renderizará en el frontend.

Qué puedes hacer:

• Transforma “estado” y “país” a campos ACF de tipo Select o mejor aún, Taxonomías personalizadas. De esta forma el módulo sí mostrará los selects en el frontend.

• Otra opción es usar módulos como Search Posts o la lógica del Filter Posts combinada con taxonomías para mantener la funcionalidad AJAX.

2. Ubicación incorrecta del módulo de filtro

El módulo Filter Posts no debe ir dentro de un loop layout, sino directamente en la página de archivo que muestra el loop. Si lo colocas dentro del layout del loop (en la plantilla de single o layout guardado), en el constructor se ve, pero en el frontend no “conecta” correctamente con el loop principal.

Cómo verificarlo:

• 1. Crea una página en blanco (no loop).
• 2. Agrega una fila con dos columnas.
• 3. En la columna izquierda inserta el Filter Posts.
• 4. En la columna derecha inserta el Archive Loop apuntando a tu CPT “especialistas”.
• 5. En el módulo Filter Posts, asegúrate de seleccionarse el post type y los campos en “Filter Item” (como estado o país) y que coincidan con lo que está en el loop.
• 6. Guarda y mira el frontend: ahora deberían verse los select y funcionar sin problemas.

En resumen

• No funcionará con campos ACF de tipo texto: cambia a select o taxonomías.
• Coloca el filtro fuera del loop layout, directamente dentro de la página de archivo.
• Verifica que el módulo esté configurado para filtrar el tipo de contenido correcto.

Si adaptas los campos y la ubicación, verás que los filtros empiezan a funcionar bien y se muestran correctamente en el frontend.

Avísame si te funciona algo de esto o sigues presentando el problema.

Un abrazo,

Jefferson – UXDivi

[Jefferson Maldonado]

¡Hola Fernando!

Muchas gracias por tu mensaje y por tus palabras sobre el curso, nos alegra muchísimo que te haya resultado útil.

Sobre tu consulta: para gestionar la venta de entradas en un rango de fechas prolongado (como una piscina pública abierta varios días y con cierres semanales), The Events Calendar está más enfocado a eventos puntuales y no ofrece un sistema de reservas por días o franjas horarias de manera tan flexible.

Para tu caso, te recomiendo probar una solución basada en calendarios de reservas. Dos opciones muy buenas que suelen adaptarse a estas necesidades son Amelia Booking y Booknetic. Ambos plugins permiten configurar disponibilidad por días, cerrar fechas concretas (por ejemplo, los lunes) y gestionar reservas o ventas de entradas para cada día del periodo.

Si quieres explorar más a fondo Booknetic, tenemos un curso en la plataforma que te puede servir como guía para implementarlo: https://uxdivi.com/cursos-uxdivi/curso-de-reserva-de-citas-para-esteticas-barberias-o-spas

Y también dejamos por acá el curso de Amelia Booking que también es una alternativa interesante: https://uxdivi.com/cursos/curso-de-reservas-de-citas-medicas-con-amelia-booking-y-divi

Ambas alternativas, con un poco de personalización, van muy bien para proyectos como el que comentas. Si tienes alguna duda sobre cómo adaptarlo a tu web, aquí estoy para ayudarte.

¡Un saludo y mucho éxito con tu proyecto!

Jefferson – UXDivi

uxdivi.com

Curso de reserva de citas para Estéticas, Barberías o spas

Crea un sistema de reservas profesional para estéticas, barberías o spas con nuestro Curso de reserva de citas con Booknetic y Divi ✅

[Jefferson Maldonado]

Hola Malica, un gusto saludarte.

Ya hemos actualizado el plugin a su última versión.

Saludos.

[Jefferson Maldonado]

Hola Malica,

Gracias por escribirnos y lamento mucho la molestia que has experimentado al intentar acceder al curso. Quiero confirmarte que el problema con el acceso al Curso técnico de tienda online con WooCommerce y Divi ya fue resuelto y deberías poder ingresar sin inconvenientes desde tu cuenta.

Al suscribirte, también te enviamos un correo con todos los accesos, documentación útil e incluso un videotour para que puedas familiarizarte rápidamente con la plataforma. Si por algún motivo no recibiste este correo, revisa por favor tu carpeta de spam o promociones.

Valoramos mucho que nos señales las áreas de mejora en nuestro sistema de soporte y te pido disculpas por el tiempo que invertiste buscando ayuda. Estamos aquí para que tu experiencia sea la mejor posible, así que si tienes cualquier otra duda o necesitas apoyo con algún curso o funcionalidad, solo escríbenos y te ayudaremos con gusto.

¡Un saludo y bienvenida a UXDivi!

Jefferson – UXDivi

[Jefferson Maldonado]

Claro que si Guille, tienes esta que es la que nosotros usamos, con una opción gratuita bastante amplia: https://www.mailerlite.com/invite/935584c14d556

además, tienes acá un video donde mostramos como funciona: https://uxdivi.com/tutoriales-premium/como-integrar-el-modulo-optin-email-marketing-de-divi-con-mailerlite

mailerlite.com

Advanced Email Marketing Made Simple - MailerLite

You are invited to join MailerLite! Use this link and get $20 off your first payment. Read more how to claim your credit.

[Jefferson Maldonado]

Hola Simón,

Gracias por mostrarnos el problema en detalle. Las inconsistencias visuales entre navegadores suelen darse por cachés corruptas, ajustes regionales del navegador y ciertas configuraciones propias de Divi.

La forma más efectiva de resolverlo es así:

Primero, limpia todas las cachés: la caché del navegador (Chrome, Firefox, Safari), la de tu plugin de caché, la del CDN si usas, y sobre todo la caché estática de Divi desde Divi → Theme Options → Builder → Advanced → Clear Static CSS. Esto muchas veces soluciona las diferencias visuales más notorias. Lo vemos a detalle en esta guía: https://uxdivi.com/blog/guia-para-solucionar-los-problemas-mas-comunes-en-divi

Luego, configura presets para filas, columnas y módulos en Divi. Así te aseguras de aplicar mismos valores de ancho, padding y tipografía en todo el sitio, evitando inconsistencias entre Chrome, Firefox o Safari.

Finalmente, haz pruebas en distintos navegadores y móviles usando sus herramientas de desarrollador:

• En Firefox activa el modo responsive y ajusta según veas diferencias.
• En Chrome usa la emulación de dispositivos para detectar problemas de espaciado en móviles ().

En Resumen:

• Limpia cachés (navegador, WordPress, CDN, y CSS estático de Divi).
• Usa presets en Divi para mantener coherencia global.
• Verifica el frente en DevTools en varios navegadores y dispositivos.

Con esto conseguirás que tu sitio se vea igual en todos lados, sin tener que añadir códigos ni resets personalizados. Un abrazo,

Jefferson – UXDivi

uxdivi.com

Guía para solucionar los problemas más comunes en Divi

Con esta guía podrás solucionar todos los posibles problemas que tengas con Divi, descubre paso a paso como resolver cualquier problema Divi ✅

[Jefferson Maldonado]

Hola Simón

¡Muy buena pregunta! Para personalizar completamente el formulario de registro de WooCommerce (añadiendo campos como nombre, teléfono, género, fecha de nacimiento, dirección, nombre de usuario editable, validación clara, etc.), te recomiendo usar plugins especializados que ofrecen gran flexibilidad y control sin tener que tocar código.

1. Custom User Registration Fields for WooCommerce

Este plugin premium te permite agregar campos adicionales (texto, teléfono, fecha, selectores, comprobación de correo único, entre otros) al formulario de registro y al checkout. También los muestra en “Mi cuenta” y en los emails, con validación robusta y lógica condicional según rol o tipo de usuario. Muy efectivo para B2B o servicios. 

2. Ultimate Member (Community + Extension WooCommerce)

Es una solución freemium muy completa para registros personalizados.

• Permite crear varios formularios de registro con campos obligatorios u opcionales.
• El usuario puede elegir su username y modificarlo luego (si activas ese campo).
• Soporta validaciones específicas (teléfono, fecha, etc.) y control de errores.
• Integra roles por formulario, edición en “Mi cuenta” y log de información.
• Hay una extensión WooCommerce para sincronización con pedidos. 

Ventajas clave

Campos adicionales al registro: Ambos plugins permiten añadir nombre, teléfono, género, fecha, dirección, etc.

Username editable: Con Ultimate Member puedes incluir el campo “username” editable desde el registro.

Validación clara: Plugins como UM permiten mostrar mensajes específicos si faltan datos o son inválidos

Flujo de registro unificado: El usuario puede completar todo desde el registro: no necesita ir a editar perfil después/múltiples pasos.

Integración con WooCommerce: Custom fields se sincronizan con “checkout” y “Mi cuenta”; Ultimate Member añade la extensión para WooCommerce ()

Sobre este plugin tenemos un módulo completo en este curso, aunque no creamos como tal un formulario, puedes ver un poco como funciona el plugin: https://uxdivi.com/cursos/curso-crear-una-academia-online-con-learndash-y-divi/lecciones/leccion-6-creacion-de-la-pagina-de-alumno-registro-y-resultados-de-busqueda/clases/bonus-crear-area-de-usuario-para-tu-sitio-de-cursos-en-divi-con-ultimate-member

Recomendación

• Si quieres una integración sencilla, potente y enfocada 100 % en WooCommerce, elige Custom User Registration Fields for WooCommerce (desde $59/año) – excelente para B2B y validaciones completas.

• Si deseas más control sobre roles, perfiles, flujos personalizados y una comunidad más avanzada, utiliza Ultimate Member con su extensión WooCommerce.

Ambas son compatibles con Divi porque generan formularios desde WP que puedes incrustar en páginas Divi con shortcodes o bloques.

Un abrazo,

Jefferson – UXDivi

uxdivi.com

Curso crear una academia con Learndash y Divi Básico

Aprende a crear una academia online con Learndash y Divi de una manera sencilla con este curso donde lograrás dominar este plugin de Cursos.

[Jefferson Maldonado]

¡Hola Maritzel!

Muy buena observación. Divi Machine facilita precisamente esto con el Thumbnail Module, que puede usar directamente un campo de ACF en lugar de la imagen destacada. Aquí te explico cómo hacerlo:

El Thumbnail Module de Divi Machine incluye una opción llamada “Choose Second Image”, donde puedes seleccionar cualquier campo de imagen de ACF que hayas creado.

Para usarla:

• 1. Abre tu Archive Loop layout en el Visual Builder.
• 2. Inserta o selecciona el Thumbnail Module.
• 3. En las opciones del módulo, baja hasta donde dice “Choose Second Image”.
• 4. Selecciona el campo ACF fotografia desde el listado.

Con esto, el módulo mostrará automáticamente la imagen del campo personalizado en lugar del Featured Image, y podrás seguir estilando la imagen con las opciones de tamaño, overlay y hover que ofrece Divi Machine.

Esta opción “Choose Second Image”, está en las versiones más recientes de Divi Machine así que asegurarte de tenerlo actualizado, nosotros desafortunadamente no tenemos la versión más reciente disponible, pero puedes adquirirla directamente con si desarrollador.

Un saludo,

Jefferson – UXDivi

[Jefferson Maldonado]

¡Hola Simón!

Gracias por compartir tu caso y por adjuntar las capturas, así es mucho más sencillo entender exactamente lo que necesitas. Para lograr que la imagen ocupe completamente la columna izquierda en tu diseño con Divi, el truco está en trabajar con una sección normal (no especial), ya que las secciones especiales de Divi suelen limitar la personalización del ancho y la altura de las columnas.

Paso a paso para lograr el efecto

Mi recomendación es que utilices una sección normal (azul) y dentro de ella agregues una fila con dos columnas. En la configuración de la fila, ajusta tanto el ancho como el ancho máximo al 100% para asegurarte de que la fila ocupe todo el ancho de la pantalla. Luego, en la columna donde tienes tu formulario de registro o login (columna 2), coloca los módulos necesarios y, en la pestaña de CSS avanzado de esa columna, añade el siguiente código en “Elemento principal”:

min-height: 100vh;
display: flex;
flex-direction: column;
justify-content: center;

Esto hará que la columna tenga siempre la altura de la pantalla y que los módulos se centren verticalmente. Además, te sugiero agregar un padding lateral de unos 60px para que el formulario no quede pegado al borde.

En la columna 1, donde irá la imagen, solo tienes que poner la imagen como fondo en la configuración de la columna y elegir la opción “Cover” (cubrir) para que la imagen se adapte a todo el espacio disponible de esa columna. Así conseguirás que la imagen ocupe siempre el 100% tanto en ancho como en alto.

Por último, te recomiendo revisar el diseño en móvil. En la mayoría de los casos lo ideal es ocultar la columna de la imagen y dejar solo visible la del formulario, ajustando el padding para que todo siga viéndose bien.

Consejo extra

Existen más maneras de lograr este efecto, pero este método es el más rápido y confiable en Divi 4 y versiones posteriores. ¡Espero que esta guía te ayude a conseguir el resultado que buscas! Si tienes alguna otra duda, aquí estoy para apoyarte.

Un saludo,

Jefferson – UXDivi

• Esta respuesta fue modificada 9 meses, 3 semanas por  Jefferson Maldonado.

[Jefferson Maldonado]

¡Hola de nuevo, Maritzel!

Muy buena pregunta, porque es una de las limitaciones más comunes de Divi cuando trabajas con campos dinámicos de ACF. Efectivamente, el módulo de Texto de Divi solo permite insertar un campo dinámico por vez y reemplaza todo el contenido del módulo, así que no puedes combinar dos campos dinámicos de forma nativa desde la interfaz.

¿Qué opciones tienes?

1. Solución sencilla con ACF:

La opción más simple es crear un nuevo campo ACF combinado (por ejemplo, llamado “Ubicación Completa”) y, al editar cada ficha, rellenarlo manualmente con el formato “Yucatán, México”. Así te aseguras que todo salga en una sola línea, aunque es menos automático.

2. Automatización con un snippet de código:

Si quieres hacerlo automático y evitar duplicar información, puedes usar un pequeño snippet de código en el archivo functions.php de tu tema hijo. Este código crea un campo dinámico “virtual” que concatena los valores de Estado y País:

add_filter('acf/format_value/name=ubicacion_completa', function($value, $post_id, $field){
 $estado = get_field('estado', $post_id);
 $pais = get_field('pais', $post_id);
 return $estado . ', ' . $pais;
}, 10, 3);

Después, en ACF, crea un campo de solo lectura llamado “ubicacion_completa” y se rellenará solo al mostrar el detalle.

3. Con Divi Machine:

Si estás usando Divi Machine, en algunos módulos avanzados puedes combinar varios campos usando shortcodes ACF, aunque depende de la configuración exacta. Pero la opción del snippet es la más universal y funciona bien.

Resumiendo

Nativamente en Divi: No es posible combinar dos campos dinámicos en una línea desde el módulo Texto.

Con código: Sí, usando un snippet para unir los campos antes de mostrarlos, pero requieres un poco de conocimientos técnicos para implementarlo.

Manualmente: O bien, agregando el dato combinado en un campo adicional de ACF.

Un saludo,

Jefferson – UXDivi

[Jefferson Maldonado]

¡Hola Maritzel!

Gracias por explicar tan bien el problema y por compartir tu avance en el curso. Lo que describes es totalmente normal cuando se trabaja con Divi Machine y otros plugins similares. Por el momento, Divi Machine no ofrece soporte completo para la visualización en el constructor visual de Divi—especialmente cuando se trata de mostrar contenido dinámico (como los campos personalizados o los títulos de los Custom Post Types).

En otras palabras, es común que los módulos de Divi Machine no se muestren en tiempo real dentro del constructor visual, aunque en la página final (vista pública) todo se vea perfecto. Es una limitación técnica que, hasta la fecha, sigue presente en la mayoría de plugins avanzados que gestionan datos dinámicos con Divi.

Te recomiendo seguir trabajando con normalidad y, siempre que quieras ver cómo se visualiza el contenido real, actualiza y revisa la página desde el frontend (modo público). Si en algún momento Divi Machine añade soporte para el constructor visual en futuras versiones, lo comunicaremos dentro de la comunidad y en los cursos.

¡Ánimo y sigue adelante con tu proyecto! Estamos para ayudarte 😊🖐

Un saludo,

Jefferson – UXDivi

[Jefferson Maldonado]

¡Hola, Simón!

Primero que nada, felicidades por terminar el curso y por lanzarte a aplicar WooCommerce en tu PyME. Me alegra mucho leer casos reales como el tuyo y seguro tu experiencia va a inspirar a otros dentro de la comunidad. Voy por partes con tus dudas, tratando de darte la respuesta más clara y útil posible:

Desactivar el zoom en imágenes de servicios

El efecto de zoom en la imagen de producto/servicio viene por defecto en WooCommerce, pero ¡tranquilo! Puedes desactivarlo fácilmente añadiendo este snippet al archivo functions.php de tu tema hijo, o mejor aún, usando el plugin gratuito “Code Snippets” (así evitas problemas con futuras actualizaciones):

add_action( 'after_setup_theme', 'uxdivi_remove_wc_zoom', 99 );
function uxdivi_remove_wc_zoom() {
    remove_theme_support( 'wc-product-gallery-zoom' );
}

Con esto, el efecto de zoom desaparecerá.

Personalización de tarifas de “transporte” en vez de “envío”

WooCommerce usa el término “Envío” por defecto, pero puedes adaptarlo perfectamente a tu modelo de servicios:

• Renombrar “Envío” por “Transporte”: Usa el plugin gratuito Loco Translate para buscar y cambiar la palabra “Envío” por “Transporte” en toda la tienda, incluso si está en español.

• Calcular el costo según comuna y kilómetros: Aquí puedes usar plugins como Table Rate Shipping for WooCommerce (hay versión gratuita y de pago) que permite crear reglas de tarifas basadas en ubicación, distancia, o incluso condiciones personalizadas (puedes poner una tabla de precios por comuna o por rangos de kilómetros).

• Si quieres un cálculo automático por distancia real, plugins como Distance Rate Shipping te permiten cobrar según los kilómetros ingresando la dirección del cliente (ideal para servicios de campo o construcción).

Servicios exclusivos para clientes registrados

Esto es totalmente posible en WooCommerce. Te dejo un flujo recomendado y las herramientas para lograrlo:

• Requiere registro de usuario: WooCommerce lo permite por defecto. Solo activa la opción en Ajustes > Cuentas y privacidad.

• Asignar servicios exclusivos manualmente:

  • Crea un producto/servicio oculto (visible solo con enlace directo).

  • Usa el plugin gratuito User Role Editor o el de pago WooCommerce Memberships para limitar la visibilidad o acceso a ese servicio a usuarios específicos.

• Marcar un servicio como “pagado” manualmente:

  • Entra al pedido en WooCommerce y cámbiale el estado a “Completado” o “Pagado”.

  • El sistema automáticamente envía la notificación por correo al cliente si tienes habilitada la opción en WooCommerce > Ajustes > Correos electrónicos.

• ¿Hay conflictos con la pasarela de pago?

  Si registras el pedido manualmente y lo marcas como pagado, WooCommerce no realiza ningún cargo automático, solo deja constancia en el historial del cliente. La única recomendación es dejar claro al cliente que este registro es manual, por si en el futuro revisa su historial y no ve el pago realizado con tarjeta.

Herramientas y plugins recomendados:

• Loco Translate (gratuito) para cambiar textos.
• Table Rate Shipping o Distance Rate Shipping (si necesitas cálculo por kilómetros).
• Code Snippets para agregar código fácilmente.
• WooCommerce Memberships (de pago, para restringir servicios a ciertos usuarios).
• User Role Editor (gratuito, para gestionar permisos y roles).

¡Mucho éxito con tu proyecto!

Aquí seguimos para apoyarte en cada etapa.
Un abrazo,
Jefferson – UXDivi

• Esta respuesta fue modificada 10 meses por  Jefferson Maldonado.
• Esta respuesta fue modificada 10 meses por  Jefferson Maldonado.
• Esta respuesta fue modificada 10 meses por  Jefferson Maldonado.

[Jefferson Maldonado]

Que tal Gonzalo, tal como lo comenta Aida es como nosotros lo haríamos.

[Jefferson Maldonado]

Hola Malica, actualmente estamos haciendo cambios y reunificación en nuestros contenidos y por eso ves algunas inconsistencias, pero ya deberías tener acceso, por favor, avísame si no es así. Un saludo y una disculpa por los inconvenientes.

[Jefferson Maldonado]

Que tal Mauricio un gusto saludarte. Claro, acá te dejo la plantilla que puedes adquirir que está prácticamente lista para trabajar: https://uxdivitemplates.com/product/plantillas-divi/corporativas/plantilla-intranet-comunidades-o-empresas-con-buddyboss-y-divi/

Y esta plantilla la desarrollamos en el curso de Intranet con Buddyboss. Puedes consultarlo después de compararla.

uxdivitemplates.com

Plantilla intranet comunidades o empresas con Buddyboss y Divi - UXDivitemplates

¡Descubre la plantilla definitiva para comunidades de aprendizaje y empresas que desean revolucionar su experiencia en línea! Nuestra plantilla para Divi, integrada con el poderoso Buddyboss Theme y el constructor visual del Divi Builder, es la solución todo-en-uno que has … Continue reading