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

Развивая свой сайт, любой начинающий веб-мастер, однажды придёт к тому, что газетно-журнальный формат сайта ему покажется недостаточно современным и скучноватым. Сайт можно оживить с помощью видео. Видео, для многих владельцев сайтов, просто необходимо. Учебные видеоролики, видео с описание товаров и услуг, видео для просмотра фильмов в режиме онлайн - часто является необходимым атрибутом сайта. Видео - очень удобный, современный и пользующийся популярностью способ подачи и оформления материала для сайта. Вставить видео на сайт можно разными способами, рассмотрим некоторые из них.

 

Вставка видео с помощью видеохостинга YouTube

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

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

1. После успешной регистрации вы попадёте в свой аккаунт. Если у вас уже есть аккаунт Google, вам будет предложено создать канал для видео и после заполнения несложной формы вы сможете добавлять видео. Кликните по кнопке "Добавить видео".

 

 

 

 

 

 

 

 

 

 

 

 

2. Выберите файл на своём компьютере и нажмите "Загрузить". После загрузки изображения, под окном просмотра видеоролика, появится HTML-код, который нам необходим.

 

 

 

 

 

 

 

 

 

 

 

3. Скопируйте HTML-код плеера и вставьте на страницу своего сайта. Размеры плеера можно изменить с помощью атрибутов height и width (высота и ширина). Ниже можете увидеть ролик, который загружен мною для того, чтобы вы могли посмотреть, как это будет выглядеть.

 

 

Вставка видео с помощью видеохостинга RuTube

Сущность этого способа вставки видео идентична вышеописанному.

Для этого нужно пройти по этой ссылке и зарегистрироваться на сайте, заполнив небольшую анкету.

 

1. После успешной регистрации вы попадёте в свой аккаунт. Кликните по кнопке "Добавить ролик"

 

 

 

 

 

 

 

 

2. Через кнопку "Обзор" выберите файл на своём компьютере. Заполните представленную ниже форму (описание, категория). Нажмите "Загрузить"

 

 

 

 

 

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

 

 

 

 

 

 

 

4. Скопируйте код плеера и вставьте на сайт. Размеры плеера можно изменить, изменив в HTML-коде плеера параметры атрибутов height и width.

Мы рассмотрели два аналогичных способа вставки видео на сайт. Они отличаются простотой, но здесь есть небольшой недостаток - предложение просмотра других видео. Это значит, что посетитель вашего сайта, может увлечься другим видео и покинет ваш сайт. Ниже мы рассмотрим иной способ вставки видеороликов, не похожий на предыдущие.

 

Вставка видео с помощью сервиса Uppod.ru

В чём отличие этого сервиса для вставки видео на сайт? Сервис представляет конструктор плееров, которыми вы можете воспользоваться.

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

Для начала нужно зарегистрироваться на сайте. После чего следует выполнить следующие действия:

  • Создайте в корне вашего сайта (там где находится главная страница) три папки: video, styles, и player.
  • Скачайте файл плеера, кликнув мышкой по ссылке "Скачать плеер", которая находится в левом верхнем углу.
  • Распакуйте скачанный архив. Файл плеера uppod.swf закачайте в папку player, которая находится на вашем сайте.

1. После выполненных действий, зайдите в свой аккаунт. Перейдите на вкладку "Плеер" и нажмите "Видео"

>

 

 

 

 

 

2. Появится меню из трех пунктов Стили, Файлы и Плейлисты. Нажмите на "Стили", потом на "+"

 

 

 

 

3. Появится форма, в которую нужно ввести название стиля. Дайте название вашему стилю и нажмите "OK".

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

5. Теперь можно скачать стиль. Для этого, сразу после сохранения стиля, нажмите на кнопку "Скачать стили". Или перейдите на вкладку "Плеер". Нажмите на "Видео" - "Стили". Кликните мышкой по названию созданного стиля и в открывшемся меню нажмите "Скачать"

 

 

 

 

 

6. Скачанный файл стиля закачайте в находящуюся на сайте папку styles.

7. Закачайте файл видео, который вы хотите разместить на сайте, в находящуюся на сайте папку video. Имя файла должно быть на латинице.

8. Теперь перейдите на вкладку "Файлы" и нажмите "+" (добавить). Нужно добавить файл, указав его название, ссылку и выбрав стиль плеера. Жмём "OK"

 

 

 

 

 

 

 

 

9. Чтобы проверить правильность путей, перейдите вкладку "Плеер" - "Настройки". Если вы собираетесь создавать плейлисты, создайте папку pl

 

 

 

 

 

 

 

10. Теперь нужно забрать код. Для этого перейдите в меню "Файл". Кликните мышкой по названию видеоролика и нажмите "Код". Полученный код вставьте на свой сайт.

 

 

 

 

 

 

 

 

 

 

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

Мы рассмотрели несколько способов вставки видео на сайт. Существует ещё один, совершенно отличный от предыдущих, способ вставки видео. Это способ с использованием компонента AllVideos Reloaded. Но это материал для отдельной статьи.

Комментарии   

 
0 #3 ирина 25.01.2015 10:49
О-о-о у меня получилось, меньше, чем за минуту!
Огромное спасибо! :lol:
 
 
0 #2 Макс 27.07.2014 11:17
Ну наконец то нашел, то что искал! :lol:
Огромное СПАСИБО!
 
 
0 #1 Антон 25.07.2014 15:27
Спасибо большое, очень помог, делаю сайты на нтмл, не хотелось оставлять видео на вк, тут нашел выход. От души. Удачи тебе хороший человек.)
 

У Вас недостаточно прав для добавления комментариев. Возможно, Вам необходимо зарегистрироваться на сайте.