Master Divi Jefferson Maldonado
Master DiviRespuestas del foro creadas
-
Hola Simón
Gracias por detallar tan bien tu caso y las soluciones que ya intentaste, eso ayuda mucho para darte una orientación precisa.
1. Google no actualiza el favicon de forma inmediata
Aunque el cambio sea visible en tu navegador, Google puede tardar varias semanas o incluso meses en reflejar el nuevo favicon en los resultados. Sin embargo, si ya pasaron más de dos meses, vale la pena revisar los siguientes factores.
2. Verifica que el favicon esté correctamente declarado en el head
Asegúrate de que el favicon se llame desde una ruta absoluta y accesible públicamente. Usa formato PNG y evita SVG, ya que Google recomienda imágenes en PNG de al menos 48×48 px. El SVG puede mostrarse en pestañas, pero normalmente no se indexa como favicon en los resultados de búsqueda.
3. No modifiques el header.php del tema padre
Los cambios en el tema padre pueden perderse con las actualizaciones. Lo ideal es restaurar el header.php original de Divi y agregar el favicon desde Apariencia > Personalizar > Identidad del sitio o mediante un hook en el functions.php del tema hijo.
4. Cumple con las pautas de Google
Google indica que el favicon debe ser PNG, GIF o ICO, tener fondo transparente, ser cuadrado y tener al menos 48×48 px. Además, la URL debe ser accesible sin restricciones. Puedes consultar la guía oficial en: https://developers.google.com/search/docs/appearance/favicon-in-search?hl=es
5. Reenvía la indexación desde Google Search Console
Después de hacer los ajustes, entra a Google Search Console, usa la opción “Inspeccionar URL”, coloca la URL principal de tu sitio y selecciona “Solicitar indexación”. Esto forzará a Google a rastrear nuevamente los metadatos del sitio, incluyendo el favicon.
Recomendación final
Usa un favicon en formato PNG, configúralo desde el personalizador de WordPress, elimina referencias SVG en el header y solicita una nueva indexación desde Search Console. Con estos pasos asegurarás que tanto WordPress como Google utilicen la versión correcta del favicon.
Un saludo
Equipo UXDivi
developers.google.com
Si tu sitio web tiene un icono de página, el icono puede incluirse en los resultados de búsqueda de Google del sitio. Para conseguirlo, sigue estas instrucciones de SEO sobre iconos de página.
-
Gracias Simon, estaremos evaluando este tema para revisar si podemos crear algo así.
-
¡Hola, Alberto!
Esto pasa porque, al no usar el checkout nativo (shortcode/módulo), cuando WooCommerce cambia al endpoint “order-received” (“Información final”) ya no respeta tu maquetación de Divi y pinta su propio contenedor, que queda alineado a la izquierda.
Tienes dos caminos:
1) Recomendado (estable)
Usa el checkout nativo:
En la página de Checkout coloca el shortcode
(o el módulo Woo Checkout de Divi si lo tienes).- Mantén tus estilos alrededor (sección/fila de Divi).
- Así Woo aplica el mismo layout también en “order-received” y no se rompe la alineación.
2) Parche rápido (CSS para centrar la “Gracias”)
Si quieres conservar tu diseño actual, añade este CSS (en Opciones del tema → CSS personalizado o en tu child theme):
/* Centrar y limitar ancho del resumen de pedido (página de Gracias) */
.woocommerce-order,
.woocommerce-order-received .entry-content,
.woocommerce-page.woocommerce-order-received .woocommerce {
max-width: 900px;
margin: 0 auto;
}
.woocommerce-order .woocommerce-order-overview,
.woocommerce-order .woocommerce-column,
.woocommerce-order address {
width: 100%;
}
Con eso el bloque de “Información final” (Gracias) quedará centrado y con ancho controlado.
Saludos.
-
Hola Alexis,
Buena pregunta, y sí, es posible permitir que los instructores creen y publiquen posts directamente desde el frontend, sin acceder al panel de administración.
Una forma sencilla de hacerlo es utilizando WPForms (versión Pro o Elite), ya que incluye el complemento Post Submissions Addon, que permite a los usuarios crear entradas, cursos o noticias directamente desde un formulario en el frontend.
Solo necesitas:
-
Crear un formulario en WPForms con los campos que quieras (por ejemplo, título, contenido, imagen destacada, categoría, etc.).
-
Activar el Post Submissions Addon.
-
Configurar el formulario para que cree automáticamente una publicación tipo post o incluso un Custom Post Type (por ejemplo, el CPT de “Cursos” o “Artículos”).
-
Insertar ese formulario en una página accesible solo para instructores usando las reglas de visibilidad de BuddyBoss.
Esto permite que los instructores puedan enviar contenido sin tocar el panel de WordPress, y tú puedes decidir si se publica automáticamente o si debe aprobarse primero.
👉 También podrías revisar el plugin Frontend Publishing Pro si buscas una opción más avanzada de control de roles y permisos.
Un saludo,
Jefferson – Equipo UXDivi -
-
Hola Simón,
Gracias por tu consulta. Actualmente en UXDivi no tenemos un tutorial ni contenido específico sobre la implementación de la certificación BIMI.
Sabemos que este tipo de configuración puede mejorar la confianza y visibilidad de los correos, pero de momento no lo hemos incluido dentro de los cursos o guías disponibles en la plataforma.
Si en un futuro añadimos contenidos relacionados con BIMI, autenticación de correo o configuraciones avanzadas de email marketing, lo estaremos anunciando en la comunidad y en la sección de nuevos cursos.
¡Gracias por tu interés y por la sugerencia!
Un saludo,
Jefferson – Equipo UXDivi
-
Hola Simón, un gusto saludarte.
¿Intentaste también activar el «Modo seguro» de Divi y volver a cargar el constructor a ver si cargaba?
-
Hola Miguel Ángel,
Lo que comentas no depende directamente de Divi, sino de cómo Safari en iPhone interpreta la página. Básicamente, Safari muestra la barra inferior translúcida cuando detecta que la web tiene fondos “limpios” (por ejemplo, sin un color fijo o una imagen de fondo que obligue a mostrar contraste). En cambio, si encuentra un fondo sólido, forzará la barra en blanco o negro opaco.
Esto significa que el comportamiento puede variar entre webs hechas con Divi aunque uses la misma plantilla, porque cambia el diseño de fondo, la cabecera o incluso el modo claro/oscuro del dispositivo.
En pocas palabras: no hay una opción dentro de Divi para controlar esto, y tampoco se puede forzar siempre porque depende de la versión de iOS y de cómo Safari decide mostrar la barra. Lo más práctico es revisar que tus páginas tengan fondos claros o con transparencias en la parte superior para aumentar la probabilidad de que Safari active el efecto translúcido.
-
Hola Subhan.
Por defecto, WooCommerce solo permite atributos de tipo texto (como color, talla, etc.), pero no incluye la opción de mostrar un selector visual con código de color o muestras (swatches). Lo que tú ves en tu captura (el campo de código hex) corresponde a un plugin adicional que extiende WooCommerce, ya que en la instalación base no viene habilitado.
Lo que necesitas hacer es:
- Crear primero el atributo en WooCommerce → Productos → Atributos (por ejemplo, “Color”).
- Una vez creado, añade los valores (Blanco, Negro, Azul, etc.).
- Para que cada valor tenga su código de color (hex) y se muestre visualmente en las variaciones, necesitas un plugin extra. Algunos de los más usados son:
- Variation Swatches for WooCommerce (gratuito en WordPress.org, con versión Pro)
- WooCommerce Variation Swatches and Photos (plugin oficial de WooCommerce).
Con estos plugins, podrás asignar un color (ej. #fff para blanco, #000 para negro, etc.) a cada término del atributo y luego usarlo en las variaciones del producto.
Sin el plugin adicional, WooCommerce solo mostrará el nombre del atributo como texto.
Esto lo vemos a detalle en nuestro Mastery de WooCommerce en la sección de WooCommerce Avanzado: https://uxdivi.com/cursos/mastery-en-woocommerce-con-divi-crea-tiendas-online-que-venden
uxdivi.com
Mastery en WooCommerce con Divi: Crea Tiendas Online que Venden
Este Mastery en WooCommerce con Divi es el curso que te guiará paso a paso, desde los fundamentos esenciales de Woo hasta técnicas avanzadas
-
Hola Iciar 👋
Muy buena pregunta, y de hecho suele generar confusión. Ese icono que aparece junto al remitente en Gmail (el círculo con iniciales) no depende de WooCommerce ni de WP Mail SMTP, sino de cómo Google gestiona la identidad del remitente.
Algunas ideas que pueden ayudarte:
- Google Profile / Workspace: Si la cuenta de correo está asociada a un perfil de Google Workspace o Gmail normal, se puede configurar la foto/logo desde la propia cuenta de Google. Eso aplicará a los correos enviados desde Gmail directamente.
- BIMI (Brand Indicators for Message Identification): Es un estándar que permite mostrar el logotipo de la marca junto al remitente en clientes de correo compatibles (como Gmail o Yahoo). Para ello hay que configurar registros DNS (SPF, DKIM, DMARC y luego el registro BIMI con el logo en formato SVG). Es un proceso más técnico pero es la forma “oficial” de que aparezca el logo en todos los correos.
- Limitación en correos automáticos: Si los correos salen directamente desde el servidor del hosting (Cpanel + SMTP), Gmail los interpreta como correos “transaccionales” y suele ignorar la foto de perfil configurada manualmente. Ahí la única solución es lo anterior (BIMI o configurar bien la autenticación de correo).
En resumen: no depende de WooCommerce, sino de la autenticación y reputación del dominio de correo. La forma más profesional de lograrlo es configurar BIMI junto con los registros SPF, DKIM y DMARC.
👉 Si solo buscan algo rápido y visual para la clienta, lo más sencillo es configurar bien la cuenta en Google Workspace y que los correos salgan a través de Gmail (no directamente desde el hosting).
Espero que esto te aclare el panorama 🙂
-
Esta respuesta fue modificada 5 meses, 2 semanas por Jefferson Maldonado.
-
¡Hola!
Muy buena tu implementación, ya tienes la base correcta. El problema que describes no viene de object-fit: cover (ese es el enfoque adecuado), sino de cómo el navegador interpreta imágenes muy desproporcionadas en relación con el contenedor circular.
Aquí van algunas recomendaciones prácticas para dejarlo tipo “avatar de redes sociales”:
1. Forzar un contenedor cuadrado fijo
Asegúrate de que el contenedor padre siempre sea cuadrado. Por ejemplo:
.foto-circular,
.img-redonda {
width: 150px; /* o el tamaño que necesites */
height: 150px;
border-radius: 50%;
overflow: hidden;
display: flex;
align-items: center;
justify-content: center;
}
.foto-circular img,
.img-redonda img {
width: 100%;
height: 100%;
object-fit: cover;
object-position: center;
}
De esta forma, sin importar si la imagen es muy vertical u horizontal, el contenedor recorta lo sobrante y se mantiene siempre perfecto el círculo.
2. Deja que el círculo lo genere el contenedor, no la imagen
En lugar de aplicar border-radius: 50% a la imagen, aplícalo al contenedor (.foto-circular o .img-redonda). Eso garantiza que la máscara circular recorte el contenido sin deformarlo.
Resumen:
Haz el contenedor cuadrado y redondo (border-radius: 50% + overflow: hidden).
Usa object-fit: cover y object-position: center en la imagen dentro.
Así tendrás siempre avatares tipo Facebook/LinkedIn sin importar el tamaño original.
-
¡Hola Maritzel! 🙌
Muy buena la idea de destacar a ciertos especialistas. Lo que pasa con el módulo de “sorting” de Divi Machine es que, cuando trabajas con campos ACF personalizados (como ese destacado con valores 0/1), no siempre respeta bien el orden ni la paginación, por eso te muestra menos registros de los esperados.
La forma más práctica y estable de lograrlo es usar una taxonomía o categoría específica para los especialistas destacados, en lugar de un campo ACF. Así:
-
Crea una categoría o taxonomía llamada, por ejemplo, Destacados.
-
A los especialistas premium, asígnales esa categoría, además de las que ya tengan.
-
En el módulo de loop/archivo, configuras primero que muestre los especialistas de la categoría “Destacados” (con ordenación normal), y después el resto.
De esa manera, WordPress + Divi Machine entiende nativamente el orden y no se corta la lista. Además, te será más fácil si en el futuro quieres dar estilo diferente a los destacados (un badge, un borde especial, etc.).
Otra opción más técnica sería usar un hook de pre_get_posts para reordenar la query de WordPress por el campo ACF destacado (primero los que tienen 1 y luego los 0), pero eso ya requiere un poco de código. Si quieres hacerlo sin código, la vía de la categoría es la más sencilla y limpia.
👉 Mi recomendación: crea la categoría “Destacados”, úsala para marcar a los premium, y así tendrás el orden perfecto sin que se limiten los resultados.
-
-
Hola Simón 👋
Por el momento no tenemos contenido en UXDivi sobre la certificación BIMI, ya que este proceso está más relacionado con la configuración del dominio y los registros de correo que con el diseño web.
Sin embargo, te dejo algunas recomendaciones prácticas para que puedas orientarte:
-
Verifica que tu dominio tenga configurados correctamente los registros SPF, DKIM y DMARC. Son los tres pilares de autenticación del correo electrónico y sin ellos, BIMI no puede activarse.
-
Asegúrate de tener un logotipo oficial y en formato compatible. BIMI solo mostrará tu logo si es una imagen simple, sin efectos, y que represente claramente tu marca.
-
Utiliza una dirección de correo profesional (por ejemplo, hola@tudominio.com) y no una genérica como Gmail o Outlook.
-
Solicita a tu proveedor de hosting o servicio de correo (por ejemplo, Google Workspace, Zoho o tu proveedor de dominio) que te ayude a implementar BIMI. Muchos ya ofrecen asistencia directa para ello.
-
Consulta la web oficial de BIMI Group para conocer los requisitos actualizados y ejemplos de marcas que ya lo están usando.
Con estos pasos podrás avanzar de forma segura hacia la implementación, mejorar la reputación de tus correos y aumentar la visibilidad de tu marca.
-
-
¡Gracias por tu comentario Fernando!
-
Listo, correo enviado.
-
Que tal Víctor, claro que sí. Puedes contratar una hora de consultoría acá: https://muxstudio.com/servicios/consultoria-web-o-ux/
Y una vez que agendes intentaremos ayudarte a resolver el problema con asesoría personalizada.
muxstudio.com
Agenda una sesión de consultoría Web o UX y recibe la guía que necesitas para solventar los problemas que tiene tu sitio web o tu diseño.
4.6 calificación promedio en 
