Video in Media Gallery is Auto Muted

Solved

Video in Media Gallery is Auto Muted

mOONbOOTS
Explorer
62 6 8

Hello,

 

Can someone please help me with the video in media gallery on Dawn theme?

 

When I click on the video, it plays, but it's automatically muted.

 

I tested out the Prestige theme, and their videos in the media gallery play sound when you click on them.

 

Any help would be greatly appreciated.

Accepted Solution (1)

mOONbOOTS
Explorer
62 6 8

This is an accepted solution.

Solved it myself.

 

Added " muted: false " to product-thumbnails.liquid:

{% comment %} added - muted: false {% endcomment %}
    <template>
      {%- liquid
        case media.media_type
          when 'external_video'
            assign video_class = 'js-' | append: media.host
            if media.host == 'youtube'
              echo media | external_video_url: autoplay: true, loop: loop, playlist: media.external_id | external_video_tag: class: video_class, loading: 'lazy'
            else
              echo media | external_video_url: autoplay: true, loop: loop | external_video_tag: class: video_class, loading: 'lazy'
            endif
          when 'video'
            echo media | media_tag: image_size: '2048x', autoplay: true, loop: loop, controls: true, preload: 'none', muted: false
          when 'model'
            echo media | media_tag: image_size: '2048x', toggleable: true
        endcase
      -%}
    </template>

 

View solution in original post

Replies 3 (3)

AnneLuo
Shopify Partner
953 176 202

Hi, @mOONbOOTS 

Can you please share the store URL so that I can assist you?

If this is helpful, please Like and Accept the solution.
Want to modify or custom changes on store? Let me help.
- Feel free to Email Me   

Buy Me A Coffee

mOONbOOTS
Explorer
62 6 8

Is there no way to suggest how to do it without sharing my store URL?

mOONbOOTS
Explorer
62 6 8

This is an accepted solution.

Solved it myself.

 

Added " muted: false " to product-thumbnails.liquid:

{% comment %} added - muted: false {% endcomment %}
    <template>
      {%- liquid
        case media.media_type
          when 'external_video'
            assign video_class = 'js-' | append: media.host
            if media.host == 'youtube'
              echo media | external_video_url: autoplay: true, loop: loop, playlist: media.external_id | external_video_tag: class: video_class, loading: 'lazy'
            else
              echo media | external_video_url: autoplay: true, loop: loop | external_video_tag: class: video_class, loading: 'lazy'
            endif
          when 'video'
            echo media | media_tag: image_size: '2048x', autoplay: true, loop: loop, controls: true, preload: 'none', muted: false
          when 'model'
            echo media | media_tag: image_size: '2048x', toggleable: true
        endcase
      -%}
    </template>