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 SproutVideo.com. 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, 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 Embed Codes 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:
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.
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 Post-Play Settings
You can implement a custom post-play screen for your embedded video, or set the video to loop continuously.
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.
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.
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.
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:
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.
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.
Check out these other articles in the Embedding Videos section: