Revisado por Reconstruyes tu página de lista de deseos en el Constructor de Divi para que finalmente coincida con el resto de tu tienda. Añades una sección principal, algunos colores de marca y un buen encabezado. Luego guardas, cargas la página y la lista de deseos no está allí.
No hay mensaje de error ni advertencia. Los compradores que guardaron productos para más tarde vuelven a una página vacía, y es posible que no te lo digan. Nuestro módulo de lista de deseos de Divi soluciona exactamente eso.
Se incluye en el plugin gratuito SaveTo Wishlist Lite. A continuación, te mostraré por qué la página se queda en blanco y cómo configurar el módulo. Luego, convertiremos esa página en una que venda.
Saltar a:
- Por qué tu página de lista de deseos de Divi puede parecer vacía
- Lo que la integración de Divi de SaveToWishlist realmente hace
- Qué necesitas antes de empezar
- Cómo añadir la lista de deseos a un diseño del Constructor de Divi
- Cómo usar el módulo en una plantilla del Constructor de Temas de Divi
- Cómo convertir tu página de lista de deseos de Divi en una página de ventas
- Cómo confirmar que tu lista de deseos de Divi funciona
- ¿Qué pasa con el botón Guardar en lista de deseos en Divi?
- Preguntas frecuentes
- ¿Listo para añadir tu lista de deseos a Divi?
Por qué tu página de lista de deseos de Divi puede parecer vacía
La página de la lista de deseos llega al navegador de una manera. WordPress ejecuta el shortcode [saveto_wishlist] almacenado en el cuerpo de la página, y ese shortcode genera la lista de deseos.
Divi crea páginas con su propio sistema de diseño, y hay dos maneras en que puede omitir ese shortcode:
- Editas la página en el Divi Builder: Divi guarda la página como su propio diseño. Si el diseño no tiene ningún elemento de lista de deseos, no queda nada para generar la lista de deseos.
- Una plantilla del Theme Builder cubre la página: La plantilla reemplaza el cuerpo de la página, por lo que el shortcode almacenado allí nunca se ejecuta.
Ese es el comportamiento normal de un page builder, no un error de Divi. Un builder que controla el cuerpo de la página decide qué se muestra allí. Una excepción es una plantilla del Theme Builder que incluye el módulo de Contenido de Publicación propio de Divi. Esa plantilla todavía ejecuta el shortcode.
La pestaña de lista de deseos de Mi Cuenta no se ve afectada, porque no pasa por el cuerpo de la página. Por lo tanto, la pestaña puede seguir funcionando mientras la página principal de la lista de deseos permanece vacía.
Una página vacía cuesta más de lo que parece. Según la investigación de páginas de productos del Baymard Institute, el 21% de 1.193 encuestados dijo que confía en las funciones de "Guardar". La misma investigación encontró que el 89% de los sitios no facilitan el acceso y uso de las funciones de Guardar. Además, una página de lista de deseos que no muestra nada oculta esas guardadas por completo.
Lo que la integración de Divi de SaveToWishlist realmente hace
La integración añade una cosa: un módulo Save to Wishlist en el Divi Builder. Se incluye en SaveTo Wishlist Lite 1.1.3 y versiones posteriores. No hay página de configuración ni opción para activar.
- El mismo shortcode debajo: El módulo ejecuta el shortcode
[saveto_wishlist]existente por ti. Así que los invitados, los clientes registrados y los enlaces compartidos reciben el mismo tratamiento que en una página de lista de deseos estándar. - Una configuración opcional: Un campo de ID de lista de deseos. Déjalo vacío y cada visitante verá su propia lista de deseos.
- Funciona en plantillas del Theme Builder: Crea un diseño de lista de deseos y reutilízalo, en lugar de reconstruir la página manualmente.
- Carga sus propios scripts: El plugin detecta el módulo en una página, en un diseño del Theme Builder o en un módulo global de la Biblioteca de Divi. Luego carga los scripts de la lista de deseos allí, incluso si no es tu página principal de lista de deseos.
Antes de este módulo, la solución habitual era pegar el shortcode manualmente en un módulo de código de Divi. El nuevo módulo hace el mismo trabajo con su propio panel de configuración. Si ya usas esa solución, puedes sustituirla por el módulo.
Lo que la integración no hace
El alcance es intencionadamente limitado. Aquí es donde termina el trabajo del módulo.
| Área | ¿Cubierto por la integración de Divi? |
|---|---|
| La lista de deseos dentro de una página de Divi Builder | Sí, a través del módulo Guardar en lista de deseos |
| La lista de deseos dentro de una plantilla de Theme Builder | Sí, incluyendo los diseños de encabezado, cuerpo y pie de página |
| Divi 5 | Todavía no oficialmente. El módulo está construido para Divi 4 |
| El botón Guardar en lista de deseos en las tarjetas y páginas de productos | No. El botón sigue la configuración de tu Ubicación y estilos de botón |
| Una página de configuración o un interruptor de encendido/apagado | Ninguno. El módulo está ahí siempre que Divi 4 esté activo |
Eso lo convierte en una herramienta diferente a nuestro widget de Elementor, que coloca el botón. El módulo de Divi se trata de la página de la lista de deseos en sí.
Qué necesitas antes de empezar
Necesitas tres cosas en su lugar, y probablemente ya tienes dos de ellas.
- Divi 4: Funciona tanto el tema Divi como el plugin independiente Divi Builder.
- SaveTo Wishlist Lite 1.1.3 o posterior: La versión actual es 1.1.6, así que actualiza primero si tienes una anterior.
- WooCommerce: Activo en tu sitio, como ya lo está si vendes con él.
El módulo es parte del plugin gratuito. No necesitas SaveTo Wishlist Pro para él. Las tiendas Pro también lo obtienen, ya que Pro se ejecuta sobre Lite.
🔍️ Lo que hemos visto: La primera pregunta a resolver es qué versión de Divi utilizas. Nuestro módulo está construido para Divi 4, y Divi 5 aún no es compatible oficialmente. Según las FAQ de Divi 5 de Elegant Themes, los módulos de terceros de Divi 4 siguen funcionando en modo de compatibilidad retroactiva. Sin embargo, no hemos confirmado el nuestro allí, así que pruébalo primero en un sitio de staging.
Una nota más honesta. Divi es un tema de pago, por lo que no forma parte de nuestro conjunto de pruebas automatizadas. Nuestro equipo capturó las capturas de pantalla a continuación en un sitio Divi en vivo.
Cómo añadir la lista de deseos a un diseño del Constructor de Divi
Aquí está la configuración completa. Lo haces una vez por diseño, y no implica ningún código. Los pasos coinciden con nuestra guía de la base de conocimientos de Divi.
- Abre tu página de lista de deseos en el Divi Builder.
- Haz clic en el icono de inserción de módulo donde quieras que aparezca la lista de deseos.
- Escribe Lista de deseos en el cuadro de búsqueda de módulos.
- Seleccione Save to Wishlist de los resultados. Busque el icono del corazón.
- Abre la pestaña Contenido del módulo, luego la sección Lista de deseos.
- Deja el campo ID de lista de deseos vacío para una página de lista de deseos normal.
- Guarda la página y luego ábrela fuera del constructor para ver la lista de deseos en vivo.
Cuándo usar el campo ID de la lista de deseos
La mayoría de las tiendas deberían dejarla vacía. Un campo vacío muestra a cada visitante su propia lista de deseos, que es para lo que sirve una página de lista de deseos.
Un número en el campo fija el módulo a esa única lista de deseos, por su ID. Dos cosas sobre esto no son obvias:
- Anula los enlaces compartidos: Cuando alguien abre un enlace de lista de deseos compartida en esa página, ve la lista anclada en su lugar. Deja el campo vacío en la página donde se abren los enlaces compartidos.
- Los invitados no la ven: Mientras las listas de deseos de invitados están activadas (por defecto), los visitantes no registrados obtienen su propia lista de deseos de invitado en su lugar.
Eso hace que el campo sea inadecuado para una guía de regalos pública. Para una lista curada que todos puedan abrir, haz la lista pública y comparte su enlace en su lugar.
Lo que verás dentro del constructor
Dentro del Divi Builder, el módulo muestra un mensaje corto de marcador de posición en lugar de tu lista de deseos en vivo. Eso es deliberado y no es un problema de estilo.
La lista de deseos real es una aplicación en vivo vinculada a quien esté conectado. Renderizarla en el lienzo permitiría que un clic accidental agregara o eliminara elementos de tu propia lista. También mostraría tu lista privada a cualquiera que previsualice el diseño.
🔍️ Lo que hemos visto: El marcador de posición es fácil de confundir con una lista de deseos rota. Es tentador empezar a solucionar problemas dentro del constructor, pero el módulo probablemente esté bien. Comprueba la página en vivo en su lugar, una vez desconectado y una vez como cliente.
Cómo usar el módulo en una plantilla del Constructor de Temas de Divi
Si una plantilla del Theme Builder cubre tu página de lista de deseos, agrega el módulo a esa plantilla. El módulo dibuja la lista de deseos en sí, por lo que no depende del cuerpo de la página que la plantilla reemplazó.
- Vaya a Divi > Theme Builder.
- Edita la plantilla asignada a tu página de lista de deseos. También puedes elegir otra plantilla, como una cabecera o un pie de página.
- Agrega el módulo Save to Wishlist de la misma manera que lo harías en una página, luego guarda.
¿Ya usas una plantilla con el módulo Post Content de Divi en la página de lista de deseos? Entonces la lista de deseos debería seguir renderizándose, siempre que el cuerpo de la página todavía contenga el shortcode. Aun así, agregar el módulo es la opción más limpia, porque no depende del cuerpo de la página en absoluto.
Guardar el módulo como un módulo global de la Biblioteca Divi también funciona. El plugin sigue esa referencia y carga los scripts de la lista de deseos. Evita anidar un módulo global dentro de otro, sin embargo. El plugin solo verifica un nivel de profundidad, por lo que un módulo anidado dos veces puede cargarse sin sus scripts.
Cómo convertir tu página de lista de deseos de Divi en una página de ventas
Recuperar la lista de deseos en la página es el primer paso. La mayor ventaja es que ahora puedes diseñar a su alrededor, con cada módulo de Divi que ya usas.
Esa página importa. Según la investigación sobre abandono de carritos del Baymard Institute, la tasa promedio documentada de abandono es del 70.22%, en 50 estudios. También informa que el 42% de los compradores en línea de EE. UU. abandonaron un carrito mientras "solo navegaban / no estaban listos para comprar". Como resultado, tu página de lista de deseos puede ser donde esos compradores regresan para decidir.
Dale a la página un siguiente paso claro
La lista de deseos en sí misma ya permite a los compradores agregar artículos individuales o todo a la vez al carrito. Tu trabajo es hacer que ese paso sea fácil. Coloca las cosas que resuelven las dudas de última hora junto al módulo.
- Una fila corta de tranquilidad: Envío, devoluciones o plazos de entrega, en un módulo Divi Blurb o de Texto encima de la lista de deseos.
- Un enlace para seguir comprando: Un módulo Divi Button debajo de la lista que lleva de vuelta a tu tienda o a una categoría clave.
- Un encabezado que coincida con tu tienda: Algo más cálido que "Lista de deseos", como "Tus selecciones guardadas".
Cubrimos más formas en que la página aumenta las ventas en cómo las listas de deseos aumentan la conversión.
Anima a los invitados a crear una cuenta
SaveTo Wishlist permite a los invitados guardar productos sin iniciar sesión. Cuando crean una cuenta o inician sesión, sus artículos guardados se fusionan en ella. Eso hace que la página de la lista de deseos sea un lugar natural para solicitar una cuenta.
Así que agrega una línea de texto cerca del módulo. Explica que una cuenta mantiene su lista con ellos en cualquier dispositivo. Nuestra guía para la lista de deseos de invitados de WooCommerce explica por qué vale la pena capturar esos guardados anónimos.
Haz que compartir sea parte de la temporada de regalos
Cada lista de deseos puede tener su propia URL pública para compartir. En cumpleaños y festividades, eso puede convertir a tus clientes en un canal de referencia. Cada enlace compartido lleva a un amigo o familiar directamente a los productos que alguien ya desea.
Agrega una breve indicación en la página, como "Comparte tu lista con la familia antes de las fiestas". Deja el campo ID de la lista de deseos vacío en esa página, para que los enlaces compartidos abran la lista correcta. Para la configuración detrás de esto, consulta compartir y permisos de la lista de deseos.
Haz que la página sea fácil de encontrar
Una gran página de lista de deseos no ayuda si los compradores no pueden volver a ella. Agrega un enlace de menú en tu encabezado de Divi, para que esté a un clic de distancia en cada página. Eso es más simple que colocar la lista de deseos completa en un encabezado o pie de página de todo el sitio.
Haz seguimiento cuando algo cambie
Los productos guardados te dicen lo que los compradores quieren. Mientras tanto, SaveTo Wishlist Pro puede automatizar alertas de caída de precios y alertas de reposición de stock para esos artículos. También agrega análisis de listas de deseos, para que puedas ver qué productos la gente guarda más. Estos comienzan en el plan Growth, y encontrarás cada plan en la página de precios.
Cómo confirmar que tu lista de deseos de Divi funciona
Realiza estas comprobaciones una vez después de la configuración y de nuevo después de cualquier actualización importante de Divi.
- Cerrado sesión: Abre la página en una ventana privada. Deberías ver la lista de deseos de invitados, siempre que las listas de deseos de invitados estén activadas.
- Como cliente: Inicia sesión con una cuenta de cliente de prueba, guarda un producto y luego abre la página. El producto debería aparecer en la lista.
- Como administrador, fuera del constructor: Deberías ver la lista de deseos en vivo, nunca el marcador de posición.
- Un enlace compartido: Haz que una lista de prueba sea pública, compártela y luego abre el enlace sin iniciar sesión. Debería mostrar esa lista.
¿Está el área de la lista de deseos en blanco a pesar de que el módulo está ahí? Comprueba si se encuentra en un módulo global anidado dentro de otro. Sácalo o añádelo directamente al diseño. Si los invitados no ven nada en absoluto, asegúrate de que Desactivar lista de deseos para invitados esté desactivado.
¿Qué pasa con el botón Guardar en lista de deseos en Divi?
El módulo coloca la lista de deseos, no el botón Guardar en la lista de deseos. El botón se configura por separado, en SaveTo Wishlist > Ajustes > Colocación y estilos del botón. Se adjunta a las plantillas de producto estándar de WooCommerce.
En una tienda de prueba Divi 4.27, el botón se mostraba en cada tarjeta de producto de la página de tienda estándar. Sin embargo, Divi también puede reconstruir páginas de producto con sus propios módulos Woo en el Theme Builder. No hemos probado todas las colocaciones en esas plantillas, así que comprueba la tuya en una página de tienda, una página de producto y un teléfono. Nuestra guía de colocación de botones enumera todas las opciones.
¿Una colocación satura tus tarjetas de producto Divi? Puedes ocultar el botón en un tipo de página y mantenerlo en la otra.
Preguntas frecuentes
¿La integración de Divi necesita SaveTo Wishlist Pro?
No. El módulo Guardar en lista de deseos se incluye en el plugin gratuito SaveTo Wishlist Lite, versión 1.1.3 y posteriores. Instala o actualiza el plugin gratuito, y el módulo aparecerá en el Constructor de Divi mientras Divi 4 esté activo.
¿Por qué mi página de lista de deseos está en blanco en Divi?
Divi guarda su propio diseño al editar una página, y una plantilla del Theme Builder puede reemplazar el cuerpo de la página. En cualquier caso, el shortcode [saveto_wishlist] puede que nunca se ejecute. Añade el módulo Guardar en la lista de deseos a la página o plantilla, y luego guarda de nuevo.
¿El módulo Guardar en lista de deseos funciona con Divi 5?
Divi 5 aún no es compatible oficialmente, ya que el módulo está construido para Divi 4. Elegant Themes dice que los módulos de terceros de Divi 4 se ejecutan en el modo de compatibilidad retroactiva de Divi 5. No hemos confirmado el nuestro allí, así que pruébalo en un sitio de staging antes de confiar en él.
¿Mis clientes verán alguna vez el marcador de posición del constructor?
No. El marcador de posición solo aparece dentro del Constructor de Divi mientras editas. Todos los que ven la página en vivo, incluyéndote a ti, ven la lista de deseos real en su lugar.
¿Todavía necesito un módulo de Código con el shortcode de la lista de deseos?
No. El módulo Guardar en la lista de deseos reemplaza esa solución alternativa y ejecuta el mismo shortcode por debajo. Si un módulo de código Divi contiene [saveto_wishlist], puedes cambiarlo por el módulo.
¿Listo para añadir tu lista de deseos a Divi?
Una página de lista de deseos solo vale la pena si se renderiza. En Divi, eso se reduce a un módulo. Una vez que esté en su lugar, la página se convierte en algo que puedes diseñar para vender.
- Confirma tu versión de Divi y actualiza a SaveTo Wishlist Lite 1.1.3 o posterior.
- Añade el módulo Guardar en la lista de deseos a tu página de lista de deseos o plantilla del Theme Builder.
- Diseña la página alrededor de la lista de deseos con un siguiente paso claro y una indicación para compartir.
- Realiza las cuatro comprobaciones como invitado, cliente, administrador y visitante con enlace compartido.
Tu lista de deseos de Divi está a un módulo de funcionar. Instala o actualiza SaveTo Wishlist Lite gratis, y luego añade el módulo a tu página de lista de deseos.
