HELP - Meta (Facebook and Instagram) in-app browser don't autoplay videos

HELP - Meta (Facebook and Instagram) in-app browser don't autoplay videos

Unknown98225
Visitor
2 0 0

Hello everyone, I have a problem with my Shopify Impact theme store.

 

I placed a video section on a page and settled the auto play.

 

When opening that page from any browser works perfectly, now the problem is that I have the link of that page in my facebook and instagram bio.

 

When I click the link the page opens in the in-app browser but the video doesn’t show/autoplay.

 

The video doesn't contain any audio is muted.

 

I have already tried:

 

  • Uploading the video directly in Shopify
  • Using a YouTube link
  • Using a Vimeo link
  • Using custom liquid code 
  • Using custom HTML code

As I said all the mentioned above works perfectly in all browser.

 

It's just in the Meta in-app browser that NONE of that solution works to have the video autoplay.

 

I could solve that by placing the play button on the video, but that just would look very ugly and is NOT what I want.

 

Any help would be much appreciated, thanks to everyone in advance!

Replies 4 (4)

ngadhnjim
Visitor
1 0 0

i have this problem too.. looking also for a solution but didn't found something that workes.

westerndml
Shopify Partner
3 0 0

hey

if you dont mind can help you 

 

reyysann
Visitor
1 0 0

Hello! I'd greatly appreciate your assistance in finding a solution for this. Haven't had any luck.

alfredoperezESP
Visitor
1 0 0

Hello everyone,

 

I managed to solve it using jQuery, with this simple code.

 

<script>
//on document Ready
$( document ).ready(function() {
//trigger autoplay video, define video ID to target play action
$("#videoclip").trigger('play');
});
</script>

 

Your html video tag should look like this:

 

<video class="videoHolder" id="videoclip" autoplay muted playsinline loop oncanplay="this.play()" onloadedmetadata="this.muted = true">
    <source src="your source">
</video>

//oncanplay="this.play()" onloadedmetadata="this.muted = true" atributes optional and recommended

 

Best regards,

 

Alfredo