> ## Documentation Index
> Fetch the complete documentation index at: https://docs.digifist.com/llms.txt
> Use this file to discover all available pages before exploring further.

# Widget Installation

> Install the Back-in-Stock subscription widget on your Shopify storefront via Galantis script tag injection.

The Back-in-Stock widget is injected into your Shopify storefront automatically by Galantis using a script tag — no manual theme editing required. When a product variant has zero inventory, the widget button appears on that product page and lets customers submit their WhatsApp number to subscribe for a restock notification.

## What this covers

* How script tag injection works
* Installation steps
* How to verify the widget is live
* Troubleshooting display issues

## How installation works

Galantis writes a script tag to your Shopify store using the `write_script_tags` permission granted during app installation. The script loads on product pages automatically and checks variant inventory in real time — displaying the subscription button only when a variant's `inventory_quantity` is `0`.

No changes to your Shopify theme files are needed. The widget is added and updated entirely through Shopify's script tag system.

<Note>
  The `write_script_tags` Shopify permission is required for the widget to inject. This permission is requested during the initial Galantis app installation. If the widget is not appearing, verify this permission is active under **Shopify Admin → Apps → Galantis → Permissions**.
</Note>

## Installation steps

<Steps>
  <Step title="Open Back-in-Stock Settings">
    In the Galantis dashboard, go to **Back-in-Stock → Settings**.
  </Step>

  <Step title="Configure widget appearance">
    Set the button position, colors, label text, and modal copy before saving. The widget script will be injected with these settings applied. See [Widget Design](./widget-design) for the full settings reference.
  </Step>

  <Step title="Save settings">
    Saving triggers Galantis to write or update the script tag in your Shopify store. No further action is required to deploy the widget to your storefront.
  </Step>

  <Step title="Verify on your storefront">
    Navigate to a product page with at least one out-of-stock variant. The subscription button should appear for the out-of-stock variant. Switch to an in-stock variant — the button should disappear.
  </Step>

  <Step title="Submit a test subscription">
    Enter your own WhatsApp number in the widget and submit. Confirm a subscription record appears in **Back-in-Stock → Subscriptions** with `ACTIVE` status.
  </Step>
</Steps>

## How the widget detects out-of-stock variants

The widget script evaluates the current variant's `inventory_quantity` on the product page. When a customer switches between variants — selecting a different size or color — the widget dynamically shows or hides based on whether the selected variant is in stock.

This evaluation happens client-side using the variant data embedded in the Shopify product page. It reflects the inventory state at the time the page was loaded — a variant that goes out of stock after the page was opened will not trigger the widget until the page is refreshed.

## Placement options

The widget button can be positioned in three ways, configured under **Back-in-Stock → Settings → Button position**:

* **Right** — Bottom-right corner of the page
* **Left** — Bottom-left corner of the page
* **Custom** — Precise placement via CSS offset values, useful when your theme's layout conflicts with the default positions

The subscription modal that opens when a customer taps the button is centered on the page regardless of button position.

## Verifying the widget

After saving settings, confirm the widget works correctly by completing each check:

| Check                                  | How to verify                                                                              |
| -------------------------------------- | ------------------------------------------------------------------------------------------ |
| Button appears on out-of-stock variant | Visit a product page with an out-of-stock variant — button should be visible               |
| Button disappears on in-stock variant  | Switch to an in-stock variant on the same product — button should hide                     |
| Modal opens correctly                  | Tap the button — the subscription modal should open with your configured headline and form |
| Submission creates a subscription      | Submit your WhatsApp number — check **Back-in-Stock → Subscriptions** for the new record   |

## Troubleshooting

**Widget not appearing on any page**

* Confirm Galantis has `write_script_tags` permission in **Shopify Admin → Apps → Galantis → Permissions**
* Clear your browser cache and reload the product page on your live storefront — not in the Shopify theme editor preview
* Check your browser console for JavaScript errors that may indicate a script loading conflict with your theme

**Widget not appearing on a specific product**

* Confirm the variant you are viewing genuinely has `inventory_quantity = 0` in Shopify — the widget only appears for zero-inventory variants
* If the product uses a third-party inventory management app, confirm that app's inventory data is reflected correctly in Shopify's native inventory fields

**Widget appears but submission fails**

* Check the browser console for network errors on the subscription submission request
* Confirm your WhatsApp Business Account is connected under **Settings → WhatsApp Connection**

<Warning>
  The Shopify theme editor preview does not execute third-party script tags. Always verify the widget on your live storefront URL. Testing in the Shopify Customizer preview will show the widget as absent even when it is correctly installed.
</Warning>

## Related guides

* [Widget Design](./widget-design) — Customizing the widget's appearance before or after installation
* [Subscription Lifecycle](./subscription-lifecycle) — What happens after a customer submits their number
* [Getting Started — First Back-in-Stock](/whatsapp/getting-started/first-back-in-stock) — End-to-end setup walkthrough including a restock test