smaylik2

19 сентября - День смайлика, и я решила к этому дню сделать музыкальную открыточку - https://internet-ledi.ru//densmaylika/densmaylika.htm Кстати мне ее было гораздо проще делать, потому что я использовала шаблон из готовой открытки про осень, которую вы накануне получили от меня. Ко мне стали приходить вопросы - не отображается видео в шаблоне...

Для тех, кто не знает, как вставить видео на сайт

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

 

 

видео с ютуба

Может быть он поросит вас войти, и тогда вы вводите ваш логин и пароль, с помощью которого вы входите в почтовый ящик. Если у вас нет ни одного видео, вы можете загрузить коротенькое видео (продолжительностью не более 15 минут) на свой канал.

добавить видео на yuotube

 

видео на yuotube

видео на yuotube

 

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

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

видео с ютуб

 

Проследите, чтобы ваши изменения были сохранены, и переходите на страницу с вашим видео:

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

 

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

поделиться видео с ютуб

 

 

В выпавшем окне вам нужно  будет сделать кое-какие настройки: выбрать размер и убрать птичку, чтобы не отображались похожие видео по окончанию:

023

 

как вставить видео

 

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

видео на блог

 

И вставляете в появившейся странице скопированный код.

Как сделать, чтобы не отображались похожие видео после окончания ролика

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

 

Выделенная часть - rel=1 заботится о том, чтобы видео не отображало похожие видео в конце вашего. Почему-то многие жалуются на то, что не получается избавиться от этого. Такая же ситуация была и у меня. Что только я не пробовала делать, видео просто переставало запускаться. И я читала отзывы других, что у них такая же проблема.

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

Вот, что у меня получилось:

<iframe src="//www.youtube.com/embed/t0IHFm5tLmo?rel=0&amp;autoplay=1&amp;theme=light&amp;color=white&amp;end=137&amp;border=0&amp;autohide=2" height="360" width="640" allowfullscreen="" frameborder="0"></iframe>

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

http://www.youtube.com/embed/t0IHFm5tLmo?rel=0&autoplay=1&theme=light&color=white&end=137&border=0&autohide=2

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

Вот список параметров, которые могут быть вам полезными при работе с плеером ютуба:

&vq=hd720 - высокое качество произведения (HD)

&showinfo=0 — помогает убрать рейтинг ролика и  название из плеера.

&egm=0 — активирует всплывающее расширенное меню.

&autoplay=1 - автоматически запускает ваше видео, обратите внимание - я использовала этот параметр в своем видео.

&autoplay=0 - наоборот, запрещает автоматическое проигрывание ролика.

&end=137 - останавливает видео на указанном количестве секунд - например, у меня видео длится 2:17 - это 137 секунд, вот я и поставила end=137, чтобы оно остановилось на последней секунде.

&start=10 - запуск видео через 10 секунд после загрузки.  Задавайте своё кол-во секунд.

theme=dark&color=red - задавайте параметры палитре своего плеера:

theme=dark&color=red( темная тема с красным ползунком )

theme=light&color=red( светлая тема с красным ползунком )

theme=light&color=white( светлая тема с белым ползунком ) (я выбрала себе такой дизайн)

&loop=0 -  запрет повтора ролика после просмотра, если ролик в плеере один.

&border=0 - убрать рамку плеера. Цвет можно задать параметром color1, дополнительный цвет — параметром color2. (я поставила этот параметр, но разницы не увидела - рамку не убралась)

modestbranding=1 - данный код позволяет скрыть логотип YouTube.

&disablekb=1 - отключение управления клавиатурой компьютера.

&fs=0 - делает невозможным полноэкранный просмотр.

&showsearch=0 - окна поиска не отображается при уменьшенном виде плеера.

showinfo=0 - скрывает ненужную информацию, такую как название видео и рейтинг, чтобы не было ничего лишнего.

listType=playlist&list=id_плэйлиста -  проигрывает не один ролик, а весь  плэйлист. Вместо id_плэйлиста, вставьте свой id.

fs=0 - отключает возможность просмотра видео в полноэкранном режиме.

autohide=1 - скрывает нижнею панель автоматически и логотип.  1 - скроет только нижнею панель автоматически, 0 - о скроет верхнею панель автоматически. Данный код действует через пару секунд, после того как нажали на просмотр и мышка остается в бездействии или убрали мышку с видео просмотра. А если поставить 2, то в верхней панели можно убрать логотип Ютуба

Обратите внимание, как прописываются параметры, если их вставляется несколько - все они разделены -  &, но можно ставить и точку с запятой. Надеюсь, что данная иныформация оказалась вам полезной. Ну и представляю вам результат выставленных параметров в видео:

http://www.youtube.com/embed/t0IHFm5tLmo?rel=0&autoplay=1&theme=light&color=white&end=137&border=0&autohide=2

Дополнительная информация, которая вам облегчит этот процесс  вставки видео в одностраничный сайт - статья "Бесплатный скрипт для  вставки видео Ютуб"

9 комментариев: Как вставить видео ютуб на сайт

Страница 1 из 11
  • Ольга говорит:

    Спасибо, Людмила! С интересом прочитала Вашу статью, вся информация для меня новая. Оставила у себя в закладках, чтобы использовать в работе.

    • Людмила говорит:

      Я рада, что эта информация окажется вам полезной, спасибо за отзыв

    • Людмила говорит:

      Я очень рада, что данная информация оказалась для вас полезной

  • Zrianayqg говорит:

    Большое спасибо автору материала! Много нужного у Вас в блоге. Добавил в ридер теперь буду чаще заходить.

  • Сергей говорит:

    Добрый день! Как поставить видео с ютуба на мобильную версию сайта? ставлю как показано у Вас, видео на мобильниках не показывается.

    • Людмила говорит:

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

Страница 1 из 11

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

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

Авторизация на сайте
Анимированные фоны
Магазин
katalog
plus_i_minus4
turbobanner220
Как спасти от краха свой онлайн бизнес
Подпишись на новости сайта: