Adding a Text Overlay to a Video

In this topic you will learn how to add a text overlay to a video.

The Interactivity module provides the ability to add different types of interactive overlays to videos. Text and image overlays can be displayed on videos during video playback. For example, overlays can display additional text or a company logo on a video. Overlays can also be clickable and open additional web pages if needed.

 

Before you get started

Before you can add interactivity to a player, you need an Interactivity-enabled Brightcove Player and you need to make sure an Interactivity project has been created. For information on how to do this, see Getting Started with Video Interactivity.

Adding a text overlay

Text overlays are used to display text on a video during playback. The overlay can also be clickable and open another browser page when clicked. In the following example, the text overlay will appear at the 75% point of the video and display until the end of the video. Clicking the overlay will open a link in a new browser tab and pause the video.


Follow these steps to add a text overlay to a project:

  1. Login to Video Cloud Studio.
  2. Open the Interactivity module.
  3. Click New project.
  4. Enter a Project Title.
  5. Select a video to use.
  6. Click Create.
  7. Play the video to the point where the text should display.
  8. In the bottom toolbar, click on the text overlay icon.
  9. Click on the Editor link in the menu.
  10. Enter text for the overlay and click SUBMIT.
  11. Click and drag the overlay to where you want it to appear on the video.
  12. Click the Start Time menu.
  13. Enter a Start time in seconds, as a percentage or in time format. This example sets the start time to the 75% point of the video. Click SAVE.
  14. Click the clock icon to set the duration of the overlay. Click SUBMIT.
  15. Click the Link menu.
  16. Enter a URL to direct to when the overlay is clicked.
  17. (Optional) Click the BEHAVIOR tab and have the video Pause on video click. Click SAVE.
  18. Click Done.
  19. Click Embed.
  20. Click Preview, play the video and confirm that the overlay appears.