Skip to main content
All CollectionsInteractions & CTAs
Interactive Overlays & Annotations

Interactive Overlays & Annotations

Add buttons, links, images, opt-in forms, annotations, calls to action (CTAs), and even custom HTML to your videos

Updated over 2 weeks ago

Our overlays and annotations allows you to add all types of buttons, links, lead generating opt-in forms, and calls to action to your videos.

This is an overview of this feature. The article below will detail what each template does and what it looks like.

To access these templates simply edit your video and in the Player tab you will see the option for Overlays & Annotations:

Then simply click on the New Overlay button and you are presented with the Template Categories and templates underneath. Just choose a category that suits your needs. In this example the Buttons category is selected:

Now we'll take a look at each of the categories and the templates available for each one.


Buttons

This category allows you to add a call to action that includes text and highlights the button included.

Full Screen

Includes a headline, sub-headline, and button that is placed in the middle of the screen. The rest of the video greyed out while this overlay displays.

Here's quick look:

Panel

This will add a panel that runs the width of your video at the bottom, middle, or top. Includes an image, text and a button call to action.

Simple

As the name suggests, a simple button placed in a variety of spots on your videos with timing and link configuration

Tap to Call

Meant more for cell phone users, this button is configured to automatically dial a phone number once tapped.

Text

This category allows you to add text to your video and include an optional link which can be clicked by the viewer. In other words, they can be used simply as a text annotation or can be configured to be clickable to a URL.

Note box

In this example we used it as a simple annotation to add more context and information to the video:

Full Screen

Add text and a link that displays in the middle with the rest of the screen greyed out to highlight the text and link.

Chat Box

Meant to be used as an annotation for customer service, testimonials, etc with an added spot for a headshot image but this can be used for calls to action as well.

added context, etc but can be used for any

Coupon Panel

Displayed as a panel that is placed at the bottom, middle, or top of your video. Includes an image, text, and the coupon. If configured to be clickable, the coupon portion can redirect to a URL.

Coupon Full Screen

Displays your headline, sub-headline, and coupon in the middle of the screen with the rest of the area around it greyed out.

Cards

Cards include a headline, sub-headline, description, and then a button which clicks through to a URL as well as an image.

Large Card

Large sized card to your video, placed on the left, center, or right side of the video.

Small Card

Displays headline and clickable link with image.

Lead Capture

This category is specifically for collecting leads and/or identifying the viewer of the video. Templates include forms for collecting first name, last name, and email address as well as custom fields. You can integrate with your email service provider or CRM to save data there.

Email Gate

Presents a form (opt-in form) on your video that locks the video at a desired point and requires an email address to be entered before continuing with the video. Configuration instructions can be found in this article.

Full Screen

Displays your form in the middle of the screen with the rest of the area around it greyed out.

Identify Contact

Quick and easy way to identify who is watching your video in order track their viewing analytics across all Spotlightr videos.

Panel

Displays your form as a panel that is placed at the bottom, middle, or top of your video.

SMS Gate

This feature allows you to lock your video, giving access only to users who submit their mobile number. Configuration instructions can be found in this article.

Hotspots

Hotspots are a great marketing tool to point out certain parts or even products of your videos, provide a clear visual indicator, and then make it clickable. They can move and flow in your video through the use of keyframes as well, drawing a lot of attention and thus increasing clicks.

Link

This will allow you to add a URL destination to the hotspot. Viewers who click the hotspot will go that to URL. Please note that the video will pause when the hotspot is clicked

Here's a quick look at what hotspots looks like (by default they also flash/pulse).

HTML Panel

This will allow you add HTML which will appear when the hotspot is clicked. Anything from forms, surveys, quizzes, and even full web pages can be added here. Please note that the video will pause when the hotspot is clicked.

Change Video

This will allow you to add a video as a destination for the hotspot. Viewers who click on the hotspot will be taken to that video that you choose.

Custom HTML

For scenarios in which our templates don't exactly do what you need them to do, you can add your own HTML code in the form of an overlay;

Full Screen

Add HTML to fill up entire video player.

You can add absolutely anything you want. Here's a quick look at how it looks with a contact form embedded into the video:

Box

Add HTML configured to appear in a variety of spots on the video.

Again you can add absolutely anything you want. Here I just added a simple HTML table and put it in the top left corner:

Did this answer your question?