3Play Plugin: iFrame Embed Method – 3Play Media Support

The 3Play Plugin helps makes videos interactive, engaging, and more accessible. With the 3Play Plugin, you can add an interactive transcript, closed captions, and/or audio description to your videos. Features can also be included to boost SEO. The 3Play Plugin is compatible with most major video players and is compatible with most publishing environments, including LMSs.

While two embed methods are offered for publishing plugins; iFrame and JavaScript, 3Play Media highly encourages users to implement plugins using the iFrame embed method.

The focus of this article is to detail the process for publishing a plugin using the iFrame embed method...

Step 1- Log into 3Play Media

3Play Media Transcription Captioning account login

Step 2- Select a 3Play Media File

From the My Files page, click on the file that you would like to publish as a 3Play Plugin.
Once you click into a file you will be directed to the file-show page.

Select file to preview with captions

Step 3- Navigate to Plugin Template

Click the Publish button and from the drop-down menu that appears select Publish Plugin.

Publish Plugin button

Step 4- Plugin Template

By default, [No Template] will display within the Plugin Template field. Keep the Plugin Template set to [No Template] for now.

The Plugin Template drop-down menu contains Public Templates created by 3Play Media which can be loaded and used as-is or can be used as a starting point to jump off of to further customize the plugin. Any other templates that were created by 3Play users within your account will display as an option within the drop-down menu which can be selected.

See more information regarding Creating and Managing Templates

See more information on converting old plugin templates

Step 5- Select Video Settings

If you did select one of the [PUBLIC] templates, select your preferred Video Settings.

For the Video source drop-down select Custom if you would like to enter in your video credentials manually.

For the Embed Method drop-down, Simple (iframe) will be selected by default. Keep the embed method set to Simple (iFrame).

For the Video player type drop-down, select which player type the video will be played on. (Brightcove, YouTube, Ooyala etc.)

Depending on the Video player type selected, you will be prompted to enter in additional required items such as Player ID, Video ID, or Account Number. (there could be greater or fewer drop-downs depending on the Video player type).

Click here to locate the required IDs from the hosting platform when iFrame Publishing

NOTE: If the video was uploaded via an integration, certain drop-downs will be auto-populated, including, but not limited to; Video source, Video player type, and Video ID. You will be unable to edit the Video player type drop-down.

Step 6- Select Style Settings

Set the width and height for the plugin in px.
The default is 500px by 500px. Select Light or Dark for Plugin skin.

Step 7- Select Plugin Features

Select the Plugin features you'd like to include in the plugin. Options that can be selected are Interactive Transcript, Audio Description, Closed Cations, and SEO Embed.

See more information about these different plugin features here

Step 8- Publish and Share

Under embed code, click the Copy to copy the iframe embed code to your clipboard. Paste the plugin embed code below the video embed code within the HTML.

Shareable Link

If you would like to send someone a link to your plugin, click the Copy button under the Hosted link section to paste and share.

Driving off of the Video ID instead of the 3Play Media ID

PRO TIP: When the iFrame embed code contains a video ID from the hosting platform, the video ID can be referenced instead of the 3Play Media file ID. To do this remove the mf=12345& from the iFrame embed code so the code should go from looking like this:

to looking this:

See more information on how to customize your plugin template here

See more information on how to utilize custom JavaScript/AJAX here