> ## Knowledge Base Index
> Fetch the complete knowledge base index at: https://supr-bundles-and-subscriptions.crisp.help/sitemap.xml
> Use this file to discover available pages before exploring further.
> Pure-Markdown content can be obtained by appending a '.md' suffix to the content URLs listed in the sitemap (without the trailing slash).

# Cómo activar el widget de suscripciones en la tienda online

| Para acceder a esta página, ve a [**Supr Bundles & Subscriptions > Diseño**](https://admin.shopify.com/apps/super-subscriptions/app/widget)

El widget es lo que usan tus clientes para elegir una suscripción o un paquete en tus páginas de producto. Un mismo widget muestra las dos cosas: tus opciones de suscripción y tus opciones de paquete. Para activarlo, haz clic en **Activar widget** en la página **Diseño** y después en **Guardar** en tu editor de temas. No hay que pegar ningún código, código de inserción ni fragmento.

### Índice

* [Vídeo explicativo](#3-video-explicativo)
* [Instrucciones paso a paso](#3-instrucciones-paso-a-paso)
* [Dónde aparece el widget](#3-donde-aparece-el-widget)
* [Elegir una posición exacta](#3-elegir-una-posicion-exacta)
* [Mostrar el widget en otras páginas](#3-mostrar-el-widget-en-otras-paginas)
* [Ventanas emergentes de añadido rápido y vista rápida](#3-ventanas-emergentes-de-anadido-rapido-y-vista-rapida)
* [PageFly y otros creadores de páginas](#3-pagefly-y-otros-creadores-de-paginas)
* [Configurarlo en un tema sin publicar](#3-configurarlo-en-un-tema-sin-publicar)
* [Solución de problemas](#3-solucion-de-problemas)
* [Preguntas frecuentes](#3-preguntas-frecuentes)
* [Guías relacionadas](#3-guias-relacionadas)

### Vídeo explicativo

Si prefieres verlo en lugar de leerlo, este vídeo muestra cómo se activa la inserción de aplicación en el editor de temas. Ese interruptor es lo que **Activar widget** activa por ti.

${frame}[](https://www.youtube.com/embed/UpHcV7CoYVg)

### Instrucciones paso a paso

1. En tu Shopify admin, abre **Supr Bundles & Subscriptions** y ve a **Diseño**.
2. Si el widget aún no está activado, verás un aviso **Tus widgets aún no están activos**. Haz clic en **Activar widget** (en el aviso o en la parte superior de la página).
3. En la ventana que se abre, haz clic en **Activar**. Tu editor de temas se abre en una pestaña nueva con **Supr Bundle & Subscriptions** activado en **Inserciones de aplicaciones**.
![Botón Activar](https://storage.crisp.chat/users/helpdesk/website/-/7/f/3/a/7f3a3e9ddc403000/screenshot-2025-07-12-at-19571_gm3jkw.png =757xauto)
4. En el editor de temas, haz clic en **Guardar** en la esquina superior derecha. Hasta que lo hagas, el editor muestra un recordatorio **One more step** (un paso más). Si cierras el editor sin guardar, el widget sigue desactivado.
![Botón Guardar del editor de temas](https://storage.crisp.chat/users/helpdesk/website/-/7/f/3/a/7f3a3e9ddc403000/5c6ce361-b562-467d-bf5c-f57834_bnt2do.png)
5. Vuelve a la pestaña de la aplicación. Verás **Widget activado** cuando la aplicación haya encontrado el interruptor guardado. Si dice **Widget no activado**, vuelve a hacer clic en **Activar** y asegúrate de hacer clic en **Guardar** esta vez.

También puedes empezar desde **Inicio**: el paso de la guía de configuración **Widget activado** (o **Widget de suscripción activado** / **Widget de paquetes activado**, según lo que vendas) tiene el mismo botón **Activar widget**. Cuando el widget está activado, ese botón pasa a ser **Personalizar widget** y te lleva a **Diseño**.

|| ¿Prefieres hacerlo a mano? En tu Shopify admin ve a **Tienda online > Temas**, haz clic en **Personalizar** en tu tema publicado, abre **Inserciones de aplicaciones** (el icono de la parte inferior de la barra lateral izquierda), activa **Supr Bundle & Subscriptions** y haz clic en **Guardar**. En versiones antiguas de la aplicación, este interruptor se llamaba **Subscriptions (1.0 themes only)**.

### Dónde aparece el widget

No hay nada que arrastrar. El widget se coloca solo en tus páginas de producto, justo encima del botón de añadir al carrito, y funciona igual en todos los temas, incluidos los temas antiguos (vintage). Para ponerlo en otro sitio, consulta [Elegir una posición exacta](#3-elegir-una-posicion-exacta).

* Aparece en todas las páginas de producto cuyo producto esté en una oferta **Publicada**, sea cual sea la plantilla de producto que use.
* Tus opciones de paquete están justo al lado de las opciones de suscripción. Si las opciones de paquete van encima o debajo se define en **Diseño > Elementos > Diseño de la página > Paquete arriba**.
* El espacio encima y debajo del widget se define en **Diseño > Espaciado > Alrededor del widget**.
* El widget no tiene botón de añadir al carrito propio. Usa el botón de añadir al carrito de tu tema, así que tu página de producto necesita el bloque **Botones de compra** del tema.

### Elegir una posición exacta

Hay dos formas de mover el widget: el ajuste **Ubicación** de la página **Diseño**, que se aplica a todas las páginas de producto a la vez (un diseño guardado tiene su propia **Ubicación**, para las ofertas que lo usan), o el bloque **Subscriptions + Bundles**, que arrastras exactamente adonde quieras.

**Con el ajuste Ubicación:**

1. En la aplicación, ve a **Diseño**. La sección **Ubicación** aparece cuando el widget está activado (consulta los pasos anteriores).
2. Elige una **Posición en la página de producto**:
   * **Sobre el botón de añadir al carrito (automático)**: la opción predeterminada.
   * **Bajo los botones de compra**: debajo del botón de añadir al carrito y de los botones de pago exprés, como Comprar ahora.
   * **Sobre el selector de cantidad**: encima del campo de cantidad. Si tu tema muestra la cantidad en la misma línea que el botón de añadir al carrito, el widget se coloca encima de esa línea.
   * **Personalizado (selector CSS)**: en cualquier lugar de la página. Escribe en **Selector CSS** un selector CSS de un elemento de tu página de producto, por ejemplo `.product__title`, y elige en **Colocar el widget** si el widget va antes o después de ese elemento, o dentro de él al principio o al final.
3. Haz clic en **Guardar**.

Si la posición que elegiste no existe en una página (por ejemplo, una página de producto sin selector de cantidad, o un selector que no coincide con nada), el widget vuelve a su posición automática encima del botón de añadir al carrito, así que nunca desaparece. El ajuste se aplica a todos los temas en los que actives el widget.

|| ¿No sabes qué selector CSS usar? Contacta con soporte con un enlace a tu página de producto y el lugar donde quieres el widget, y te enviaremos uno.

**Con el bloque:** si quieres el widget en un sitio exacto, por ejemplo bajo el precio o bajo una línea de reseñas, añade el bloque **Subscriptions + Bundles** donde lo quieras:

1. Ve a **Tienda online > Temas** y haz clic en **Personalizar**.
2. Abre una página de producto con el selector de plantillas de la parte superior del editor (por ejemplo, **Productos > Producto predeterminado**).
3. En la sección de información del producto, haz clic en **Agregar bloque**, después en **Aplicaciones** y después en **Subscriptions + Bundles**.
4. Arrastra el bloque adonde quieras el widget y haz clic en **Guardar**.

Mantén activada la inserción de aplicación. Allí donde haya un bloque **Subscriptions + Bundles** en la página, la copia de la inserción se retira sola, así que nunca tendrás dos widgets por esto.

|| Un bloque pertenece a la plantilla, no a un producto. Moverlo mueve el widget en todos los productos que usan esa plantilla. Si tus productos usan más de una plantilla de producto, repite esto en cada plantilla en la que quieras la nueva posición. Las plantillas sin bloque mantienen la posición automática encima del botón de añadir al carrito.

### Mostrar el widget en otras páginas

También puedes vender desde una página que no sea la del propio producto, como una landing page, una página de colección, tu página de inicio o una entrada de blog. Ahí aparece el widget completo, con las mismas opciones de paquete, opciones de suscripción y diseño que configuraste en la página **Diseño**.

1. En tu editor de temas, abre la página que quieras.
2. Añade una sección que muestre un producto. La mayoría de los temas la llaman **Producto destacado**.
3. En esa sección, haz clic en **Agregar bloque**, después en **Aplicaciones** y después en **Subscriptions + Bundles**.
4. Haz clic en el bloque y configura su **Product**. Fuera de una página de producto, el bloque no puede saber a qué producto te refieres, así que hay que indicárselo. Hasta que lo hagas, el editor de temas muestra **Nothing to show yet: this block has no product selected** (todavía no hay nada que mostrar: este bloque no tiene ningún producto seleccionado).
5. Mantén el bloque **Botones de compra** propio de la sección. El widget usa ese botón de añadir al carrito.
6. Haz clic en **Guardar**.

|| Puedes poner más de uno en la misma página. Cada uno mantiene sus propias opciones y precios, y el botón de añadir al carrito de cada producto lleva la elección que hizo el comprador para ese producto.

La inserción de aplicación por sí sola solo muestra el widget en las páginas de producto. Para cualquier otra página, usa el bloque como se indica arriba.

Otra opción para un botón, un banner o un correo es un enlace de suscripción rápida: **Crecimiento > Enlaces de suscripción rápida** crea un enlace que va directamente a la pantalla de pago con el producto y la suscripción ya elegidos. Consulta [Crear invitaciones de suscripción (enlaces de suscripción rápida)](https://supr-bundles-and-subscriptions.crisp.help/es/article/creating-subscription-invitations-quick-subscribe-links-15k2i6g/).

### Ventanas emergentes de añadido rápido y vista rápida

Muchos temas tienen un botón de **añadido rápido** o **vista rápida** en las tarjetas de producto de las colecciones y de la página de inicio. Que el widget aparezca ahí depende del tema:

* **Temas cuya ventana emergente carga el formulario de producto completo** (por ejemplo, Dawn con el añadido rápido estándar): el widget y las opciones de paquete aparecen dentro de la ventana emergente cuando el bloque **Subscriptions + Bundles** está en tu plantilla de producto. Añádelo como se describe en [Elegir una posición exacta](#3-elegir-una-posicion-exacta).
* **Horizon y los temas basados en él**: para un producto con suscripción, el botón de añadido rápido abre la página de producto en lugar de una ventana emergente, y el widget aparece ahí como siempre.
* **Otros temas**: si la ventana emergente no muestra el widget o lo muestra roto, desactiva el añadido rápido en el editor de temas (suele ser un ajuste de la sección de colección o de cuadrícula de productos) para que los compradores vayan a la página de producto, o contacta con soporte y revisaremos tu tema.

### PageFly y otros creadores de páginas

No hay ID de widget, shortcode ni código de inserción, y pegar código en un elemento Custom Code o HTML no funciona. El widget es un bloque de aplicación de Shopify, y Shopify solo permite añadir bloques de aplicación desde el editor de temas. Los creadores de páginas lo admiten con su propio elemento de bloque de aplicación.

**En una página de producto de PageFly**, no tienes que hacer nada. Con la inserción de aplicación activada (consulta los pasos anteriores), el widget se coloca solo encima del botón de añadir al carrito, igual que en una página de producto del tema.

**En una landing page de PageFly:**

1. En el editor de PageFly, abre tu página y arrastra el elemento **App blocks** (en los elementos de Shopify) adonde quieras el widget. PageFly permite un elemento App blocks por página y necesita un tema Online Store 2.0.
2. Sigue el aviso de PageFly para abrir el editor de temas y haz clic en **Agregar bloque**, **Aplicaciones**, **Subscriptions + Bundles**.
3. Haz clic en el bloque y configura su **Product** con el producto al que se dirige tu oferta.
4. Asegúrate de que la página también tiene el botón de añadir al carrito de PageFly para ese mismo producto, y después guarda y publica.

La guía de PageFly sobre este elemento: [How to use the App blocks element](https://help.pagefly.io/page-structure-and-elements/shopify-elements/custom-content/how-to-use-shopify-app-block-element-with-pagefly-section).

**GemPages, Shogun y otros creadores** funcionan igual: las páginas de producto reciben el widget de la inserción de aplicación, y las demás páginas necesitan el elemento del creador para bloques de aplicación de Shopify con **Subscriptions + Bundles** añadido. Si tu creador no muestra el bloque, contacta con soporte.

|| Cuando tu página esté publicada, añade el producto al carrito con una suscripción seleccionada y comprueba que el carrito la muestra. Si no, envíanos el enlace de la página y colocaremos el widget por ti.

### Configurarlo en un tema sin publicar

**Activar widget** siempre abre tu tema publicado. Para configurarlo y probarlo antes en otro tema:

1. Ve a **Tienda online > Temas**, busca el tema y haz clic en **Personalizar** (o **Editar tema**).
2. Abre **Inserciones de aplicaciones**, activa **Supr Bundle & Subscriptions** y haz clic en **Guardar**.
3. Previsualiza ese tema y abre un producto que esté en una de tus ofertas.

El widget solo aparece en los temas en los que está activado, así que tu tema publicado no cambia hasta que lo actives también ahí. Tus ofertas son compartidas por todos los temas: cuando el widget está activado en tu tema publicado, todas las ofertas **Publicadas** aparecen ahí.

### Solución de problemas

|| Si el widget no aparece después de guardar, confirma que el editor de temas guardó correctamente. Puedes volver a hacer clic en **Activar widget** para intentarlo de nuevo.

Si sigues sin ver el widget en tus páginas de producto, sigue los pasos de [El widget de suscripciones no se muestra en mi tienda](https://supr-bundles-and-subscriptions.crisp.help/es/article/the-subscription-widget-is-not-displayed-in-my-store-1x65p8q/). Si aparece dos veces o en el sitio equivocado, consulta [El widget de suscripciones aparece dos veces o al final de la página](https://supr-bundles-and-subscriptions.crisp.help/es/article/the-subscription-widget-appears-twice-or-at-the-bottom-of-the-page-1tu0pz2/).

### Preguntas frecuentes

**¿Tengo que añadir a mi tema un código de inserción o un fragmento de Liquid?**
No. **Diseño > Activar widget** activa el widget en tu tema, y tú haces clic en **Guardar** en el editor de temas. No hay que pegar nada.

**Hice clic en Activar widget, pero no cambió nada en mi tienda. ¿Por qué?**
Casi siempre es porque se cerró el editor de temas sin hacer clic en **Guardar**. Vuelve a hacer clic en **Activar widget** y haz clic en **Guardar** en la parte superior derecha del editor de temas.

**¿Necesito la inserción de aplicación y el bloque de aplicación?**
Necesitas la inserción de aplicación. El bloque **Subscriptions + Bundles** es opcional: añádelo solo para elegir una posición exacta o para mostrar el widget en una página que no sea de producto. Usar los dos nunca muestra el widget dos veces.

**El editor de temas dice que no se pudo añadir el bloque de aplicación. ¿Qué hago?**
Usa en su lugar la inserción de aplicación: **Diseño > Activar widget** y después **Guardar**. La inserción no necesita un sitio en tu sección de producto, así que funciona en temas cuya sección de producto no admite bloques de aplicación.

**¿Tengo que añadir el widget a cada producto?**
No. El widget aparece en todos los productos que estén en una oferta Publicada. Los productos se eligen en la oferta, en **Se aplica a**, no en el tema.

**¿Puedo mostrar el widget en mi página de inicio o en una landing page?**
Sí. Añade una sección **Producto destacado**, añádele el bloque **Subscriptions + Bundles** y configura su **Product**. Consulta [Mostrar el widget en otras páginas](#3-mostrar-el-widget-en-otras-paginas).

**¿Pueden los clientes elegir una suscripción en la página del carrito?**
Sí, con el complemento **Venta adicional en el carrito** de la página **Diseño**: un botón **Suscríbete y ahorra** bajo cada producto comprado como compra única, en la página del carrito y en el carrito lateral, pasa ese producto a su primera opción de suscripción. Para elegir otra frecuencia, los clientes eligen en la página de producto. En Shopify Plus, el Checkout Subscription Picker también les permite cambiar en la pantalla de pago; consulta [Cambiar a una suscripción en la pantalla de pago](https://supr-bundles-and-subscriptions.crisp.help/es/article/what-shoppers-see-in-the-cart-and-at-checkout-1lwsuj4/#3-cambiar-a-una-suscripcion-en-la-pantalla-de-pago-shopify-plus). Consulta [Venta adicional en el carrito](https://supr-bundles-and-subscriptions.crisp.help/es/article/product-page-add-ons-i1yvs4/#3-venta-adicional-en-el-carrito).

**¿Puedo poner el widget debajo del botón de añadir al carrito?**
Sí. En la página **Diseño**, pon **Ubicación > Posición en la página de producto** en **Bajo los botones de compra** y haz clic en **Guardar**. Consulta [Elegir una posición exacta](#3-elegir-una-posicion-exacta).

**¿Cómo muevo el widget encima del botón de añadir al carrito?**
Con la inserción de aplicación activada, ahí es donde se coloca por sí solo. Si está en otro sitio, consulta [El widget de suscripciones aparece dos veces o al final de la página](https://supr-bundles-and-subscriptions.crisp.help/es/article/the-subscription-widget-appears-twice-or-at-the-bottom-of-the-page-1tu0pz2/).

### Guías relacionadas

* [[Videoguía] Cómo activar la INSERCIÓN DE APLICACIÓN](https://supr-bundles-and-subscriptions.crisp.help/es/article/video-guide-how-to-enable-app-embed-1lma8or/)
* [El widget de suscripciones](https://supr-bundles-and-subscriptions.crisp.help/es/article/the-subscription-widget-19d32zw/)
* [El widget de suscripciones no se muestra en mi tienda](https://supr-bundles-and-subscriptions.crisp.help/es/article/the-subscription-widget-is-not-displayed-in-my-store-1x65p8q/)
* [El widget de suscripciones aparece dos veces o al final de la página](https://supr-bundles-and-subscriptions.crisp.help/es/article/the-subscription-widget-appears-twice-or-at-the-bottom-of-the-page-1tu0pz2/)
* [Crear invitaciones de suscripción (enlaces de suscripción rápida)](https://supr-bundles-and-subscriptions.crisp.help/es/article/creating-subscription-invitations-quick-subscribe-links-15k2i6g/)
* [Qué pasó con el editor del widget](https://supr-bundles-and-subscriptions.crisp.help/es/article/what-happened-to-the-widget-editor-1o1gdnh/)