Доброго времени суток, уважаемый посетитель блога ИнетСоветы.ру. Из этой статьи, вы узнаете, как вставить видео на сайт с Ютуба и настроить его отображение и воспроизведение.
Чтобы не занимать место на своем хостинге, удобнее выложить водеоролик на видеохостинг Youtube и разместить на сайте ссылку на видео. Также эти знания вам понадобятся, если вы для дополнения информативности, публикуемого на сайте материала, размещаете видеоролики других авторов.
Что дает публикация мультимедиа в посте
- улучшение восприятия материала и дополнение информации в текстовом формате;
- если информация в статье носит обучающий характер, мультимедиа наглядно продемонстрирует весь процесс на практике;
- увеличение времени нахождения посетителя на сайте, что позитивно сказывается на поведенческих факторах;
- повышение доверия к автору и улучшение конверсии в виде подписок и продаж;
- можно получать дополнительный доход от монетизации видеороликов. Подробнее читайте в статье «Как заработать на видео на Youtube».
Как разместить видеоматериалы на сайте
Способов всего два:
- Загрузить файл на хорстинг, где размещен ваш сайт. Дальше подключить видео плеер и показывать медиаролик посетителям. Но у этого метода целых два недостатка. Во-первых, при большом числе одновременных просмотров, создается огромная нагрузка на сервер хостера. Это в свою очередь может привести к тому, что хостер наложит ограничения на сайт или даже временно отключит его, из-за превышения допустимой нагрузки. А во-вторых, видеоролики занимают много места на сервере, а оно тоже ограничено вашим тарифным планом.
- Трансляция видео, предварительно загруженного на Ютуб. Ссылка со специальным кодом позволит легко вставить на сайт видео с Youtube. И это не только позволит сэкономить ресурсы сервера, не создавая никакой нагрузки на него, но и позволит привлечь дополнительную аудиторию из популярного видеохостинга.
Как встроить видео с Youtube на сайт
После того, как рассмотрены способы вставки и их преимущества и недостатки, самое время показать, как добавить видео на сайт с Ютуба.
Регистрироваться на Youtube вовсе не обязательно, если вы не планируете вести свой канал. Получить код видео на Ютубе для любого понравившегося видеоролика можно без регистрации.
Как получить html код видео с Youtube
На странице с роликом сразу под видеоплеером найдите кнопку «Поделиться»:
Откроется окно с выбором способа отправить ссылку. Для размещения на сайте нас интересует ссылка на видео Youtube в html, и чтобы ее получить нажимаем на кнопку с подписью «Встроить»:
После клика по этой кнопке будет показан код для вставки видео с Youtube, выглядит он вот так:
Дальше у вас два варианта. Первый - взять и разместить видео на сайте с Ютуба, как есть, ничего не меняя в стандартных настройках кода. Второй – внести правки в код и настроить под себя.
Сначала рассмотрим, какие стандартные настройки нам предлагаются видеохостингом:
- Выбрать начало воспроизведения. Ставим птичку в чекбоксе возле надписи «Начало» и вводим время, с которого начинать показ видео. Изменять начало времени воспроизведения стоит, если ролик длинный. Чтобы пользователи не скучали, просматривая ненужный контент, вы им экономите время и сразу предоставляете нужный материал.
- Можно отключить показ похожих видео по окончании просмотра.
- Не показывать панель управления проигрывателем. Это означает, что пользователь не увидит таких кнопок, как пауза/воспроизведение, полосу прокрутки.
- Также можно отключить показ названия ролика и панель действий.
- Последняя опция – повышенная конфиденциальность. Это влияет на сбор информации о пользователях, просматривающих ролик.
Раньше можно было указать желаемые размеры проигрывателя, указав, например, ширину, а высота подбиралась автоматически, сохраняя пропорции. Сейчас это опции нет в новых версиях браузера. Теперь это можно сделать, внеся правки в код.
Проделав приведенные выше настройки, вы можете скопировать html-код видео с Youtube, и разместить его в статье на своем сайте.
Если у вас старая версия браузера, чтобы получить html-код, под проигрывателем нажмите «Поделиться», выберите вкладку «HTML-код»:
Изменение настроек
Дополнительно стоит рассмотреть, какие правки можно внести руками в код для вставки видео на сайт.
- Автоматическое воспроизведение видео с Youtube на сайте. Если у атрибута autoplay=1 значение 1, то будет происходить автоматический запуск видеоплейера после загрузки страницы. Для отключения установите 0.
- Для изменения размеров окна проигрывателя укажите нужные размеры у элементов width, height. Первый отвечает за ширину, а второй за высоту. Важно соблюдать пропорции.
Как вставить код видео с Ютуба в html на платформе WordPress
Для того, чтобы вставить ссылку на видео в Ютубе, в редакторе Вордпресс переключаетесь на вкладку «Текст». Далее, выбираете после какого абзаца будет отображаться проигрыватель с роликом и добавляете туда полученный код:
По умолчанию проигрыватель будет выровнен по левому краю. Если хотите задать выравнивание по центру, заключите его код в тег <center></center>.
Чтобы посмотреть, как встроилось видео с Youtube на сайте, нажмите на кнопку «Посмотреть изменения» и откроется страница с предварительным просмотром оформленной записи.
Как вставить видео с Ютуба в ВК
Разместить видео с Ютуба в ВК намного проще, чем на сайте. Весь процесс публикации заключается в нескольких кликах. Нажмите на ссылку «Поделиться» под роликом, откроется следующее окно, где нужно выбрать социальную сеть ВКонтакте:
Если вы уже авторизованы в своему аккаунте в ВК,откроется страничка, где можно указать, как будет размещено видео (на стене или личным сообщением). Вы можете добавить свой комментарий. Если не хотите, чтобы было опубликовано изображение от видеоролика, снимите птичку возле чекбокса «добавить изображение». Также есть возможность добавить ролик в «Мои видеозаписи».
Схожим образом можно поделиться ссылкой на видео с Ютуба в других социальных сетях. Если вы не нашли ответа на свой вопрос в статье, задайте его в комментариях ниже.
Видео по центру так же можно выровнять в визуальном редакторе или с применением тега div — ссылка на видео
Доброго времени суток, Виктория! Всё понятно и доступно изложено. Но есть такой вопрос. Как отключить плагин, вставив ссылку с ютуба, если статей на блоге уже много и в каждой есть видео? В ручном режиме на это уйдёт не один день.
Доброго времени суток, Сергей!
Даже и не знаю, как это автоматизировать. Скорее всего руками придется делать.
Если ссылка в статье с Ютьюба после отключения плагина не сохранится, то придется заново проставлять их вручную или парсером, если статей очень много.
После отключения плагина ссылки на видео Ютуб сохранятся. Сергей хочет скопировать эти ссылки в другое место. Парсер скопирует ссылки, а как парсер вставит ссылки?
Спасибо, очень помогло!
Я всегда пользуюсь этим способом, очень удобно, вместо того, чтобы довать ссылку на видео, я соазу вставляю его на сайт, так и поведенческие факторы улучшаются и посетитель не уходит на другой сайт.
Сейчас уж достаточно просто ссылку на видео вставить в статью без дополнительных тегов.
Виктория, у меня опять вопрос. Ваши советs только для вставки видео на WordPress блог? Или эти рекомендации как то применимы для блогов на Blogger? Спасибо).
Можно вставлять в блоги, которые работают на Blogger, главное условие — добавление кода не в визуальном редакторе, а в html, иначе видео работать не будет.
Я кстати тоже сначала в визуальном редакторе вставлял и видео не работало, а потом разобрался. Многие после первых проб думают что вставить видео на сайт тяжело и забрасывают это дело теряя такой классный инструмент.
Я свои первые видео на блог вставлял описанным в статье способом, потом начал вставлять только ссылку через визуальный редактор.
Одно время сталкивался с проблемой вставки видео на блог, но потом как оказалось проблемы была в том что владелец видео просто запрет поставил на публикации видео. А я перечитал всю информацию о том как вставлять видео на блог. Не знал что здесь у вас есть подробная информация на эту тему.
Интересно, по какой причине у некоторых людей с первого раза не получалось вставить видео с Ютьюба на блог на Вордпрессе? Может для вставки видео с других источников требуются ккакие-то дополнительные манипуляции, но в случае с Ютьбом у меня дажи и мысли никогда не возникало ставить какие-то дополнительные плагины.
Виктория, в очередной раз прочитала вашу статью. Появился вопрос: загружать на блог с ютуба можно только свои видео или любые по теме. Если второе, не будет ли это плагиатом?
Если кто-то напишет жалобу, что вы разместили его видео у себя, то его удалят модераторы.
Теперь всё понятно, спасибо. Раньше я думала, что размещать можно только своё видео.
А зачем загружать видео с Ютьюба на хостинг? Достаточно просто ссылку на него поставить, чтоб не занимать место.
Замечательно, я нашла ответ на свой вопрос. Теперь предстоит научиться снимать качественные видео.
Хроший видеокурс по съмке видороликов и скринкастов создал Игорь Лохман. Действительно много полезной информации, особенно, если вообще не представляешь, как этот процесс происходит.
Спасибо большое сегодня попробую!
У меня в визуальном редакторе желтые квадратики видно, но при просмотре неопубликованной статьи — только пустое место под ролик. Сам ролик становится видно уже при публикации статьи
Ну так и должно быть, в админке видео не будет воспроизводится, это же код, только при просмотре готовой опубликованной статьи видео будет видно.
Спасибо за столь качественную написанную статью.Вы мне очень помогли
Всё пережевано и преподнесено на блюдечке с голубой каёмочкой.
Спасибо. Доступнее некуда.
Виктория, спасибо за статью! Теперь стала добавлять видео из YouTube без загрузки на хостинг, а то очень много места занимало и грузилось чуть дольше. Очень полезная информация для блоггеров.
Это ж какое дорогое удовольствие получалось, если на блоге очень много статей и в каждой было видео.
Как всегда оченьь полезная информация,
Спасибо