Обновлено: 21.04.2020 пока нет комментариев

Как вставить видео с Ютуба на сайт

В этой статье расскажем, как вставить видео с Ютуба на сайт, в блог. Есть определенные нюансы, но ничего особенно сложного нет.

Какие преимущества сайту дают видео с Youtube

Знать, как с Ютуба вставить обычное видео на сайт, полезно для оживления контента, для большей наглядности. Просмотр роликов облегчает восприятие материала, ведь некоторые вещи действительно легче показать, чем объяснить. Красивая динамичная картинка привлекает внимание.

Что дает владельцу сайта вставка на страницу видео с Youtube:

  • дополнительный доход, если клип принадлежит ему же;
  • рост популярности ресурса;
  • возможность продемонстрировать портфолио целевой аудитории.

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

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

Вставка видео при помощи HTML-кода

Использование HTML-кода – наиболее популярный способ вставки клипа на странице. Если планируется использовать собственное произведение, то его сначала просто заливают на хостинг, а потом нужно:

  1. зайти на Youtube;
  2. найти нужный контент;
  3. открыть его;
  4. под картинкой справа нажать на «Поделиться»;
  5. когда появится контекстное меню, нажать кнопку «Встроить»;как вставить видео с ютуба на сайт
  6. после того как слева выйдет окно, выставить параметры;как добавить видео с ютуба на сайт html
  7. в верхней части окошка будет код, который копируют в буфер обмена;
  8. перейти на редактируемый сайт в режиме администрирования;
  9. открыть код нужной страницы;
  10. сделать разметку для создания нового абзаца (<p>текст</p>);
  11. вставить в нее код видеоклипа;как вставить видео с ютуба на сайт html
  12. нажать «Сохранить»;
  13. проверить корректность расположения и работы фильма, в том числе, в полноэкранном режиме, наличия строки управления.

Вставляем видео при помощи ссылки

Как вставить видео с хостинга Ютуб на свой сайт: для этого используется тег <iframe>. Он создаст html-документ, что открывается вместе с базовой страницей. Он будет как всплывающее окно. При использовании данного тега содержимое статьи и основной страницы всегда в приоритете.

Команда содержит такие элементы:

  • width, height – это размеры (ширина и высота соответственно);
  • autoplay — автозапуск при запуске страницы;
  • controls — вывод инструментов управления;
  • loop — автоповтор;
  • poster — команда на демонстрацию картинки, которая выводится при неполадках с показом видеоряда;
  • preload — загрузка фильма одновременно со страницей;
  • src – путь (адрес, URL);
  • frameborder – рамка. Если стоит «0», ее не будет;
  • allowfullscreen – полноэкранный режим.

Специальные плагины для вставки видео

Вставить какое-нибудь видео без ссылки на хостинги можно с помощью видеоплееров на базе JavaScript и Flash. Чтобы справится с этой задачей, нужно иметь определенные навыки программирования.

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

как добавить видео с ютуба на сайт

Ряд CMS содержат специальные плагины, существенно упрощающие задачу по тому, как вставить любое видео с Ютуба на сайт. Например, есть AllVideos или Vidbox. С ними можно вставить собственное видео без ссылки, контент из соцсетей или с какого-нибудь хостинга. Дистрибутивы ПО получают с сайтов разработчиков, потом устанавливают и активируют его. Плагины следует настраивать: уточняют шаблон, параметры картинки, директорию для хранения клипов и прочее. Если фильм получают с другого ресурса, то каждый ролик получает собственный идентификатор. Шифр можно увидеть в адресной строке при просмотре.

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

(Написано статей: 85)

Администратор и редактор сайта. Специалист имеет большой опыт в работе с сервисами Google и другими популярными интернет-платформами. Получил образование в сфере программной инженерии, после учебы начал работать в IT-сфере. Отвечает за актуальность информации, представленной на сайте, редактирование готовых материалов, рубрик.

Adblock
detector