In this article, you will discover:

  • What Environment Variables are
  • How to create Environment Variables
  • Why Environment Variables are useful

Introduction

Environment Variables is an advanced feature within the Website App that allows you to set different URL content to display on different devices that are displaying the same playlist.

Environmental Variables are designed to be used when you have a Playlist that is shared across different devices. That playlist includes pages that you need displayed on every device; these can be thought of as common pages. However, if you want to add a custom Website App page that displays a different URL based on the device, you can to use the Environmental Variables tool in the Web App to easily accomplish this.

Why Use Environment Variables

Environment Variables are a powerful tool. For example, it's common to have a shared playlist with general media and content that needs to be projected onto many different devices. However, it also may be required to display custom Website App content from within the same shared playlist which varies based on device. By placing the custom content in the same playlist, it prevents the need to create additional playlists to support custom Web App content, which would only clutter up things. 

Here's an example of a potential use case for this feature: A company would like to display a Playlist with the same slideshow content (e.g. company notices and images) across 6 offices in different cities. They want the playlist to have a single slide displaying the specific websites for each office's location.

Creating and Using Environment Variables

Step 1: Create your Environment Variable

In this step, we'll create a variable key on a single device to start the process.

Navigate to the Devices tab, and select a single device on which you'll be applying Environment Variables. Open the "Details" tab, and scroll down to the "Environment Vars" section. Click "Add." The system will then prompt you to enter a Variable Key and a Value.

  • Variable Key: A label the system will use to refer to the Environmental Variable. You can make this whatever you want, just don't use any capital letters or spaces.
  • Value: A URL that points to the desired web content. 

Note: This URL must be secure (https) in order to display properly on Chrome devices.

Later, you will select your other devices and set the unique URL for that same Variable Key. 

Step 2: Add the Variable to your Website App

Navigate to your Playlist, and create a new Website App. You may also choose to create the Website App from the Apps section should you choose to organize it into a specific app folder.

Under Properties, to the left of the "URL" field, click the drop menu.

Then, select the Environmental Variable you already created from the list. Once we select it, it will appear in the URL field and will automatically be applied.

Step 3: Apply Variable Rules to Different Devices

Back on the Devices page, select a second device on which you'll apply this environment variable. When adding an Environment Variable, you'll select the existing Variable Key and indicate the specific Variable (unique URL) you want the Website App to display on that device.

☝️Don't forget to apply this to all devices that are displaying a Website App with a variable key set as the URL.

Now, you've created and applied your first Environment Variable! To summarize: Environmental Variables are created at the device level, and are then linked to a Web App from the playlist page.

Once the Environmental Variable has been applied, note that the web content will not be displayed in the page preview, as it would be for a normal Web App. If you try to preview the page, the following message will appear: "Unable to preview an App with Environment Var at this moment. Please view with a paired or provisioned device." This is not an error message. You'll need to view the URL content on the device to test.

Now that you've set an Environmental Variable on the Web App page, you can easily customize the URL you would like to show on different devices. It's just that simple!



Did this answer your question?