Manage Placements

A placement serves as the container where a visitor's video experiences occur and is linked to a strategy. A strategy uses a set of rules to determine the specific experiences displayed within that placement.

It is through embedding a placement on your web pages that a visitor begins to interact with a strategy.



Create a placement

Dashboard

  1. On the Placements list page, click Create Placement. A new placement details page appears.
  2. Click the default name (Untitled Placement Name) to rename the placement. Though not required, giving a placement a unique name allows it to be quickly distinguished from other placements.
  3. Click Save.

API

Use the following recipe to create a placement.



Deploy a placement

Embed Scripts section

Embed Scripts section

Follow these steps to deploy a placement:

  1. On the Placements list page, click the name of the placement. The placement details page appears.

  2. Under Embed Scripts, deploy the placement with either the Header Method or Inline Method.

    Integration Embed TypeDescriptionUsage
    Header Method(Recommended) Site-specific embed script added to the <head> element that locates and loads strategies into placement-specific <div> elementsLoading multiple placements on a specific page
    Inline MethodEmbed script that loads a strategy into a specific placement on the page

    You can also load a placement in a different location than the embed script.
    Loading a single placement on a specific page

    📘

    Be mindful of the following when deploying the placement:

    • Whether using a content management system (CMS), Google Ad Manager (GAM), Tag Manager, or some other method, the <div> must be on the page on the initial DOM load. For these use cases, use the inline method.
    • A given placement ID can only be used in one <div> element per page. However, a placement ID can be used on multiple pages.
    • If the placement ID is invalid, the <div> element will remain empty.
  3. (Optional) Provide custom data to be used when evaluating rules for a placement.



Provide custom data

Custom data can be added for a specific placement. These parameters apply to a specific placement, such as a placement-level behavior.

Expand each of the following options to learn about the possible ways to add custom data:

Query Parameters

Custom data is added through a query string appended to the embed URL

Topic Details
ParsingOnly at page load
Supported Data TypesStrings
Requirements
  • Placement-level custom parameters are prefixed with custom.{placement-id}, such as custom.abcd1234 in the example below.
  • Custom parameters must be lowercase.
Data Override RulesOverridden by:
  • HTML Attributes
  • jwDataStore
Example
&custom.abcd1234.view_type=advert



HTML Attributes (Required for Header Method)

Custom data is added through data attributes added to a JW placement <div> element

Topic Details
ParsingOnly at page load
Supported Data TypesStrings
Requirements
  • The JW placement has data-jw-placement-id defined.
  • Placement-level custom parameters are prefixed with data-jw-
  • Custom parameters must be lowercase.
Data Override RulesOverrides:
  • Query Parameters
Overridden by:
  • jwDataStore
Example
<div 
    id="jwp-placement-1"
    data-jw-placement-id="plac1234"
    data-jw-media_id_1="medi1234"
    data-jw-playlist_id_1="play1234">
</div>



jwDataStore

Custom data is added through attributes added at the page level.

Topic Details
ParsingAt every rule evaluation
Supported Data TypesAll types
Requirements
  • Custom parameters are stored in jwDataStore.custom.
  • Placement-level custom parameters are stored in jwDataStore.custom.{placement-id}, such as jwDataStore.custom.abcd1234 in the example below.
  • Custom parameters must be lowercase.
Data Override RulesOverrides:
  • Query Parameters
  • HTML Attributes
Example
const jwDataStore = window.jwDataStore || { custom: {} };
jwDataStore.custom.abcd1234 = { view_type: "advert" };
window.jwDataStore = jwDataStore;



FAQ

Can a placement be loaded in a different location than the inline embed script?

Yes.

To load the placement in a different <div> element than where the (inline embed script) is located, append the divId query parameter with the <div> element ID to the embed.js URL.

The following example loads the placement into a <div> element named loading-div.

<script src="https://cdn.jwplayer.com/v2/sites/{site_id}/placements/{placement_id}/embed.js?divId=loading-div"></script>