--- updatedAt: 2026-07-30T11:12:12.000Z --- # Standard (aka JS Tag) ## Introduction This page explains how to integrate Taboola recommendations into a **standard** webpage, using the param values **provided by Taboola**. ### Prefilled tags If you received **prefilled** tags from **Taboola**, you can copy and paste them 'as is', instead of editing param values. ### New integration? If this is a new integration, please provide **Taboola** with a timeframe for launch, so we can plan post-launch QA. ## Supported browsers Taboola's **standard** integration (_aka_ **JS Tag** integration) is supported for any browser that is **fully** compatible with **ES5** (ECMAScript 5) or higher. This includes all modern web browsers. **Older** browsers (such as **IE 11**) may encounter problems with **video ads**. ## Step I: Add the *loader* tag 1. Add the **Taboola *loader* tag** to the page ``. > Fill in your specific **param** values, **as provided by Taboola** (or use the prefilled tag that was sent to you). ```html Loader tag ``` 2. **Replace** the placeholder values at the top of the tag with the **param** values **provided by Taboola** (or use the prefilled tag that was sent to you): **Editing instructions:**
Placeholder Instructions Notes
`` Fill in your Publisher ID, **as provided by Taboola**: `var PUBLISHER_ID = 'acme-news';` The CDN loader URL, privacy fallback URL, and pixel URL are all derived from this constant. Your Publisher ID is a _unique, alphabetic string_, **provided by Taboola**. E.g. `"acme-news"`
`'auto'` To obtain an automated ID, leave this param as is: article:`'auto'` Else, insert your own, internal ID: article:`'123'` Specifies the ID of this page, for the given page type.
`` **Replace** with the relevant page type, **as provided by Taboola**: `var PAGE_TYPE = 'article';` Possible values: `video`, `article`, `photo`, `search`, `category`, `home`.
### loader.js **loader.js** initiates communication with **Taboola** and contains _publisher-specific_ resources and configurations for your integration. This tag also includes automatic **private traffic** support: it automatically falls back to a **non-tracker** loader that sets no cross-site cookies and runs no fingerprinting scripts. ## Step II: Add the *placement* tags ### Best practice For a **below-article** placement, insert the **tag** in a _separate_ container to the main article (see below). ```html Below-article placement in a separate container
...
``` For **each placement** on a given page: 1. Add a ***placement* tag** to the ``, in the location that the placement should display. > Each placement has both a `
` tag and ` ``` ### Params > These are **sample** values only. Make sure to fill in **your own** values, **as provided by Taboola**. - `mode` - The UI Mode ID for this placement, **as provided by Taboola**: - E.g. `'thumbnails-a'`. - `container` - The ID of the `
` container for this placement's content: - E.g. `'taboola-below-article-thumbnails'`. - `placement` - The placement name, **as provided by Taboola**: - E.g. `'Below Article Thumbnails'`. - `target_type` - The target type, **as provided by Taboola**: - E.g. `'mix'`. ### Guidelines 1. Each placement must have its own JS tag. 2. On a given page, each JS tag must have **unique** values for `container` and `placement`. Do **not** duplicate a JS tag on the same page. (For _special use cases_, see [below](https://developers.taboola.com/web-integrations/docs/js-tag#auto-generating-placement-names).) 3. The value for `container` must match the ID of the `
` container for the placement. ### Custom Segments To **target** a custom segment - or simply **track its performance** - you can **optionally** pass a `cseg` param. For more information, see [Custom Segments](https://developers.taboola.com/web-integrations/docs/custom-segments) - or reach out to your **Taboola Account Manager**. *** This flow typically requires **custom development**. ## Step III: Add the *flush* tag 1. Add the **Taboola *flush* tag** to the page ``, *immediately after the last placement tag*: ```html Flush tag ``` ### Guidelines - The `flush` flag instructs **Taboola** to fetch recommendations (and not wait for additional data). - Pass the `flush` flag **once** only - **after** passing all placements for that page. - If you have unique requirements, reach out to **Taboola** to discuss alternative flows. ### Need a hand? Feel free to reach out on our [Community Discussion](https://developers.taboola.com/web-integrations/discuss) page! ## Special use cases ### Generating placement names *Occasionally*, you may want to generate your own placement names - e.g. to re-use a placement for backfill. In that case, make sure to follow the guidelines below. ### Guidelines 1. On a given page, each JS tag must have **unique** values for `container` and `placement`. 2. **Placement names** are used for **reporting**, and **should be kept meaningful**: 1. Consider appending an integer to the original placement name - e.g. `'Below Article Thumbnails 1'`, `'Below Article Thumbnails 2'`, etc. 2. **Avoid** using a **randomly generated string** or **numeric ID** as a placement name. 3. Keep the total number of placement names to **100 or less**, for a given account. *** For more information, or specific requests, reach out to your **Taboola Account Manager**. ## What's Next? 1. In order to provide *personalized* recommendations for impressions in the *EU* and *California*, make sure to implement [GDPR and CCPA](https://developers.taboola.com/web-integrations/docs/gdpr-and-ccpa) respectively. 2. If you have not already done so, configure [ads.txt](https://developers.taboola.com/web-integrations/docs/ads-txt). 3. Contact **Taboola** so that we can verify your implementation.