вторник, 18 января 2011 г.

Как вставить видео с youtube в блог?

Обратились ко мне с вопросом, как правильно вставить видео в блог. Чтобы нормально отображалось. Ну помог как смог, а потом решил, что не помешает рассказать весь процесс.

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

Нажимаем. Открываются дополнительные поля. В поле "2" находится код, который нам нужен. Пока копировать его не будем, а глянем чуть ниже.

Поле "3" это цветовая гамма. Можно подобрать подходящую под фон блога.

Поле "4" это размеры окна проигрывателя. Выбираем нужный. Если подходящего нет, то можно задать свои размеры. Есть ограничение по ширине - не меньше 200px.

Задали параметры? Вот теперь выделяем код "2" и копируем его в буфер обмена. Вставить его можно куда угодно. Я расскажу как вставить его в сообщение на платформе blogspot.

Запускаем создания нового сообщения и переключаемся в режим "Изменить HTML". "1"

вставляем видео с youtube 2

Пишем наше сообщение, а в нужном месте вставляем скопированный с ютуба код. Чтобы он встал по центру поста, добавим тэг <center> в начале и </center> скопированного кода. У нас должно получиться как-то так:
<center>
<object height="344" width="425"><param name="movie" value="http://www.youtube.com/v/SOXYau_QS28?fs=1&amp;hl=ru_RU">
</param>
<param name="allowFullScreen" value="true">
</param>
<param name="allowscriptaccess" value="always">
</param>
<embed src="http://www.youtube.com/v/SOXYau_QS28?fs=1&amp;hl=ru_RU" type="application/x-shockwave-flash" allowscriptaccess="always" allowfullscreen="true" width="425" height="344"></embed></object>
</center>

Запускаем режим просмотра и оцениваем свои труды. Все нормально? Ок! А если видим, что надо изменить размер видео, то совсем необязательно снова идти на ютуб. Поправим на месте. Для этого найдем в коде вхождение width="XXX" и ставим новые значения. Таких вхождений два 2" и "3". Необходимо исправить оба! Снова проверяем, если результат нас удовлетворит, то получим новый пост с вставленным видео.

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




P.S.
Бывает, что нужно поверх видео вставить действующую ссылку. Это можно сделать, как? Читаем пост

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

11 комментариев:

  1. Как виновница этого сообщения, рада первой поблагодарить создателя полезной и своевременной информации. Огромное спасибо за твое отзывчивое сердце!

    ОтветитьУдалить
  2. Спасибо за теплые слова. Всегда рад помочь, когда могу это сделать.

    ОтветитьУдалить
  3. Очень полезное сообщение! Спасибо большое!

    ОтветитьУдалить
  4. У меня нет никакой кнопки встроить, а где взять html если кнопки нет?

    ОтветитьУдалить
  5. 2kiosaki А кнопка "Отправить" есть? Если есть, нажимаем ее. Теперь кнопка "встроить" должна быть видна.

    ОтветитьУдалить
  6. когда видео заканчивается как сделать чтобы бегунок возвращался в начало и не появлялось в низу новые плэй листы

    ОтветитьУдалить
  7. Некоторые ключики управления плеером youtube можно глянуть тут: Параметры встроенного проигрывателя YouTube
    В частности, чтобы не подгружалось похожее видео, надо использовать ключик rel=0. Внизу страницы есть пример встраивания видео

    ОтветитьУдалить
  8. [youtubе]rLBdHLLKXes[/youtubе]

    ОтветитьУдалить
  9. лично мне этот блог мне очень помог я благодарна создателям этого блога

    ОтветитьУдалить