草榴社区

The 草榴社区 (white text)

Videos

Direct link to MP4 video

HTML5 video element

YouTube Thumbnail to Video

YouTube Thumbnail to Video - Alternative play icon

Make all data-fancybox="" have the same value

  <a class="youtube-icon" data-fancybox="gallery" href="none"> <img alt="youtube thumbnail" src="https://img.youtube.com/vi/w3PE58NQW50/maxresdefault.jpg" /> </a>

Snippets

YouTube Thumbnail Image

https://img.youtube.com/vi/{youtubeid}/hqdefault.jpg
https://img.youtube.com/vi/{youtubeid}/maxresdefault.jpg

FancyBox Video - max res

<a class="youtube-icon" data-fancybox="" href="https://www.youtube.com/watch?v={youtubeid}">
    <img alt="youtube thumbnail" src="https://img.youtube.com/vi/{youtubeid}/maxresdefault.jpg" />
</a>

FancyBox Video - high res (if max res is unavailable)

<a class="youtube-icon" data-fancybox="" href="https://www.youtube.com/watch?v={youtubeid}">	
    <img alt="youtube thumbnail" src="https://img.youtube.com/vi/{youtubeid}/hqdefault.jpg" />
</a>

Icon Overlays

<a class="youtube-icon" data-fancybox="" href="https://www.youtube.com/watch?v={youtubeid}">	
    <img alt="youtube thumbnail" src="https://img.youtube.com/vi/{youtubeid}/maxresdefault.jpg" />
</a>
<a class="video-icon" data-fancybox="" href="https://www.youtube.com/watch?v={youtubeid}">	
    <img alt="youtube thumbnail" src="https://img.youtube.com/vi/{youtubeid}/maxresdefault.jpg" />		
</a>

漏 2024 草榴社区

Scroll to Top