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

# Surveys Script Integration

> Embed the Prime Earn survey wall directly into any webpage using a lightweight JavaScript snippet. No iFrame required — the widget mounts into any container element you choose.


# Surveys Script Integration

The Script Integration lets you embed the Prime Earn survey wall directly into your page using a small JavaScript snippet. Compared to the [IFrame Integration](./iframe), this approach gives the widget tighter visual integration with your page — it renders inside any container element you specify rather than inside a separate frame.

<Info>
  Already using the Offers Script Integration? The setup is identical — just replace `"offers"` with `"surveys"` in the `module` field and point your container to the surveys `<div>`.
</Info>

***

## Step 1 — Add a Container Element

Add an empty `<div>` anywhere on your page where you want the survey wall to appear. Give it an `id` so the script can find it.

```html theme={null}
<div id="primeearn-surveys" style="height: 600px; width: 100%;"></div>
```

You can name the `id` anything you like. Set the height and width to match your layout.

***

## Step 2 — Add the Script Snippet

Paste this snippet on the same page, anywhere after the container div (or in a `<head>` script that runs after DOM ready).

```html theme={null}
<script>
(function () {
  window.psConfig = {
    container: "#primeearn-surveys",
    appId: "YOUR_APP_ID",
    userId: "USER_UNIQUE_ID",
    module: "surveys",
  };
  document.head.appendChild(
    Object.assign(document.createElement("script"), {
      src: `https://monetize.primeearn.com/ext/integration2.js?v=${Date.now()}`,
    })
  );
})();
</script>
```

Replace `YOUR_APP_ID` with your **Publisher App ID** from the Prime Earn dashboard, and `USER_UNIQUE_ID` with the current user's unique identifier in your system.

<Warning>
  Never hardcode a real user ID as a string literal. Always inject it server-side or from your authentication context so each user sees their own personalised survey list.
</Warning>

***

## Step 3 — Configure Parameters

All configuration goes inside `window.psConfig`. The table below covers everything a publisher needs to set up and run the integration correctly.

### Required

| Parameter | Type | Description |
| - | - | - |
| `container` | string | CSS selector of the element the widget mounts into (e.g. `"#primeearn-surveys"`). |
| `appId` | string | Your Publisher App ID. Available in the Prime Earn dashboard. |
| `userId` | string | Unique, persistent identifier for the end user in your system. |

### User Attributes

| Parameter | Type | Description |
| - | - | - |
| `maid` | string | Mobile Advertising ID — **IDFA** on iOS or **GAID** on Android. Must be passed when available. |
| `platform` | string | Host platform: `web` (default), `ios`, `android`. |
| `source` | integer | Numeric traffic source ID. Use the ID from the lookup table below. |
| `network` | integer | Numeric network ID. Use the ID from the lookup table below. |
| `placement` | string | Describes where in your app the widget is placed (e.g. `post_level`, `main_menu`). |

**Source & Network ID Reference**

| ID | Network | Source type |
| - | - | - |
| 1 | Google | Paid UA |
| 2 | Facebook | Paid UA |
| 3 | Instagram | Paid UA |
| 4 | Organic Google | Organic |
| 5 | Unknown | Other |
| 6 | Other | Other |
| 7 | Referral / Tell a friend | Organic |
| 8 | Apple Search Ads | Paid UA |
| 9 | TikTok Ads | Paid UA |
| 10 | Bidease | Paid UA |
| 11 | Mintegral | Paid UA |
| 12 | AppLovin | Paid UA |
| 13 | iOS organic | Organic |
| 14 | IronSource / Unity Ads | Paid UA |
| 15 | Moloco | Paid UA |
| 16 | Liftoff | Paid UA |
| 17 | Vungle | Paid UA |
| 18 | Email | Organic / Owned |
| 19 | Push notification | Organic / Owned |

### Localisation & Currency

| Parameter | Type | Default | Description |
| - | - | - | - |
| `language` | string | auto | Interface language. Use an ISO 639-1 code (e.g. `"en"`) or a full locale (e.g. `"en-US"`). Currently only English is supported. Leave empty to auto-detect. |
| `localization` | string | `"en-US"` | Full locale used for number and currency formatting (e.g. `"de-DE"`, `"fr-FR"`). |
| `currency` | string | — | Override the currency label shown next to reward amounts. |

***

## Step 4 — Customize the Design

You can override the widget's colors and visual style using the `customAppDesign` object. Pass any CSS variable overrides you want to apply:

```js theme={null}
window.psConfig = {
  container: "#primeearn-surveys",
  appId: "YOUR_APP_ID",
  userId: "USER_UNIQUE_ID",
  module: "surveys",
  customAppDesign: {
    "--p-primary-500": "#5B6CFF",   // primary accent color
    "--ps-pages-bg": "#0F1115",     // background color
  },
};
```

Contact your account manager to get the full list of available CSS variables for your integration.

***

## Full Example

```html theme={null}
<div id="primeearn-surveys" style="min-height: 600px; width: 100%;"></div>

<script>
(function () {
  window.psConfig = {
    container: "#primeearn-surveys",
    appId: "YOUR_APP_ID",
    userId: "USER_UNIQUE_ID",
    module: "surveys",
    platform: "web",
    maid: "USER_ADVERTISING_ID",
    language: "en",
    localization: "en-US",
  };
  document.head.appendChild(
    Object.assign(document.createElement("script"), {
      src: `https://monetize.primeearn.com/ext/integration2.js?v=${Date.now()}`,
    })
  );
})();
</script>
```


This documentation is built and hosted on [Mintlify](https://mintlify.com), a developer documentation platform.