Как добавить видео с YouTube на сайт?
Этот видеоурок содержит полное описание того как добавить видео с YouTube на сайт в программе Adobe Muse, как осуществить настройки проигрывателя видео, настроить его дизайн, включить или отключить основные функции и элементы управления.
Смотрите видеоурок:
Как добавить видео с YouTube на сайт
Заходим сразу в программу Adobe Muse, у меня создан новый чистый проект. И сейчас я вам покажу, как вставить видео с YouTube. Для этого мы будем использовать “Библиотеку мини приложений” Adobe Muse, в которой есть стандартные функции для размещения кнопок, меню и так далее. Нас интересует вкладка «Социальная сеть». Здесь расположено мини-приложение, которое и называется YouTube. Мы просто выделяем данное мини приложение, перетаскиваем левой клавишей мыши на страницу своего сайта, проходит некоторое время, и мы получаем вот такую картинку.
Теперь нам доступны параметры картинки данного мини приложения.
Ролик из YouTube очень просто добавляется на страницу вашего сайта. Можем считать, что мы уже разместили один ролик, просто перетащив виджет (данное мини приложение), на свою страницу сайта.
Как добавить видео с YouTube. Размещение своего видео.
Но сейчас в нём расположено совсем не то видео, которое вы хотели видеть у себя на странице. Для того, чтобы расположить необходимое нам видео, нам нужен вот этот «Идентификатор видео ролика». Сейчас здесь стоят совершенно другие буквы и цифры.
Мы заходим в браузер, на канал You Tube. Я буду брать видео со своего канала Muse уроки, вы же можете выбрать любое своё видео. И что я делаю? Я просто кликаю на это видео, для просмотра, вы видите, что запустилось моё видео. Но нас интересует вот эта надпись – строка браузера. Мы видим стандартные “https://www.youtube.com/watch?v=” и всё, что после «=», мы просто берём и копируем. Возвращаюсь в Adobe Muse, захожу в настройки данного мини-приложения, вставляю сюда данный код.
Всё, теперь я кликаю на пустом поле, проходит какое-то время, и вы видите, что моё видео вставилось и даже видна начальная картинка. Размещаю где мне это удобно, и захожу в режим просмотра.
Таким образом, вы видите, что на странице разместилось моё видео и вполне себе даже проигрывается, при нажатии на него левой кнопкой мыши.
Давайте снова перейдём в режим дизайна, и посмотрим, какие настройки есть у данного мини-приложения.
Как добавить видео с YouTube. Настройки Мини-приложения YouTube
Переходим по стрелочке и смотрим. Здесь есть «Тема» – темная и светлая у данного приложения. Таким образом мы можем менять оформление вот этого нижнего бара управления с тёмного на светлый.
Далее идет «Цвет». «Цвет индикатора хода выполнения», можно выбрать белый индикатор хода выполнения. И тогда, когда видео будет подгружаться, хвост за этим кружочком будет не красным, а белым.
«Время начала» – мы можем выбрать с какого времени начать проигрывать наш видео ролик. Если мы поставим здесь 10, например, то через 10 секунд будет запускаться просмотр нашего видео ролика. Вы видите, что ползунок уже переместился чуть-чуть вперёд.
Мы можем скрыть «показывать элементы управления», так же добавить «показать информацию», включить «автозапуск» при просмотре страницы, запустить видео по кругу, «разрешить полноэкранный режим», «отобразить или убрать подписи», поставить «похожие видео» после проигрывания, и выставить сокращённую или полную символику YouTube на своём видео.
Как добавить видео с YouTube. Пример настроек.
Если мы сейчас всё поменяем, я поставлю, например, «светлое», «белый», и уберу все элементы кроме элементов управления, и перейду в режим просмотра, то вы увидите, что у меня получилось. Индикатор наполнения у нас теперь белый, бегунок у нас стоит сразу на 10 секундах (видео начнёт проигрываться сразу с 10-секундной отметки), хвост белый теперь, а не красный, и остальные элементы отсутствуют, кроме нижнего бара управлений.
Нажимаем «проигрывать», и видео начинает проигрываться сразу с 10 секунды.
Вот так просто вы сможете вставить видео с YouTube на сайт, в программе Adobe Muse.
На этом заканчиваю этот урок. Ставьте лайки, пишите комментарии внизу. Подписывайтесь на канал, если вы этого ещё не сделали.
Автор видеоурока
Дмитрий Шаповалов
Дмитрий, подскажите, из-за чего может не отображаться видеоролик? Я указываю ID ролика (например, 8eDuupJ9Uus) или же оставляю тот, что по умолчанию – но после того, как пропадает индикатор загрузки, поле остается белым, а в середине появляется маленький значок вопроса в синем квадратике.
Здравствуйте. Возможно программе Adobe Muse не разрешен доступ в интернет в Вашей операционной системе. Попробуйте просмотреть сайт в режиме просмотра в браузере или после выгрузки на хостинг.