Customizing the embed code for your video allows you to control the look and feel of your videos when you want them to play on a website other than Our embed codes will work without error or security warning on SSL websites without any special settings.

Creating a custom embed code allows you to change the width and height of the player, show or hide the controls, set the video to autoplay, create a custom post-play screen, select standard definition or high definition as the default setting for playback, and change the player colors.

SproutVideo offers three different types of embed codes: Standard In-Line Embed Codes, Lightbox Embed Codes and Email Embed codes. This help article addresses In-Line Embed Codes. For details on Lightbox and Email Embed codes, please refer to those specific help articles.

Navigate to the Customization Options for Your Video

From the Videos page, click on the video you'd like to embed. This will take you to the Video Details Page. Then, click on Customizations:

Customize the Embed Code for a Video Hosted on SproutVideo

Change the Player Size or Make it Responsive

You can easily change the size of the player for your embed code, and make it responsive so that it adjusts automatically to your viewer's screen size. Select the option to maintain the aspect ratio to ensure the embed code corresponds to the dimensions of your video.

If you select the responsive option, you do not need to install anything or configure any custom code on the page where your video will be embedded. Just copy and paste the responsive code to the page as normal.

Change the Player Size or Make the Embed Code Responsive

Adjust Pre-Play Settings

Determine whether viewers see a big play button, just the control bar, or if your video plays automatically when the page loads. To show no controls at all without autoplaying the video, select "Show Controls" and the option to "Hide All Controls" further down the page.

Change Pre-Play Settings for Your Video Embed Code

Change Post-Play Settings

You can implement a custom post-play screen for your embedded video, or set the video to loop continuously.

Implement a Custom Post-Play Screen or Loop this Video

Post-play screens are a powerful marketing tool, and can be used in many ways. A simple option is to enter text and the URL of a page you'd like to direct your viewers to after they finish watching your video. You can get even fancier, and enter HTML for your post-play screen, which can be used to display a form, survey, image, and more.

Post-Play Screen Options for Embedded Videos

Change the Controls That Are Visible

Use these options to determine the controls that are available to your viewers, if any. You can hide specific buttons from the control bar, or hide all controls entirely.

Show Or Hide Controls For an Embedded Video Hosted on SproutVideo

Change the Player Colors and Select a Theme

You can select a custom color setting for your player, and also pick between a light and a dark theme to suit the look of the page on which you are embedding your video.

Change Player Colors for Embedded Videos

Saving Time with Presets

If you want to use the same customized embed code settings for multiple videos, you can work more efficiently by saving your custom embed code as a preset. This enables you to quickly load those settings for each video by selecting your desired preset from the drop down menu, and selecting any of your previously saved presets:

Save a preset embed code for the SproutVideo video player

When you create a preset, the presets drop down menu will automatically appear as an option under Customizations. We also generate an option called "SproutVideo Default" so that you can load a plain vanilla embed code without any customizations if you'd like to easily switch to the standard account settings.

Establish Default Settings for In-Line Embed Code

Default settings for a specific type of embed code will apply to all videos in your account. This is a great option if you are sure you will want to use the same settings for all of your videos, since those settings will load automatically for every video in your account. You will not need to select the default from the drop down menu.

Create Default Settings for In-Line Embed Codes

Publish Your Embed Code!

When finished, click anywhere on the customized embed code to copy it. You can then paste the customized embed code to the webpage of your choice. If you need any help with a specific platform, please contact support.

Copy Your Embed Code to Publish It

Section: Embedding Videos
Last Updated: July 28, 2016