Esta guía te muestra cómo agregar el botón de "Agregar a la lista de deseos" de Growave a tu página de producto. Puedes hacerlo a través del editor de temas de Shopify (Online Store 2.0) o insertando el código manualmente (configuración personalizada o temas heredados).

Insertar el botón Agregar a la lista de deseos en la página del producto con Growave 2.0

Usa el menú de widgets en el sitio

En Growave 2.0, puedes instalar todos los elementos insertados relacionados con la Lista de deseos desde el menú de Widgets en el sitio menu:

Navega a Widgets en el sitio → pestaña Lista de deseos.
Haz clic en el botón Agregar a la tienda debajo de la tarjeta Botón Agregar a la lista de deseos.
Se te redireccionará al personalizador de páginas de Shopify, y el botón se agregará automáticamente a tu página de producto.
Arrastra el botón de la Lista de deseos a la ubicación deseada (por ejemplo, debajo de los botones Agregar al carrito o Comprar ahora) y haz clic en Guardar.

Widgets en el sitio de Growave - Lista de deseos

Usa el marcador de posición del "Botón Agregar a la lista de deseos"

Con Growave 2.0, puedes insertar manualmente el botón usando el marcador de posición de Growave en tu plantilla de producto o en un bloque de Liquid personalizado:

<div 
    class="gw-wl-add-to-wishlist-placeholder" 
    data-gw-button-class="custom-class-name" 
    data-gw-product-id="1234567890" 
    data-gw-variant-id="1234567890" 
    style="display: block" 
></div>

Attributes:
- data-gw-button-class: especifica el nombre de clase personalizado para el botón.
- data-gw-product-id: especifica el identificador único para el producto que se agregará o eliminará de la lista de deseos.
- data-gw-variant-id: especifica el identificador único para la variante del producto que se agregará o eliminará de la lista de deseos.

📖 Obtén más información sobre cómo insertar widgets de la Lista de deseos usando marcadores de posición

Insertar el botón Agregar a la lista de deseos en la página del producto en Online Store 2.0

Este método sin código funciona para los usuarios de Growave 1.0 y 2.0:

Ve a panel de administración de Shopify → Tienda online → Temas.
Busca tu tema activo y haz clic en Personalizar.
En el editor de temas, haz clic en App embeds y activa Growave.
En el selector de páginas superior, ve a Productos → Producto predeterminado.
En el menú de la izquierda, expande Plantilla → Información del producto.
Pasa el cursor entre los bloques y haz clic en el botón Agregar bloque (+).
Cambia a la pestaña Apps y selecciona Add to Wishlist.
Haz clic en Guardar.

✅ Tip

Puedes arrastrar el bloque para reposicionarlo arriba o abajo de otros elementos, como el precio del producto, la descripción o los botones de compra.

Insertar el botón Agregar a la lista de deseos en temas heredados

Para temas heredados (vintage) de Shopify:

Ve a panel de administración de Shopify → Tienda online → Temas → Editar código.
Abre el archivo product.liquid (o equivalente).
Agrega el siguiente código donde quieras que aparezca el botón:

{% capture the_snippet_fave %}
  {% render 'socialshopwave-widget-fave' %}
{% endcapture %}
{% unless the_snippet_fave contains 'Liquid error' %}
  {{ the_snippet_fave }}
{% endunless %}

✅ Tip

Coloca el código justo después del botón Agregar al carrito para asegurar la visibilidad.

Preguntas frecuentes

¿Por qué no aparece el botón de la Lista de deseos?

Asegúrate de que la aplicación de Lista de deseos esté activada en Growave → Ajustes.
Verifica que App Embed (Insertar aplicación) esté activado en Shopify → Personalizar → App embeds.
Asegúrate de que el botón de la Lista de deseos se haya agregado a la plantilla de la página del producto (en el panel de administración de Growave, ve a Widgets en el sitio → pestaña Lista de deseos → verifica el estado del widget del Botón Agregar a la lista de deseos).
Si estás usando código personalizado, verifica que product-id y variant-id sean válidos.
Después de una actualización o cambio de tema de Shopify, verifica si falta el botón de la Lista de deseos y vuelve a integrarlo utilizando el menú de Widgets en el sitio o los marcadores de posición según sea necesario.

¿Por qué sigue siendo visible el botón de la Lista de deseos después de haberlo desactivado?

Borra la caché de tu tienda y realiza una actualización completa de la página (hard refresh).
Asegúrate de que la Lista de deseos esté desactivada en Growave → Lista de deseos → Ajustes.
Ponte en contacto con el equipo de soporte si el botón persiste; es posible que deba eliminarse manualmente.

¿Puedo cambiar el icono de la Lista de deseos o personalizar el botón?

¡Sí! En Growave 2.0, ve a Branding → Wishlist para actualizar el estilo del icono y del botón. Obtén más información sobre la personalización de marca de la Lista de deseos en Growave 2.0.

¿Puedo insertar este botón Agregar a la lista de deseos en las tarjetas de productos o en las páginas de colecciones?

No, este botón es solo para páginas de productos. Para mostrar un icono de la Lista de deseos en las tarjetas de productos (como un contador con forma de corazón), lee nuestra guía sobre la integración del icono de la lista de deseos en las tarjetas de productos o solicita ayuda al equipo de soporte para insertar el widget AddToWishlistProductCardWidget.

Si tienes algún problema con la integración, no dudes en contactarnos en [email protected] o a través del icono de chat en la esquina inferior derecha del panel de administración de Growave.

Cómo integrar el botón "Agregar a la lista de deseos" en la página del producto