1. SundaySky Help Center
  2. Video Distribution
  3. Distribution Methods

Embedding the SundaySky Player in a Webpage

Introduction

SundaySky provides an HTML5 player designed for dynamic video streaming to all major desktop and mobile browsers. The player is responsive with default dimensions of 640 x 360 pixels. You can use CSS properties to overwrite these dimensions.

This article provides instructions on how to embed the SundaySky player in a webpage when your video is not personalized.

Warning:

We recommend not modifying the properties of the player with a method other than the one described in this article. If you have special requirements that are not addressed in the guidelines below, reach out to SundaySky Support. 

Embedding the SundaySky Player

Before Starting:
Make sure that the video is published.

  
1.

On the video page, click Share and then select Embed Video.
  Click_embed_video.png
2. Click Copy to copy the player embed code snippet.
  copy snippet.png
3. On your webpage, paste the embed code snippet, placing the div element (sskydiv) where you want the player to appear.
  div_element.png

Customizing the Embed Code

After you've pasted the code snippet in your editor, you can customize it according to your preferences. Before beginning, note that the video ID has been automatically added to the code. The video ID comprises the last part of the SundaySky URL that is used to access the video in the platform.

video_ID_example.png

In SundaySky Player—Full List of Player Attributes, you'll find descriptions of all the attributes that you can customize. Note that every attribute (except for poster and transcript-button) is hard-coded in the player code with its default option. You only need to add the attribute to the code snippet if you want to use a different option.

For example: the attribute aspect-ratio is hard-coded with the default option, horizontal. If you want the aspect ratio of the player to be horizontal, you do not need to do anything. If you want the aspect ratio of the player to be vertical, you need to add the attribute to the code with the option, vertical.

As noted above, the poster and transcript-button attributes are already included in the code snippet with default options (see below).
▶ The poster is the image that is displayed until the viewer clicks the play button. If you want to display a different poster image than the default one, see the instructions for how to define the poster attribute.
▶ The transcript button, when clicked, displays a detailed video transcript in a new tab. If you do not want to include the transcript button in the control bar, see the instructions for how to hide this button.

default_attributes.png

Web Analytics and Video Event Integration

The video player emits events for various events within the video and player, and while the viewer interacts with the video. Event listeners can be used to trigger any JavaScript code that you define. For a complete list of events, data which can be exposed by an event, and code examples, see Integrating with Player Events.

More articles from Distribution Methods

Was this article helpful?
0 out of 0 found this helpful

Still Have Questions?

SundaySky Support is here for you

contact support