Skip to main content
All CollectionsPixels & Events
Setting up JavaScript pixels and events
Setting up JavaScript pixels and events

How to set up a base pixel and custom events.

Updated over 2 months ago

How to set up pixels & events

Step 1: Find your base pixel

When creating your campaign, we recommend setting up your base pixel at the start.

Events can't fire on your website without a base pixel, so it's important that you place the base pixel before setting up additional events

First, head to the Events page in the top nav:

Then, tap this button to bring up the base pixel code:

Then, copy the code that'll be generated for your product right from the fly-out. This is just an example.


Step 2: Place your base pixel

When you place a base pixel, a page view event is automatically included for you. You will not need to install a separate page view event.

To ensure reporting captures page views, click "Select event type" and then click Page views.

Copy the code that's generated for your product and send it to your web developer, or if you're placing it yourself, locate your website's header code. If your site has a global header, you only need to place the code once. If not, place it in the header code on every webpage, like this:

<html>
<head>
Insert copied base code here
</head>
<body>
</body>
</html>

Very important! It must be placed in the head, not the body or it won't send the valuable data from your website to Roku


Step 3: Select your events

Go to the Events page from the top nav to get started. You can create and place an event for any of the following events (the more the better):

  • Page views

    • note: The Page view event is included in the Base pixel you have already installed. Do not install a separate base pixel. Just select the Page view event from the drop down and move on to any additional events.

  • Add to cart

  • Purchases

  • Installs

  • Sign-ups

  • Subscribes

We recommend adding as many events as possible. Once you install a new event, you'll be able to optimize your campaign to drive those specific actions.


Step 4: Placing your event

After you select your events, you'll get a unique code snippet for each event, which again, you can send to your web developer or follow the steps to place it yourself.


Step 5 (optional): Augment your event

You can add additional metadata to your event for enhanced reporting like tracking ROAS (Return on ad spend), order value, and more.

Upon firing your events, you can pass along order details about your product or service. This is useful as it allows you to analyze your sales data and the effectiveness of your ads.

To pass your sales data to Roku, you should install a PURCHASE event on your site or app and then create a macro to pull in your sales metadata when the event is fired. Any of Roku’s events support a third value when firing for this purpose:

rkp('event', 'PURCHASE', <your metadata goes here>);

Any of the following additional properties can be appended to your metadata. To report on ROAS, average order value, and total order value, you will need to send the "value" parameter (see below).

Augment your event parameter (optional)

Data type

Description

content_category

String

Category of the page/product.

content_ids

Array of integers or strings

Product IDs associated with the event, such as SKUs (e.g. ['ABC123', 'XYZ789']).

content_name

String

Name of the page/product.

content_type

String

Use either ‘product’ or ‘product_group’ based on the IDs being passed in the content_ids or contents parameters. If the IDs are for products, then use ‘product.’ If the IDs are for product groups, then use ‘product_group.’

contents

Array of objects

An array of JSON objects that contains the individual items associated with your event quantity and the International Article Number (EAN) when applicable, or other product or content identifier(s). id, quantity and price are the required fields. delivery_category is an optional field e.g:

. [

{

'id': 'ABC123',

'quantity': 2,

'price': 10,

'delivery_category': 'in_store'

},

{

'id': 'XYZ789',

'quantity': 2,

'price': 5

}

].

See details in the ‘Contents objects’ section below for details about allowed values for each item included here.

currency

String

The currency for the value specified.

num_items

Integer

Used with InitiateCheckout event. The number of items when checkout was initiated.

predicted_ltv

Integer, float

Predicted lifetime value of a subscriber as defined by the advertiser and expressed as an exact value.

search_string

String

Used with the Search event. The string entered by the user for the search.

status

Boolean

Used with the CompleteRegistration event to show the status of the registration.

value

Integer or float

The value of a user performing this event to the business. Note: ‘Price’ is the price for a single item, and ‘value’ is the total price of the order.

order_id

String

The order ID for this transaction is expressed as a string. Example: 'order1234'.

delivery_category

string

Type of delivery for a purchase event. Supported values are:

  • in_store: Customer needs to enter the store to get the purchased product.

  • curbside: Customer picks up their order by driving to a store and waiting inside their vehicle.

  • home_delivery: Purchase is delivered to the customer's home.

Content objects

Note that id, quantity, and price are required fields. Delivery_category is an optional field.

Object

Data type

Description

id

string

International Article Number (EAN) when applicable, or other product or content identifier(s). id, quantity, and price are the required fields. delivery_category is an optional field

quantity

Integer

The quantity of thise item that is included in this event

price

Integer or float

The price for a single item in the purchase event E.g. there was 1 shirt ordered (quantity) for 19.99 (price)

delivery_category

string

As described in the parameters table above, but included here to support multiple delivery methods within a single event. E.g. a purchase where both physical and digital items are included

Example code snippet using all custom parameters

rkp('event', 'PURCHASE',{
value: 23.98,
currency: "USD",
delivery_category: "IN_STORE",
num_items: 3,
order_id: "ord12345",
content_category: "homewares",
content_ids: ["prod1234", "prod5678"],
contents: [
{
delivery_category: "IN_STORE",
id: "prod1234",
item_price: 19.99,
quantity: 1
},
{
delivery_category: "HOME_DELIVERY",
id: "prod5678",
item_price: 3.99,
quantity: 2
}
], content_type: " product_group",
content_name: "plates",
predicted_ltv: "300",
search_string: "New products",
status: "APPROVED"
});

Limited Data Use (LDU) is a data processing option that lets you limit how your event data is used in Roku's systems and helps to better support your compliance efforts with various US state privacy laws.

Did this answer your question?