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

# How to Install Rokt Thanks on TapCart

> A Setup Guide for TapCart App Studio

## What is Rokt Thanks?

Rokt Thanks displays personalized, non-intrusive offers to your customers on the post-purchase confirmation screen. It's a simple way to generate passive revenue from every order without impacting the customer experience.

This guide walks through how to install Rokt Thanks within your TapCart mobile app using a Custom Code Block. The setup takes just a few minutes.

## Before you start

You will need the following:

* **TapCart Enterprise plan** - Custom Code Blocks are only available on Enterprise. If you're unsure about your plan, check with your TapCart account rep.
* **Your Rokt Account ID** - your Aftersell account manager will provide this. If you don't have it yet, just reach out and we'll send it over.

## Step 1: Create a Custom Block

Log in to your TapCart dashboard and open the App Studio editor. Create a new Custom Block.

## Step 2: Paste the code snippet

In the Custom Block editor, switch to the Dev section. Clear any placeholder code and paste the snippet below:

```jsx theme={"theme":{"light":"snazzy-light","dark":"github-dark"}}
import * as React from "react"
 
export default function RoktPlacement({
  blockConfig,
  tapcartData,
  translations,
  pageState,
  useActions,
}) {
  const containerRef = React.useRef(null)
 
  React.useEffect(() => {
    const loadRokt = async () => {
      try {
        await new Promise((resolve, reject) => {
          if (document.getElementById("rokt-launcher")) {
            resolve()
            return
          }
          const script = document.createElement("script")
          script.type = "text/javascript"
          script.src =
            "https://apps.rokt.com/wsdk/integrations/launcher.js"
          script.fetchPriority = "high"
          script.crossOrigin = "anonymous"
          script.async = true
          script.id = "rokt-launcher"
          script.addEventListener("load", () => resolve())
          script.addEventListener("error", (error) => reject(error))
          document.head.appendChild(script)
        })
 
        const launcher = await window.Rokt.createLauncher({
          accountId: "YOUR_ACCOUNT_ID",
          sandbox: true,
        })
 
        await launcher.selectPlacements({
          identifier: "TapCart.success",
          attributes: {
            email: tapcartData?.customer?.email || "",
            firstname:
              tapcartData?.customer?.firstName || "",
            lastname:
              tapcartData?.customer?.lastName || "",
          },
        })
      } catch (error) {
        console.error("Rokt SDK failed to load:", error)
      }
    }
 
    loadRokt()
  }, [])
 
  return <div id="rokt-placeholder" ref={containerRef} />
}
```

<Info>
  ### Replace Your Account ID

  In the snippet above, find the line `accountId: "YOUR_ACCOUNT_ID"` and replace `YOUR_ACCOUNT_ID` with the Account ID provided by your Aftersell account manager.

  Once updated, save the Custom Block.
</Info>

## Step 3: Add to your Post Purchase page

Navigate to your Post Purchase page in TapCart's visual editor. Drag the Custom Block you just created onto the page and drop it wherever you'd like the offers to appear.

## Step 4: Let us know

Once you've completed the steps above, let your Aftersell account manager know. We'll finalize a quick configuration on our end and confirm when everything is live.

The snippet is initially set to sandbox mode, which loads test offers so you can preview the placement. Once we've confirmed everything looks good together, we'll switch it to live and you'll start earning revenue.

## Summary

| Step | Action                                                                                              |
| ---- | --------------------------------------------------------------------------------------------------- |
| 1    | Create a Custom Block in TapCart's App Studio editor                                                |
| 2    | Paste the code snippet into the Dev section (replace `YOUR_ACCOUNT_ID` with your actual Account ID) |
| 3    | Drag the Custom Block onto your Post Purchase page                                                  |
| 4    | Notify your Aftersell account manager so we can finalize setup                                      |

## Frequently asked questions

**Do I need to be on TapCart Enterprise?**

Yes. Custom Code Blocks in App Studio require TapCart's Enterprise plan.

**Will this slow down my app?**

No. The script loads asynchronously and won't block your page from rendering.

**Can I choose where the offer appears on the page?**

Absolutely. Once the Custom Block is saved, you can drag it to any position on your Post Purchase page using TapCart's visual editor.

**What kind of offers will my customers see?**

Rokt Thanks serves relevant, non-intrusive offers from premium advertisers tailored to each customer.