Revisado por Creaste una rejilla de productos con Ultimate Store Kit, y se ve genial. Las tarjetas tienen iconos al pasar el ratón, distintivos de oferta y un botón rápido de Añadir al carrito.
Pero un comprador al que le gusta un producto y no está listo para comprar tiene dos opciones: comprar ahora o irse. Ultimate Store Kit dibuja sus propias tarjetas de producto. Por lo tanto, los botones de lista de deseos que dependen de los ganchos de tienda de WooCommerce nunca se muestran en ellas.
El plugin gratuito SaveTo Wishlist Lite ahora añade su botón a esas tarjetas por ti. Lo probamos en nuestra tienda de demostración. A continuación, te mostraré cómo configurarlo, comprobar que funciona y convertir los guardados en ventas.
Saltar a:
- Por qué tus Rejillas de Productos de WooCommerce Necesitan un Botón de Lista de Deseos
- Lo que Hace la Integración de Ultimate Store Kit
- Qué necesitas antes de empezar
- Cómo Añadir Botones de Lista de Deseos a las Rejillas de Ultimate Store Kit
- Cómo comprobar que la integración funciona
- 5 formas de convertir los guardados de cuadrículas de productos en ventas
- Cosas que debes saber antes de activarlo
- Preguntas frecuentes
- ¿Listo para Añadir Botones de Lista de Deseos a tus Rejillas de Ultimate Store Kit?
Por qué tus Rejillas de Productos de WooCommerce Necesitan un Botón de Lista de Deseos
Un botón de lista de deseos capta a los compradores a los que les gusta un producto pero no están listos para comprar. Eso es lo más importante en una rejilla de productos de WooCommerce. Los compradores usan las rejillas en tu página de inicio, páginas de categoría y páginas de destino para escanear muchos productos a la vez. Como resultado, la rejilla es a menudo donde ven por primera vez un producto que desean.
Ese grupo es más grande de lo que parece, y la investigación del Instituto Baymard lo demuestra. El 42% de los compradores en línea de EE. UU. han abandonado un carrito porque solo estaban
Aquí es donde un botón de lista de deseos ayuda: les da una tercera opción. Guardan el producto en un clic y siguen navegando. Mientras tanto, usted aprende qué productos quieren, y eso es lo que hace que una lista de deseos valga la pena en su tienda.
Así que el botón se gana su lugar donde los compradores navegan más. En una tienda Ultimate Store Kit, esas son las cuadrículas y carruseles de productos.
Lo que Hace la Integración de Ultimate Store Kit
SaveTo Wishlist Lite 1.1.8 pone un botón de lista de deseos en cada tarjeta de producto de Ultimate Store Kit, sin necesidad de añadir ningún widget.
Ultimate Store Kit de BdThemes es un complemento de Elementor con más de 3.000 instalaciones activas en WordPress.org. Añade widgets para cuadrículas de productos, carruseles, deslizadores y acordeones de WooCommerce.
Sin embargo, cada uno de esos widgets ejecuta su propia consulta de productos e imprime cada tarjeta desde su propia plantilla. Debido a eso, omiten los ganchos estándar de la tienda WooCommerce a los que se adjuntan los botones de la lista de deseos. La integración cierra esa brecha. Esto es lo que hace:
- Añade el botón a cada tarjeta: Cada tarjeta recibe un botón Guardar en la lista de deseos junto a su acción Añadir al carrito. No hay ningún widget que arrastrar a cada tarjeta.
- Evita corazones duplicados: Ultimate Store Kit tiene su propio icono de lista de deseos. Mientras el interruptor de Lista de deseos de una cuadrícula esté activado, SaveTo Wishlist oculta su botón, por lo que una tarjeta nunca muestra dos corazones.
- Coincide con los iconos de la tarjeta: El botón se muestra como un icono sin texto, por lo que encaja junto a los otros iconos de la tarjeta.
- Guarda el producto correcto: Cada botón lleva el producto de su propia tarjeta, por lo que un clic guarda el artículo que el comprador ve.
- Deja otras cuadrículas en paz: Un bucle de productos clásico de WooCommerce en la misma página mantiene su botón único normal.
El botón se muestra en los widgets de Ultimate Store Kit que tienen su propia acción Añadir al carrito. Eso cubre las cuadrículas y carruseles Glossy, Shiny y Florence. También cubre los deslizadores Heaven, Mentor y Showcase, además de Product Accordion, Product Image Accordion e Image Hotspot.
Qué necesitas antes de empezar
Necesitas tres plugins, y todos tienen versiones gratuitas:
- SaveTo Wishlist Lite, versión 1.1.8 o posterior: La integración se incluye en el plugin gratuito. Si usas SaveTo Wishlist Pro, se ejecuta sobre Lite, así que también lo obtienes.
- Elementor: La versión gratuita es suficiente.
- Ultimate Store Kit: El plugin gratuito de WordPress.org incluye la Cuadrícula Glossy que usamos en nuestras pruebas.
Nuestros desarrolladores verificaron la integración con Elementor 4.2.4 y Ultimate Store Kit 3.1.4. Además, lo probamos en nuestra tienda de demostración con Ultimate Store Kit 4.0.0.
Cómo Añadir Botones de Lista de Deseos a las Rejillas de Ultimate Store Kit
La integración se activa automáticamente cuando detecta Ultimate Store Kit. Sin embargo, necesitas activar un interruptor en cada cuadrícula antes de que aparezca el botón. Aquí están los pasos.
Paso 1: Instala o actualiza los plugins
Ve a Plugins > Plugins Instalados y actualiza SaveTo Wishlist Lite a la versión 1.1.8 o posterior. ¿Nuevo en el plugin? Nuestra guía de inicio rápido cubre la configuración inicial. Luego, asegúrate de que Elementor y Ultimate Store Kit estén instalados y activos.
Paso 2: Añadir o abrir una rejilla de Ultimate Store Kit
Abre una página en Elementor y busca en el panel de widgets una cuadrícula, como Glossy Grid. Arrástrala a la página, luego elige tus productos y diseño. ¿Ya tienes una cuadrícula? Entonces haz clic en ella para abrir su configuración.
Paso 3: Desactiva el interruptor de Wishlist de la cuadrícula
Este paso decide si el botón se muestra o no. Con la cuadrícula seleccionada, ve a la pestaña Contenido y abre la sección Ajustes. Luego abre la pestaña Botón de Acción:
- Desactiva el interruptor de Wishlist. Esto oculta el propio corazón de Ultimate Store Kit y deja pasar el botón SaveTo Wishlist.
- Mantén el interruptor de Añadir al carrito activado. El botón se sitúa junto a la acción Añadir al carrito de la tarjeta, por lo que sin él no hay dónde colocar el botón.
Después de eso, haz clic en Publicar o Actualizar. Cada cuadrícula tiene sus propios interruptores, así que repite esto para cada cuadrícula donde quieras el botón SaveTo Wishlist.
Paso 4: Elegir dónde se sitúa el botón
Ve a SaveTo Wishlist > Ajustes > Colocación y Estilos del Botón. En la sección Página de Tienda, busca Colocación del Botón. Las tarjetas de Ultimate Store Kit leen esta configuración de forma un poco diferente a tu página de tienda:
- Arriba a la derecha o Arriba a la izquierda de la Imagen del Producto: El botón se une a los iconos de la tarjeta en la imagen. Mueve los propios iconos y las insignias de oferta de Ultimate Store Kit un poco hacia abajo, para que nada quede cubierto.
- El título y las opciones de Añadir al carrito: El botón se muestra junto a la acción Añadir al carrito de la tarjeta. Eso cubre Encima del Título del Producto y Debajo del Título del Producto. También cubre Encima del Botón Añadir al Carrito y Debajo del Botón Añadir al Carrito. Ultimate Store Kit solo ofrece ese único lugar, por lo que las opciones del título no pueden moverlo.
- No mostrar: Oculta el botón en tu página de tienda y en tus cuadrículas de Ultimate Store Kit.
Dado que esta es la configuración de tu Página de Tienda, un cambio aquí también mueve el botón en tus páginas de tienda y de categoría. Comprueba una de esas páginas después de guardar.
Paso 5: Comprueba el icono y los colores del botón
También en esa pestaña, los ajustes de estilo de la Página de Tienda deciden la forma y los colores del icono. En las tarjetas de Ultimate Store Kit, el botón siempre se muestra solo como un icono, y se aplican algunas reglas:
- Tamaño del icono: Cualquier cosa mayor de 20 px se muestra a 20 px, para que encaje junto a los propios iconos de la tarjeta.
- Iconos claros en estilos sólidos: Un icono blanco sobre un botón oscuro (como el Rojo Clásico) toma el color del botón. Esto lo mantiene visible en la foto del producto.
- Modo predeterminado del tema: Las tarjetas muestran el corazón rojo estándar, ya que ese modo no tiene ajustes de icono propios.
Paso 6: Decide si los invitados pueden guardar
Finalmente, ve a SaveTo Wishlist > Ajustes > Opciones para invitados. Si Desactivar lista de deseos para invitados está activado, los compradores que no hayan iniciado sesión no verán el botón en tus cuadrículas. Yo dejaría la opción de guardar para invitados activada, y nuestra guía sobre listas de deseos para invitados explica por qué.
Con esos seis pasos completados, las cuadrículas de Ultimate Store Kit muestran el botón como deseas.
Cómo comprobar que la integración funciona
No pruebes dentro del editor de Elementor. Allí, el botón puede no aparecer en absoluto y, si lo hace, al hacer clic no sucede nada. En su lugar, abre la página en vivo en una ventana privada y realiza estas comprobaciones:
- Mira cada tarjeta. Cada tarjeta debe mostrar exactamente un botón de lista de deseos, y debe ser el de SaveTo Wishlist.
- Pasa el ratón por encima de una tarjeta. El icono propio de Añadir al carrito de Ultimate Store Kit debe seguir ahí y seguir añadiendo el producto al carrito.
- Haz clic en el botón de lista de deseos de cualquier tarjeta, luego recarga la página. El botón debería mostrarse como guardado.
- Abre tu página de lista de deseos. El producto de esa tarjeta debería aparecer en ella.
🔍️ Lo que hemos visto: Ultimate Store Kit oculta sus propios iconos de acción hasta que el comprador pasa el ratón por encima. El botón SaveTo Wishlist permanece visible. Con un icono de signo más, puede parecer una marca perdida en la foto. Un icono de corazón se lee como "guardar" de un vistazo.
5 formas de convertir los guardados de cuadrículas de productos en ventas
Un guardado desde una cuadrícula es un comprador que te dice "Me gusta esto, pero aún no". Estos cinco hábitos te ayudan a actuar en consecuencia.
Utiliza una ubicación en esquina en rejillas dirigidas por imágenes
Las tarjetas de Ultimate Store Kit se construyen alrededor de las fotos de los productos. Por lo tanto, un corazón en la esquina de la imagen es un lugar familiar y fácil de ver para el botón. También permanece a la vista mientras los iconos al pasar el ratón están ocultos, por lo que la opción de guardar siempre está a un clic de distancia.
Usa el fundido para que los compradores sigan navegando
Ve a SaveTo Wishlist > Ajustes > General. En Acción de la lista de deseos, establece Botón Añadir a la lista de deseos en Desvanecer. El botón confirma el guardado y el comprador permanece en la cuadrícula. Por el contrario, la redirección predeterminada lo envía a la página de la lista de deseos después de cada guardado, por lo que pierde su lugar.
Dale a cada rejilla un propósito
Dado que cada cuadrícula tiene su propio interruptor de lista de deseos, tú decides cuadrícula por cuadrícula. Por ejemplo, usa el botón SaveTo Wishlist en las cuadrículas que venden, como las novedades o los más vendidos. De esa manera, cada guardado va a una lista de deseos que puedes seguir, en lugar de dividirse entre dos sistemas.
Crea un carrusel de "guárdalo para la rebaja"
En las semanas previas a una gran rebaja, añade un carrusel de los productos que planeas descontar. Invita a los compradores a guardar sus favoritos con antelación. Cuando comience la rebaja, sabrás qué productos promocionar primero. Nuestras ideas de listas de deseos para el Black Friday cubren más formas de usar los guardados durante la rebaja.
Haz un seguimiento de lo que los compradores guardaron
En la práctica, los guardados solo se convierten en ventas cuando les das seguimiento. Úsalos para planificar recordatorios de reposición, correos de bajada de precio o un amable mensaje de “¿todavía lo estás pensando?”. Nuestra guía de marketing por correo electrónico de la lista de deseos detalla las opciones.
Empieza con el hábito que se adapte a tu tienda hoy. Luego añade los otros a medida que lleguen los guardados.
Cosas que debes saber antes de activarlo
La integración tiene algunos límites. Conocerlos ahora te ahorra una prueba confusa más tarde:
- El interruptor de la lista de deseos está activado por defecto: Las nuevas cuadrículas muestran el corazón de Ultimate Store Kit hasta que lo desactives.
- Sin Añadir al Carrito, sin botón: Una cuadrícula con su interruptor de Añadir al Carrito desactivado no muestra el botón de la lista de deseos.
- Algunos widgets no están cubiertos: Lista de Productos, Tabla de Productos, Categoría de Productos y Subcategoría no muestran el botón de la lista de deseos.
- Un lugar por tarjeta: Las ubicaciones del título no pueden mover el botón. Se muestra junto a Añadir al Carrito o en la esquina de la imagen.
- Solo icono: El texto del botón no se muestra dentro de estas tarjetas, incluso si tu página de tienda utiliza un estilo de texto.
- No se necesita widget: Las tarjetas de Ultimate Store Kit no pueden contener otros widgets de Elementor. El widget Guardar en la lista de deseos todavía se muestra en la sección Ultimate Store Kit del panel, para usarlo en otro lugar.
Preguntas frecuentes
¿Necesito SaveTo Wishlist Pro para la integración con Ultimate Store Kit?
No. La integración es parte del plugin gratuito SaveTo Wishlist Lite, versión 1.1.8 o posterior. SaveTo Wishlist Pro funciona sobre Lite, por lo que los usuarios de Pro también lo obtienen.
¿Puedo mantener el corazón de Ultimate Store Kit en una cuadrícula y usar SaveTo Wishlist en otra?
Sí. Cada cuadrícula tiene su propio interruptor de Lista de deseos. Déjalo activado para el icono de Ultimate Store Kit. Desactívalo para el botón SaveTo Wishlist.
¿Listo para Añadir Botones de Lista de Deseos a tus Rejillas de Ultimate Store Kit?
Tus cuadrículas de Ultimate Store Kit ya muestran a los compradores lo que vendes. Ahora, con un botón de lista de deseos en cada tarjeta, también pueden hacer un seguimiento de lo que quieren para más adelante.
¿Usas también otro complemento de Elementor? Nuestra guía de Complementos Premium para Elementor cubre los botones de lista de deseos en sus cuadrículas de productos.
- Actualiza SaveTo Wishlist Lite a la versión 1.1.8 o posterior.
- Desactiva el interruptor de Lista de deseos de cada cuadrícula y mantén activado Añadir al Carrito.
- Selecciona una ubicación en la esquina para las cuadrículas dirigidas por imágenes.
- Haz un seguimiento de lo que guardan los compradores para convertir el interés en pedidos.
Instala o actualiza SaveTo Wishlist Lite, luego activa el interruptor de Lista de deseos en tu primera cuadrícula.
