Station PBS KIDS Video Module

OverviewInteracting with this moduleUpdatesPresentationSupported browsers and operation systemsHow to implement

Overview

The Station PBS KIDS Video module provides children ages 2-8 an opportunity to watch clips and full-length episodes from their favorite PBS KIDS properties on an on-demand basis.  s of 2017, the module offers a LIVE TV Kids have access to over 30 PBS KIDS shows and over 5,000 videos, and afeature which provides kids the ability to watch the 24/7 PBS KIDS digital livestream localized to your station's TV times. 

The module is an "iFramed" version of the National PBS KIDS Video player located at   The video player design is mobile-friendly, https://pbskids.org/video.responsive, and can be viewed on any mobile device (CSS changes must be made by the station). Any content and development updates made on our national player will automatically be updated in the module. 

Interacting with this module

Users can:

Select seriesView video in fullscreenView video with closed captioning in VOD or LIVE TV modeView video with just LIVE TV mode (no VOD)Format closed captions in VOD or LIVE TV modeControl volumeSelect LIVE TV based on your station's scheduleSelect games button for show they are watching

The PBS KIDS Station Module was updated on September 10, 2019. This new update includes the following new element: 

The module can now only showcase the 24/7 livestream video (no VOD) with a small code change. 

In video-on-demand mode, users can select their favorite show by clicking on the show icon (Figure 1). 

Figure 1

Don't have a Bento site? Get the code for this module here

This component is intended for station use only. It's recommended that this component be placed in a one-column layout.

The LIVE TV button is located on the far left of the show carousel. The show icon changes every half hour, depending on what is playing in the station's local area. Once a user hits the LIVE TV button, the color of the video player changes. User can no longer play/pause the video (Figure 2).

Figure 2

Your station logo appears at the upper left hand corner when user is in FULL SCREEN mode (Figure 3). 

Figure 3

A mobile version of the player is available, depending on the CSS that is implemented on your site (Figure 4).

Figure 4

Supported browsers and operation systems

The Station PBS KIDS Video module was tested on and works on the following browsers and operating systems:

Platform Chrome 55+ Safari 9.0+ Internet Explorer 11 Firefox 50+ Native

Mac (Yosemite, El Capitan, Sierra)

Windows 10

iOS 9 and above

Android 4.1.0 and above

Please note: For Windows 10, Edge browser experiences, a loading issue occurs where LIVE TV fails 50 percent of the time. This is because of the iFrame code. Since this is browser dependent, we cannot fix this bug currently. It is a known issue, and we hope to have it resolved once Windows provides an update. 

How to implement

From the main Bento administration dashboard, click (Figure 1).Pages

Figure 1

Click the to which you want to add the Station PBS KIDS Video Module custom component (Figure 2).page

Figure 2

Please note that in order to use this module, you must whitelist your station URL with PBS. Please to have submit a support ticketyour website whitelisted. Allow at least three to five business days for this to be completed. If you do not whitelist your video player, you will see the following message.

In the Page Content section, click the and click  (Figure 3.1).Available  dropdown menuComponents Custom ComponentClick Add Component (Figure 3.2).

Figure 3

Click the and click (Figure 4).component dropdown menu Station PBS KIDS Video Module

Figure 4

In the Station Call Letters textbox, type the to which you want the videos to localize (example: WETA) (Figure 5).call letters of the station 

Figure 5

In the upper right side of the screen click to view the page in a browser (Figure 6).Preview site

Figure 6

Your custom component appears (Figure 7).

Figure 7