What's your biggest current challenge? Have your say in Community Polls along the right column.

How do I select the correct video quality for video_tag?

How do I select the correct video quality for video_tag?

Ihor-Sh
Shopify Partner
79 11 17

Hi to all.
This is the json output of such code snippet (liquid): {{ video | json }}

 

 

{
  "alt": null,
  "id": 39303991460105,
  "position": null,
  "preview_image": {
    "aspect_ratio": 0.563,
    "height": 1280,
    "width": 720,
    "src": "https://cdn.shopify.com/s/files/1/0686/9581/8505/files/preview_images/38c784a36feb4c22a9216cf7457442b5.thumbnail.0000000000.jpg?v=1708770095"
  },
  "aspect_ratio": 0.563,
  "duration": 13500,
  "media_type": "video",
  "sources": [
    {
      "format": "mp4",
      "height": 480,
      "mime_type": "video/mp4",
      "url": "https://cdn.shopify.com/videos/c/vp/38c784a36feb4c22a9216cf7457442b5/38c784a36feb4c22a9216cf7457442b5.SD-480p-0.9Mbps-25028258.mp4",
      "width": 270
    },
    {
      "format": "mp4",
      "height": 1080,
      "mime_type": "video/mp4",
      "url": "https://cdn.shopify.com/videos/c/vp/38c784a36feb4c22a9216cf7457442b5/38c784a36feb4c22a9216cf7457442b5.HD-1080p-2.5Mbps-25028258.mp4",
      "width": 606
    },
    {
      "format": "mp4",
      "height": 720,
      "mime_type": "video/mp4",
      "url": "https://cdn.shopify.com/videos/c/vp/38c784a36feb4c22a9216cf7457442b5/38c784a36feb4c22a9216cf7457442b5.HD-720p-1.6Mbps-25028258.mp4",
      "width": 404
    },
    {
      "format": "m3u8",
      "height": 1080,
      "mime_type": "application/x-mpegURL",
      "url": "https://cdn.shopify.com/videos/c/vp/38c784a36feb4c22a9216cf7457442b5/38c784a36feb4c22a9216cf7457442b5.m3u8",
      "width": 606
    }
  ]
}

 

 

So the question is: how to select proper video quality for video_tag or at least get proper video url?
Seems like shopify creates 3 videos per each with different qualities but don't provide any info how to use them?
Moving forward: something like {{ video.sources[2].url }} doesn't work.
 

Shopify troubleshootibility 😉
If you're satisfied with reply - don't forget to like it.
If you more than satisfied - mark it as solution 😉
You can find me here.
Replies 0 (0)