YouTube Title/Thumbnail Image

[fdevans]

When embedding a YouTube video using the VidStack plugin it seems the title images are blurred, or possibly zoomed in so close that they are blurry. This is also evident on the Demo Page for the YouTube example.

Has anyone found a workaround or fix for this? We would really like to have the proper title image shown for our videos embeds. Few examples on our site:

https://docs.rundeck.com/docs/history/4_x/version-4.17.0.html

https://docs.rundeck.com/docs/history/5_x/version-5.10.0.html

[Mister-Hope]

emm

can you provide screen shots about it？

[fdevans]

this is what we see:

I do see that it works on my phone browser. But not in Chrome or Safari on Mac.

[fdevans]

also Chrome on Windows.

[fdevans]

Was able to work around this issue by adding this to the Code:

poster="https://img.youtube.com/vi/wQtpht0VPNg/maxresdefault.jpg"

#shows properly
<VidStack src="youtube/wQtpht0VPNg" poster="https://img.youtube.com/vi/wQtpht0VPNg/maxresdefault.jpg"/>

#shows zoomed in on desktop browsers
<VidStack src="youtube/wQtpht0VPNg"/>

Wonder if there is a way to address it with a component options rather than having to go edit every page? https://plugin-components.vuejs.press/config.html#componentsoptions. I don't see an option to configure vidstack here, but maybe it's possible?

[Mister-Hope]

It's, but I still prefer this would be a bug to vidstack.

pr about this is welcomed

[fdevans]

Is the bug on the Vidstack side or is it a bug in the implementation of the theme? I'm not a developer, but may be able to seek some help.

[fdevans]

Previous example worked for most of our videos, but some are requiring

hqdefault.jpg instead of maxresdefault.jpg

[fdevans]

Since it seems to depend on the Video I can use this method going forward rather than rely on a central config. Hopefully finding this helps others.