Video popup

Responsive YouTube and Vimeo video players inside lightbox triggered by specially styled button.

Createx component

Play button

Click me to watch video!
<!-- Play button: With label -->
<a href="link-to-youtube/vimeo-video" class="btn-video me-3" data-gallery-video data-sub-html="<h6 class='fs-sm text-light'>Video caption</h6>"></a>
<span class="fs-sm text-muted">Click me to watch video!</span>

Sizing

<!-- Default button size -->
<a href="link-to-youtube/vimeo-video" class="btn-video" data-gallery-video></a>

<!-- Small button size -->
<a href="link-to-youtube/vimeo-video" class="btn-video btn-video-lg" data-gallery-video></a>

On top of the image


Click me to watch video!
<!-- Video button on top of the image -->
<div class="jumbotron position-relative bg-size-cover bg-position-center bg-no-repeat text-center mb-0 py-6" style="background-image: url(path-to-background-image);">
  <div class="position-absolute top-0 start-0 w-100 h-100 bg-black opacity-50"></div>
  <div class="position-relative fw-medium text-white text-shadow text-center zindex-2 py-6">
    <a class="btn-video btn-video-lg mb-2" href="link-to-youtube/vimeo-video" data-gallery-video data-sub-html="<h6 class='fs-sm text-light'>Video caption</h6>"></a>
    <br>
    <span class="fs-sm text-light">Click me to watch video!</span>
  </div>
</div>
Top