Auto Playing Videos in Squarespace
Updated 28/3/2021
I put out a video a couple of weeks back (yep, the one above) and a few people have reached out about problems with the video not auto playing. This is my fault for not explaining the video player and autoplaying policies in the video. Hopefully, this post will explain a bit more.For those who are having problems with the video not auto playing either on the live site, or in Incognito mode (and thanks again to everyone who's reached out in the comments on YouTube) a couple of things can be causing this:First of all, if you are on a version 7 template and Ajax Loading is disabled, this can stop the video from auto playing. Try enabling Ajax Loading by going to 'Design > Site Styles > Site Loading | Enable Ajax Loading'.
However, if your site is quite heavy with custom CSS enabling Ajax Loading can cause more problems than it fixes ...as I pointed out in this Tweet:
Hmmm, maybe not in this case.
Another possible cause is if your video has audio. Chromium browsers will auto automatically pause the video in order to 'improve the user experience, minimise incentives to install ad blockers, and reduce data consumption on expensive and/or constrained networks'.
In this case you will need to either remove the audio from the source video, or add ‘muted’ to the video player.
Adding muted to your video player is as simple as placing 'muted' after the width controls in the video player opening tag, like so:
<video autoplay="autoplay" loop="true" width="100%" muted>
<source src="YOURVIDEOURL" type="video/mp4"/>
</video>If audio is essential it has to be muted to start auto playing. In this case you might want to add controls to the video to allow the user to unmute the video. This, again, can be done by adding 'controls' to the video player opening tag:
<video autoplay="autoplay" loop="true" width="100%" muted controls>
<source src="YOURVIDEOURL" type="video/mp4"/>
</video>More info about auto playing videos can be seen here