Плагин вырезает из кода страницы все вставленные видео с YouTube и заменяет их на ссылки с картинкой. Это ускорит загрузку страницы в браузере у посетителя, если на странице используется много блоков с видео. При клике на такую ссылку можно открыть модальное окно с плеером.

Если на сайте подключён Bootstrap, модальные окна заработают автоматически.

В комплекте идёт чанк tpl.wrapYoutube, который используется для замены кода видео на страницах. Используемый чанк можно изменить в системных настройках.

Системные настройки

wrapyoutube_tpl — чанк, который будет использован для замены
wrapyoutube_front_css — файл стилей для оформления
wrapyoutube_front_js — файл скриптов для инициализации модальных окон

Плейсхолдеры, доступные в чанке

id — идентификатор видео
img — превью видео
link — ссылка, указанная изначально в коде iframe
embed — ссылка для модального окна с автопроигрыванием
width — ширина ролика
height — высота ролика

Использование Fancybox

Подключите Fancybox и добавьте инициализацию по классу WY_link:

<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/fancybox/3.0.47/jquery.fancybox.min.css" type="text/css">
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js" type="text/javascript"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/fancybox/3.0.47/jquery.fancybox.min.js" type="text/javascript"></script>
<script>
    $(document).ready(function(){
        $('.WY_link').fancybox();
    });
</script>

Код чанка tpl.wrapYoutube может быть таким:

<a href="[[+embed]]" class="WY_link" data-fancybox-type="iframe">
    <img src="[[+img]]" width="[[+width]]" height="[[+height]]">
</a>