[250x221]Автор поста:" Сегодня я вам расскажу как легко и быстро вставить видео ролик из ютуба. Если вам это интересно то пожалуйста
1. Для начала конечно же переходим на сам сайт YouTube с роликом который хотим добавить в блог. Возьмём для примера видео под названием "Забавные собачки". :D Выглядит оно вот так:
[700x371]
2.После этого опускаемся немного ниже и смотрим, что же у нас там есть.
[700x371]
3. Ниже можно заметить кнопки "Добавить в", "Поделиться" и "Еще". Нам нужна кнопка "Поделиться", ее и кликаем, после чего выскакивает следующее окно(я подчеркну красной полосой, чтобы вы уж точно все нашли):
[700x268]
4. После этого переходим во второй раздел меню "Поделиться", а именно в "HTML-код", изображение ниже(тоже подчеркну красным):
[700x371]
5. Мы видим, что нам сгенерировали строчку iframe:
<iframe width="560" height="315" src="https://www.youtube.com/embed/SlBhDmqhAcc" frameborder="0" allowfullscreen></iframe>
iframe это такая штука которая позволяет в наш код статьи в область заданных размеров добавлять любые другие независимые документы. width="560" height="315" - значения говорят нам о том. что ширина фрейма с видео роликом будет 560 а длина 315, их конечно вы можете поменять по своему вкусу. src - значение в котором собственно указывается ссылка на желанный ролик, frameborder - это рамка, можно к примеру сделать ее не нулевой трехмерной, изменив значение 0 на 1. Ну и allowfullscreen - позволяет нам раскрывать видео на весь экран.
6. Код-ссылку iframe мы получили, что же делать нам с нею дальше? В полной форме создания записи в блоге нужно перейти в режим редактирования "Источник":
[700x225]
7. Когда кликнем увидим примерно следующее:
[700x225]
8. Вставляем наш код iframe:
[700x225]
9. И снова кликаем на Источник, получаем следующее:
[700x235]
10. Да, на стадии редактирования вы не увидите и не сможете запустить полноценно ролик, в следующей картинке я покажу, как выглядит добеленные собачки в предварительном просмотре:
[700x420]
Поздравляю! Мы справились с этой задачей. Научились добавлять ролики с YouTube на наш блог!
источник nilamop http://nilamop.com/post387802493/?upd#