Видео плагин для сайта

Плагин Fancybox для WordPress

Всем доброго времени суток с вами как всегда Максим Зеленцов и сегодняшняя статья пойдет об одном плагине с помощью которого ваше видео на сайте будет показываться на весь экран во всплывающем окне, что очень удобно посетителям и нам, так же видео можно настроить под любую высоту и ширину.

Для начало нам нужно загрузить и активировать плагин скачать плагин можно здесь после идем в боковую панель WordPress и переходим в панель «Настройки» и нажимаем на «Медиафайлы» где нам предоставляются новые настройки. Так как мы делаем «видео» то в первом столбике мы нажимаем на галочку «YouTube» а остальные чек боксы мы оставляем пустыми.

Видео плагин для WordPress

Затем мы спускаемся в самый низ и настраиваем поля а точнее ширину высоту и толщину рамки, для начало мы установили 1020px на 625px а рамку делаем 3px и сохраняем наши настройки.

plagin-fancybox-dlya-wordpress

Теперь нужно нам установить картинку (превью) в статью на которую посетитель будет кликать что бы появилось видео. Я сделал картинку с размером 500 на 282px и загрузил ее на WordPress.

plagin-fancybox-dlya-wordpress

Затем нам нужно перейти на YouTube и взять ссылку на виде, но копировать ссылку нужно не с адресной строки а через HTML-код и только от кавычки до кавычки.

plagin-fancybox-dlya-wordpress

После переходим снова в админ блога медиафалы (куда мы загружали картинку) и вставляем нашу ссылку снизу с правой стороны (1) и так же настраиваем вид нашей картинки (2) и сохраняем.

plagin-fancybox-dlya-wordpress

В итоге в нашей статье появилась картинка мы ее устанавливаем по центру после чего переходим в режим «текст» и в самом начале нашей ссылки на виде вставляем этот фрагмент кода

<a class="fancybox-youtube"

В общем у вас должно получится вот так

<a class="fancybox-youtube" href="https://www.youtube.com/ваше видео">
<img class="aligncenter size-full wp-image-1903" 
src="//maxim-zelentsov.ru/wp-content/uploads/2016/11/ваша картинка.png" 
alt="Как поменять логин и пароль для входа в админ панель сайта" width="540" 
height="303"/></a>

Все это сохраняете и идете проверять, в принципе на этом можно закончить но если в вашем видео есть черный боковые поля это значит нам нужно изменить размеры видео, и для этого вы подводите курсор мышки к самому углу видео (любой угол) и нажимаете правой кнопкой мыши после чего должно появится белое панель с действиями, и нажимаете на строчку «Просмотреть код»

plagin-fancybox-dlya-wordpress

Где снизу появляется панель с программным кодом если панель у вас с боку находится то сверху вы увидите три точки нажмите на них и выберете позицию панели.

Далее нам нужно найти строчку которая отвечает за размеры видео, выглядит она примерно так.

plagin-fancybox-dlya-wordpress

С правой стороны находится этот же код только уже в столбик (CSS) и теперь в строчке «height» нужно изменить ширину, просто подставляете свои значение и видео начнет изменятся.

Затем после всех действий как вы настроили виде идете снова в «Настройки» переходите в «Медиафайлы» и в самом низу изменяете значения.

plagin-fancybox-dlya-wordpress

 Смотрим видео

plagin-fancybox-dlya-wordpress


 

Untitled Document

Видео плагин для сайта обновлено: Февраль 1, 2017 автором: Максим Зеленцов

Отзывов (10)

  1. Виталий:

    Хочу завести свой блог и читаю других блоговодов. Не первый раз захожу к Вам, Максим. Мне здесь нравится порядок предоставления материала и разложение всего по полочкам. А с этим видео плагином совсем отлично получается. Видео материал хорошо поставлен и дикция нормальная. Беру в закладки и буду изучать всю информацию на блоге у Вас.

    • Здравствуйте Виталий спасибо за теплые слова, да блог многим посетителям нравится так как у меня все понятно нет никаких моргающих кнопок, вкладок и.т.д если Вы решитесь завести свой блог то можете скачать мой курс где я показываю как можно сделать такой же блог как у меня, или же так же делаю на заказ с ценой можем договорится сделаю скидку!

  2. Спасибо за наглядность..

  3. Интересный вариант. Только по моему, Максим, надо как-то разобраться с настройками плагина. У меня на ноутбуке не получается остановить воспроизведение — слишком большие значения фрейма по высоте. На экранах 4:3 такого скорее всего не будет. Я так понял, что просмотр видео через плагин засчитывается Ютубом?

    • Да Сергей видео устанавливается с Ютуба но можно так же установить и с vimeo, у меня ноутбук и вроде все отлично работает Вы попробуйте отредактировать фрейм в самом коде плагина и настройках, так как у плагина много настроек я показал самые основные.

  4. Если честно, то никакой пользы от этого плагина не вижу. Если надо посмотреть видео во весь экран — достаточно нажать значок в плеере «Во весь экран» и все. И нет необходимости переходить на Youtube

  5. Вариант конечно интересный… Но столько заморочек с установкой .. картинку вырезать под каждое видео, закидывать ее на хостинг, в картинке если уж все как надо делать прописывать тайтл , альт, и потмо все остальное… не как то все это заморочно..

Добавить комментарий

Ваш e-mail не будет опубликован. Обязательные поля помечены *