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

# Funnel demos

> Reference funnels by type — basic post-purchase, geo-based, VIP tags, cart value. Each one ships a clonable example.

# Funnel demos

This category is a **catalog of funnel types**. Each demo is a complete, copyable pattern: the graph, the offers, and how the thank-you page shows what the customer actually bought.

Start with the simplest — a DTC post-purchase flow — then pick a routed variation: geo, CRM tags, or cart value. More types will land here (subscriptions, digital goods, storefront inbound, …) without changing this page’s job: **pick a type, reproduce it**.

<Info>
  **Finished projects:** every published demo has a clonable app on GitHub — [`basic-post-purchase`](https://github.com/TagadaPay/examples/tree/main/basic-post-purchase), [`geo-offers`](https://github.com/TagadaPay/examples/tree/main/geo-offers), [`vip-tag-offers`](https://github.com/TagadaPay/examples/tree/main/vip-tag-offers), [`cart-value-upsell`](https://github.com/TagadaPay/examples/tree/main/cart-value-upsell). Clone one, run `tagada-init` → `pnpm seed` → `pnpm dev`, and walk the graph before you rebuild it.
</Info>

<Tip>
  **Import into the CRM (beta).** Each example ships a `funnel.bundle.json` — products, offers, and the graph. In the dashboard: store → Funnels → **Import bundle**, then tick what should travel (payment settings, shipping rates, address form, access restrictions, custom scripts, offers & products); groups the file does not carry show disabled. The store needs a default payment flow. Preview from the **landing** step (checkout alone has no cart). Pixels, plugin instances and routes never travel; carried payment flows, processors and shipping rates that do not exist on the target account are dropped with a warning. Exporting your own funnel (row menu → **Export bundle**) offers the same choices.
</Tip>

<Info>
  These demos are the *shape* of the funnel (nodes, edges, offers). You can build the same shape in the [dashboard](https://app.tagada.io), in [TagadaStudio](https://studio.tagadapay.com), with the [Node SDK](/developer-tools/node-sdk/upsell-downsell-funnel), or on your own domain with the [Headless SDK](/developer-tools/headless-sdk/introduction).
</Info>

***

## How to read a demo

Every demo page answers the same four questions:

1. **Graph** — which steps, which edges, which `when` conditions
2. **Catalog** — which products and checkout offers you need
3. **Pages** — native, Studio, Plugin SDK, or self-hosted Headless
4. **Thank you** — how add-on orders show up (`relatedOrders`)

Concepts (node types, routing, analytics) live in the [Funnel Orchestrator](/developer-tools/funnels/funnel-orchestrator). This category does not repeat that — it shows **worked examples**.

***

## Types

| Type                                                                     | Graph                                                                                     | Status    |
| ------------------------------------------------------------------------ | ----------------------------------------------------------------------------------------- | --------- |
| [Basic post-purchase](/developer-tools/funnel-demos/basic-post-purchase) | Landing → checkout → OTO → downsell → second OTO → thank you                              | Published |
| [Geo-based offers](/developer-tools/funnel-demos/geo-offers)             | Checkout → 🇺🇸 / 🇪🇺 / 🌍 offer (`customer.fromCountry`, `customer.fromEU`) → thank you | Published |
| [VIP tag offers](/developer-tools/funnel-demos/vip-tag-offers)           | Checkout → ⭐ VIP / 🆕 welcome offer (`customer.hasTag`) → thank you                       | Published |
| [Cart-value upsell](/developer-tools/funnel-demos/cart-value-upsell)     | Checkout → premium / add-on offer (`mainOrder.totalGreaterThan`) → thank you              | Published |
| Subscription / rebill                                                    | Checkout → offer (plan) → thank you                                                       | Coming    |
| Digital (no shipping)                                                    | Checkout → offer → thank you                                                              | Coming    |
| Storefront inbound                                                       | Shopify / Woo product → checkout → thank you                                              | Coming    |

<Tip>
  Start with **Basic post-purchase** even if your catalog is not apparel. The type is the graph (accept / decline / related orders), not the products.
</Tip>

***

## Which SDK?

| You want…                                | Use                                                                         |
| ---------------------------------------- | --------------------------------------------------------------------------- |
| The demo look, hosted on Tagada          | Studio pages on funnel steps                                                |
| The graph live in 10 minutes, default UI | [Node SDK + native pages](/developer-tools/node-sdk/upsell-downsell-funnel) |
| The same journey on *your* domain        | [Headless SDK](/developer-tools/headless-sdk/offers) — you own the routes   |
| A React plugin on Tagada’s edge          | [Plugin SDK](/developer-tools/sdk/tutorial)                                 |

<Note>
  **Headless SDK ≠ Studio.** `@tagadapay/headless-sdk` runs on your site. Studio / Plugin pages run on Tagada. Same offers and `mainOrderId` either way.
</Note>

<CardGroup cols={2}>
  <Card title="basic-post-purchase" icon="github" href="https://github.com/TagadaPay/examples/tree/main/basic-post-purchase">
    Landing, checkout, cap OTO, downsell, tote, thank you
  </Card>

  <Card title="geo-offers" icon="github" href="https://github.com/TagadaPay/examples/tree/main/geo-offers">
    One checkout, three localized offers — 🇺🇸 / 🇪🇺 / 🌍
  </Card>

  <Card title="vip-tag-offers" icon="github" href="https://github.com/TagadaPay/examples/tree/main/vip-tag-offers">
    CRM tags pick the offer — ⭐ VIP hoodie or 🆕 welcome cap
  </Card>

  <Card title="cart-value-upsell" icon="github" href="https://github.com/TagadaPay/examples/tree/main/cart-value-upsell">
    The real order total picks the offer — premium or easy add-on
  </Card>
</CardGroup>