Now it's time to get creative and take your Actions to the next level, with the aim to provide an exciting & interactive experience for your viewer!
Actions are essentially mini-webpages that show within the frame of the video. By using the flexibility of the HTML editor, you can start to build creative solutions that help guide and control the viewer's video experience & content journey. You can use your organizations branded colours, buttons, shapes and images that your viewer is accustomed to seeing.
The HTML editor supports CSS and Javascript via style and script tags, which provides additional coding flexibility - including the option to implement the Player API.
In many of the examples below, our Javascript based Player API is used to control the video from inside the Action. This means that wherever you place your Vidyard Player embed, the functionality is built in and ready to go!
Without some web development experience, this could sound daunting - so the content below has step by step instructions and comments within all of the code to help you get started. The majority of them will only require a few color, image and link adjustments that match your needs!
If you have a requirement for something completely customized, our Services team are ready to help you with that process. Contact your Vidyard CSM to find out more about the options that you can take advantage of.
Background image with external link (Post-roll Full Screen)Let's start with something simple that requires the least amount of effort! You can use a hosted image within an Action that links to an external resource. This could be to a URL, file download or email address. Ideal if you have images already made with CTA buttons, and you are happy to concede some dynamic HTML such as 'on hover' effects. |
|
Call to Action Button Overlay (Annotation)You can use a CTA button at any point within the playback of a video by using an annotation. This style of Action will not stop the video when it appears and will continue to show for a set number of seconds. This encourages an action from your viewers before reaching the end of playback. It could be directly related to the content currently being watched. e.g to see a particular product demo, view a relevant landing page or open an email compose window with a pre-defined subject line. Essentially any action you want them to perform. |
|
Pulsing button for final Call to Action (Post-roll Full Screen)Using animation is a great way to catch the attention of your viewer. This particular button works well in a post-roll Action to guide your viewer towards a next action - perhaps register for an event, book a demo, watch more content or schedule a meeting. |
![]() |
Download Now (Post-roll Full Screen)If you have a hosted file such as a whitepaper, that is relevant to the video content, you can offer this up in a post-roll Action! Ideal if you have an image for the download that you can place on the left, as well as a useful PDF, ZIP or any other type of file hosted for the download!
|
![]() |
Choose your own adventure (Pre-roll Fullscreen)You may have a number of videos in a playlist that cover the same subject, but are designed for different audiences. This Action will allow your viewer to select the appropriate video from your playlist before any playback occurs. This is best used as a Fullscreen Pre-roll Action so that the most appropriate option is chosen before playback. It could even be used as a default Action if your group/folder contains playlists with a consistent number of videos. |
![]() |
Choose your own adventure (Post-roll Fullscreen)You can be in full control of where you want your viewers to go after watching the content (take note YouTube)! These are best used as a Fullscreen Post-roll once playback has completed, providing the viewer with a number of options that you believe will be relevant for their content journey. These could be programmed to go to external web resources, such as subscribe forms; videos within the same playlist; or other sharing/landing pages where further videos are embedded.
|
|
Social Share (Post-roll Fullscreen)If you don't have a next step for the viewer to take, perhaps just provide an easy way for the viewer to share the page to social channels! This could be a great way to attract more viewers to your site. |
![]() |
Skip to Time/Video Navigation Bar (Annotation)Allow your viewers to skip to sections of your video content, wherever it is a timestamp in the current video, or another one in a playlist This annotation Action will show a navigation bar on the side of the video that will expand when clicked. |
|
Invisible Skip to Time or Hyperlink (Annotation)This is a clean way to navigate through the video or link externally, without replicating the same text in an additional navigation bar or button. Use this if you have an agenda or external links that already appear within the video, so you can turn these into a set of clickable options! |
![]() ![]() |
Book a meeting (Full Screen Post-Roll)These types of Actions provide a number of options to your viewer when the video ends. Especially useful for sales reps, post-roll CTAs allow your viewer to schedule time with you as soon as the video has completed. Link this to your individual's Calendar to book meetings (Calendly, Hubspot, Outreach etc) |
|
Survey or Quiz (Fullscreen Post-Roll)This Action will display a form that you have created already in Google Forms or other surveying tools. |
![]() |
Calendar Link (Fullscreen Post-Roll)Add your Calendar link to an Action! This will allow the viewer to book a meeting with you without navigating away from the video! |
![]() |
Watermark (Annotation)Display your brand's logo throughout your video content without having to 'bake it in' to your video files. |
![]() |
'Quick Action' for emailing (Full screen)The in box 'quick actions' require you to use http(s) based pages as a button link. Use this code as a workaround to have a 'send an email' button instead. |
![]() |