Youtube

LastUpdate : 2019/08/28

Structure

<div class="module-youtube {mode-0}" data-play="{play}">

    <!-- if play == 0 -->
        <!-- if image != '' -->
        <div class="preview-image" style="background-image: url('{image}');"></div>

        <div class="iframe-container {no-preview-image} {hide}">
            <iframe width="{width}" height="{height}" src="{url}"
            frameborder="0" allow="autoplay; encrypted-media" allowfullscreen></iframe>
        </div>

    <!-- if play == 1 -->
        <img src="{image}" width="{width}" height="{height}">
        <div class="popup-mask hide">
            <div class="popup-container">
                <iframe width="{width}" height="{height}" src="{url}" 
                frameborder="0" allow="autoplay; encrypted-media" allowfullscreen></iframe>
            </div>
            <div class="close-btn"></div>
        </div>

    <!-- if play == 2 -->
        <a class="module-youtube-event" href="{url}" target="_blank" data-width="{width}" data-height="{height}">
            <img src="{image}" alt="">
        </a>
</div>