Как вставить видео с YouTube на сайт WordPress

Здравствуйте друзья! В предыдущей статье из рубрики YouTube мы разобрали как скачать видеоролик с YouTube, а сейчас разберем несколько вариантов как вставить видео с YouTube на сайт с движком WordPress.

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

Существует два основных способа как можно вставить видео на страницу сайта: в текстовом режиме редактора WordPress или помощью различных плагинов.

Я приверженец первого способа вставки видео на страницу сайта, этот вариант наиболее универсален и подходит не только для сайтов на платформе WordPress, но и для всех остальных.

Зачем вставлять видео на сайт?

Зачем вообще необходимо вставлять видео на страницу сайта (поста)? Причин этому может быть несколько, рассмотрим основные из них.

Лучшее восприятие информации

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

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

Улучшение поведенческих факторов

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

Дополнительная аудитория

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

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

Таким образом получается грамотная перелинковка между Вашими важнейшими информационными ресурсами — сайтом и YouTube, и этим ни в коем случае нельзя пренебрегать.

Как вставить видео с YouTube на сайт

Давайте займемся практикой и рассмотрим как вставить видео с YouTube на сайт, созданным на WordPress. Обращаю Ваше внимание, что можно вставлять не только собственные ролики (со своего канала), но и любые чужие.

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

Стандартный код для вставки видео

Итак предположим, что Вы выбрали нужный ролик для вставки на сайт, далее выполняем следующие действия:

1. Под роликом находим и нажимаем кнопку Поделиться
2. Выбираем вкладку HTML-код
3. Получаем исходный код для вставки на сайт
4. Вставляем код в нужное место на страницу веб-сайта

Получаем код для вставки видео

Для вставки кода, необходимо переключить редактор WordPress в режим Текст и в нужное место вставить скопированный код.

Вставляем код на страницу сайта

При переключении обратно в визуальный режим мы увидим наше вставленное видео на странице.

Дополнительные возможности кода

Ранее мы получили стандартный код для вставки видео с YouTube на сайт. Нажав на надпись ЕЩЕ прямо под кодом, нам откроется панель с чекбоксами, в которой мы можем задействовать дополнительные возможности для вставки видео на сайт.

Дополнительные возможности для вставки видео

Из названия пунктов в принципе понятно какие параметры можно изменить:

1. Изменить размер видео, выбрать стандартный из выпадающего меню, либо задать свой
2. По окончанию видео можно разрешить/запретить выводить похожие ролики
3. Убрать панель управления внизу видео — будут недоступны кнопки перемотки, ролик можно только поставить на паузу или продолжить
4. Можно убрать название видео сверху ролика

Расширенные скрытые настройки

Включение автоматического воспроизведения.

Вы наверное замечали, что при открытии некоторых сайтов сразу начинается воспроизведение видео. Обычно так делается на подписных страницах, для блога же так делать не рекомендуется. Данный режим включается добавлением в код «&autoplay=1» сразу после идентификатора ролика:

Воспроизведение с нужного места

Добавив в код встраивания “#t=” и указав нужное время после знака равно, ролик начнет проигрываться с этого времени.

• &vq=hd720 — КАЧЕСТВО HD
• &autoplay=1 - Автовоспроизведение (пример выше)
• &modestbranding=1 — скрыть лого Ютуба
• &showinfo=0 — скрыть название и рейтинг
• &controls=0 — скрыть полосу прокрутки

Скрипт Ютуб Профессионал

Вставить видео с YouTube на сайт поможет альтернативный бесплатный сервис получения кода с расширенными возможностями. Для доступу к скрипту необходимо перейти на страницу бесплатных скриптов. Далее переходим на вкладку меню Ютуб Профессионал и заполняем форму. Форма напоминает стандартные возможности Ютуба, но несколько расширена по возможностям.

Скрипт Ютуб Профессионал

Например функция автоплея уже встроена в скрипт, добавлена возможность управления видео с клавиатуры. После нажатия на кнопку Сгенерировать код, появляется дополнительное окно справа с готовым кодом для вставки на сайт видео.

Что очень удобно сервис предлагает сразу увидеть результаты настроек, в Ютубе для этого необходимо запустить ролик.

Вставить видео с YouTube в сайтбар

Здесь все очень просто. Если кто не в курсе что такое сайтбар и виджет, милости просим сюда. Процесс полностью аналогичный, также формируем код любым из описанных выше методов, вставляем полученную строку в виджет Текст и наслаждаемся показом видеоролика в сайтбаре.

Необходимо учесть, что ширина сайтбара как правило намного меньше ширины поля статьи, поэтому надо правильно подобрать размеры ролика.

На этом я заканчиваю обзор как вставить видео с YouTube на сайт. Как видите ничего сложного в этом нет, справиться любой новичок. Я специально не стал рассматривать вставку видео на сайт с помощью плагинов, т.к. попробовав несколько вариантов решил для себя, что оптимально и правильно использовать код html.

С Уважением Дмитрий Леонов | leonov-do.ru