Wistia

to the tippy ↑

Updating the Player Controls for Your Video

Tweak the video controls, and autoplay your videos!

Controls

The Controls area includes options to tweak the video controls on your media. Don't want viewers skipping important parts of your video? Seeya, Play Bar! Need to autoplay your videos to grab attention? Check that Autoplay box. Customize your video however you'd like—by adding or removing any buttons.

Start and End Behavior

Within Controls you can choose the start and end behavior for your video. For the start behavior you can choose to Autoplay your videos. Leaving this box unchecked will just show the thumbnail of your video.

For end behavior you can choose from three options: Pause on the last frame, Reset to the first frame, and Loop the video. These should be pretty self-explanatory, but test them out if you're confused.

Autoplay Your Videos

Need to capture your viewer's attention right at page load? Can't wait for them to click play? Autoplay is your new best friend.

To set your video to autoplay you'll want to navigate to Controls in the Customize panel. There you'll see a checkbox to Autoplay your video. You can choose to have the video Start Muted or Play with Sound. Start Muted will autoplay the video in a muted state, with the option for the viewer to manually increase the volume. Play With Sound will begin playback with audio where possible.

Alert

Autoplay with sound is currently blocked by default on mobile devices and desktop Safari. For the best experience across all devices/browsers, we recommend the Start Muted option. Videos set to Play With Sound will display a thumbnail and play button in these contexts.

Loop Your Videos

Setting your video to loop is a great way to keep your viewers engaged, or to just have some interesting background movement. At Wistia, we like to use looping autoplay videos to make high-quality GIF substitutes. Like this snazzy one of Joe dancing.

 

To loop your video, you'll want to navigate to Controls in the Customize panel. You should see an option for End behavior. The default we set is for the video to Pause on the last frame. Switch the option to Loop the video, save your settings, and dance like Joe. 🎩

Player

In the Controls tab you'll be able to add and/or remove lots of buttons. Let's walk through all of those buttons, and see what they look like.

Big Play Button

The Big Play Button overlays on your thumbnail. It's visible before your viewer clicks play, and it indicates that your image is a video.

If you'd like to further customize the Big Play Button (past selecting a color), you can do so with the Player API, or with your very own custom thumbnail.

Video Length on Play Button

Wistia's new player Vulcan allows you to display the time of the video on the big play button. This is the default setting, but you can disable the time stamp by unchecking this box.

Small Play Button

The small play button will pause and play your video. It will appear on your video when the viewer hovers over the video during playback. This option will also be shown if the Controls Visible on Load box is checked.

Play Bar

The play bar allows your viewers to scrub through your video. Disabling the play bar will disallow the viewer to skip ahead (and/or hop backward) in your video.

The play bar also includes a hover thumbnail preview. Now your viewers can see what's coming up next without skipping forward.

Volume Control

This button allows a viewer to change the volume of your video. To adjust the volume hover over the icon, and drag the black dot up or down.

Full Screen

This option allows a viewer to watch your video in full screen. That's pretty much its hit single.

Settings Control

Settings allow your viewers to choose their playback quality and speed.

Most videos are set to Auto, which will use adaptive streaming to play your videos. You can, however, manually choose a quality by selecting one from the settings menu.

A viewer can also choose to set a playback speed for videos. This is great for long form teaching videos, or just regular old hilarity.

Controls Visible on Load

All of your controls (play buttons, play bar, volume) can be set to be visible as soon as the thumbnail loads for your video. Just select this option in the Controls tab. Here's what your video will look like when this is set to true.

 

Fun fact: this video has all controls turned on—including Controls Visible on Load.

360 Video

Have a 360 video? Dang, you're ahead of the curve. 🌐

Check out our 360 video page for all the details about hosting 360 videos on Wistia.

If that's not something you care about, that's cool too. Just click the 360 video checkbox after you've uploaded your 360 video, and don't forgot to save your customizations.

Controls on Mobile

Videos played in most mobile environments will utilize the operating system's native player. In the case of Android and iOS devices, Wistia controls will be overridden by the native player—so most customizations made in the Customize panel will not be applied. This includes any player controls you've specified.

Check out our screenshot of a Wistia video on an iPhone.

Popover Controls

Our popover embed has a few perks that aren't in the Customize panel. You might not be in love with the animation we have for the thumbnail on a popover. (As shown below.)

 

If that's not your jam, you'll just want to change one tiny piece of your popover embed code. Change popoverAnimateThumbnail=true to popoverAnimateThumbnail=false.

Then you're good to go!

 

For more on customizing your popover embeds, check out our popover customizations page.

Troubleshooting

Sometimes your controls might look a little wonky, or be missing altogether. In some cases, you might have some overly aggressive CSS that's affecting your video embeds. We recommend testing out the Fallback embed. It's a more resilient iframe embed code type, that is not as easily overwhelmed by aggressive CSS.

Still no luck? Bummer! Check out our embed troubleshooting guide for more or give us a holler.

Next up—let's add Share buttons!