# Video Component

**URL:** <https://community.glideapps.com/t/video-component/1628>\
**Category:** Ask for Help\
**Created:** [November 3, 2019, 6:15am UTC](https://community.glideapps.com/t/video-component/1628 "2019-11-03T06:15:29Z")\
**Posts on this page:** 5\
**Page:** 1

<div class="post-metadata">

**Author:** ![WebMaye](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/webmaye/32/30_2.png) [@WebMaye](https://community.glideapps.com/u/WebMaye)\
**Post date:** [November 3, 2019, 6:15am UTC](https://community.glideapps.com/t/video-component/1628/1 "2019-11-03T06:15:29Z")

</div>

Question 1: Is it possible to have a video component to generate a preview image for a Tiles layout. That is, I have a tiles layout that has video component inside, so I’m looking for ways that I can use to get an image preview of the video in the tiles layout.

Question 2: how can I auto play a video in Glide?

---

<div class="post-metadata">

**Author:** ![George\_B](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/george_b/32/534_2.png) [@George\_B](https://community.glideapps.com/u/George_B)\
**Post date:** [November 3, 2019, 1:24pm UTC](https://community.glideapps.com/t/video-component/1628/2 "2019-11-03T13:24:11Z")

</div>

1. I’m guessing you tried to use the video as the image and it didn’t work. So, the only thing you could do was to create a representative image of each video and save it off for each video.

2. I’m pretty sure that request has been asked before, autoplay both audio and video, but I don’t know if it is on Glides list of new future features or if it is, where on the list it may fall.

---

<div class="post-metadata">

**Author:** ![WebMaye](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/webmaye/32/30_2.png) [@WebMaye](https://community.glideapps.com/u/WebMaye)\
**Post date:** [November 3, 2019, 2:30pm UTC](https://community.glideapps.com/t/video-component/1628/3 "2019-11-03T14:30:27Z")

</div>

Thanks for the response!

1. I tried to use it as you guessed and it didn’t work so I’m thinking of have an image picker so users can upload it as its cover image

2. I will wait for their update

---

<div class="post-metadata">

**Author:** ![Pete\_James](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/pete_james/32/271_2.png) [@Pete\_James](https://community.glideapps.com/u/Pete_James)\
**Post date:** [April 22, 2020, 4:48pm UTC](https://community.glideapps.com/t/video-component/1628/4 "2020-04-22T16:48:12Z")

</div>

Here is a workaround to display video thumbnail in list/tile component:

- setup your sheet to take the info you want to display in the tile e.g. a column for video name and youtube url.
- then add column to extract the youtube video code from the url and apply the formula to the entire column. The formula looks like this: =ArrayFormula(iferror(REGEXEXTRACT(B2:B, “youtu(?:.\*/v/|._v=|.be/|._?embed/)([A-Za-z0-9\_-]{11})”), “”))
- then add column to extract a thumbnail from the youtube video code and again, apply the formula to the entire column. The formula looks like this: =ArrayFormula(if(C2:C = “”, “”, IMAGE(REPLACE(“[https://i3.ytimg.com/vi/IMG/hqdefault.jpg](https://i3.ytimg.com/vi/IMG/hqdefault.jpg)”,25,3,C2:C), 4, 80, 120)))
- then add column to extract a url to the thumbnail, apply the formula to the entire column: =ArrayFormula(if(C2:C = “”, “”, (REPLACE(“[https://i3.ytimg.com/vi/IMG/hqdefault.jpg](https://i3.ytimg.com/vi/IMG/hqdefault.jpg)”,25,3,C2:C))))
- you might want to hide the first row of each column that contains the formula.
- you can now keep adding youtube video links to new rows and the formulas will automatically generate a thumbnail you can point your tile component to, which then link to the video url.

Example:

> **[Video tiles](https://docs.google.com/spreadsheets/d/18uyu05XIAU20ODgj8ufNrULNgCmEQJz7vypzphMcrXE/edit?usp=sharing)**
>
> Videos
> 
> Video Name,Video,Video code,Thumbnail,Thumbnail URL
> ,,
> Coffee ,\<a href="https://www.youtube.com/watch?v=iI09bbH22vQ"\>https://www.youtube.com/watch?v=iI09bbH22vQ\</a\>,iI09bbH22vQ,\<a...

Hope this helps.

---

<div class="post-metadata">

**Author:** ![Robert\_Petitto](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/robert_petitto/32/25193_2.png) [@Robert\_Petitto](https://community.glideapps.com/u/Robert_Petitto)\
**Post date:** [April 22, 2020, 5:18pm UTC](https://community.glideapps.com/t/video-component/1628/5 "2020-04-22T17:18:31Z")

</div>

Nice explanation.
