top of page

Live Creatives Player Widget

Add a real-time feed of the creatives playing on your screens with the Live Creatives Player Widget that you can embed into your website.

The following is a step by step guide, using the billboard operator "Gusaas Signs" as our example

Create a new Private App

Under your personal profile, with developer mode on, click on Apps and then click New Application. (Learn more about creating new apps here)

Name your application something like "{My Company Name} Website Widgets" and select "Private" for your application class

Once you have added your app, you can adjust settings on the main page as needed.

Widget Capabilities

In order for this app to be used for Website Embeds, you will need to add the Widgets capability to your app

Click on the CAPABILITIES tab, and select the switch for Widgets to add this capability

Operator Permissions

This widget is designed for Media Owner websites. On the Permissions tab of your app, select the following permissions

  • view

  • viewAnalytics

Public Token

Website widgets use a Public token to fetch their content. On the TOKENS tab, click NEW TOKEN, and select Public token

Write down your Public Token - We will need it later

Add your App to your Operator Account

Now that you have created your app, you will need to add it to your operator account in order for it to have access to pull real times stats and creatives for your digital screens

Switch to your Operator Account using the Profile Switcher

Click on Settings and then scroll to Apps & Data Sources and click Add New

Find your app in the list and click on it to add it

When complete, your Widget App should appear in your list of apps

Now that we have created the app,. and authorized it, we can get the Widget Code to embed into your website.

Widget Embed Code

Use the following embed code, b e sure to replace `{PUBLIC_TOKEN}` with your actual Public Token that you created above.

Copy and paste this code directly into your website and you should start to see creatives appearing right away.

Custom Settings

You can customize the following settings of this component


Use the board_identifiers parameter to specify an array of digital board ID's based on your vendor supplied board_identifier

board_identifiers : ["ND0002.1","ND0003.1","ND0099.2"]

The following are style properties that allow you to control the styles of the widget.

These use json, React style parameters (so, for instance. the css property max-width : "100%"'; would be written as "maxWidth:"100%",

The default styles for these are as follows :


The container style is the box around the image


Image style is applied to the image itself


This style is applied to the information window that appears below the image


bottom of page