ссылку на видео копировать код вставки
Урок 15. Как вставить видео на страницу сайта средствами HTML?
1. Как вставить видео на сайт средствами HTML?
2. Короткий код вставки видео с Youtube на сайт
Как вставить видео на сайт средствами HTML?
Есть два вида вставки видео на сайт: видео с другого ресурса (Youtube, Yandex video, Rutube и другие) и видеофайл, который уже загружен на сайт и открывающийся прямой ссылкой.
После этого Вы вставляете полученный код к себе на страницу. Получается примерно следующий отрезок кода:
Код HTML
Настройки окна видео подстраиваете под себя: width (ширина в пикселях), height (высота в пикселях). В ссылке http://video.rutube.ru/7c806393a9705797d7e92c4a05493d5d при выборе другого видео достаточно поменять код видео, который подчёркнут. Тег embed используется для старых настроек браузеров, поэтому там также не забываем поменять размеры видео и тд, иначе при просмотре через другой браузер окно с видео будет отличаться.
Поскольку простых путей не ищем, то предположим, что Вы хотите вставить SWF-файл. Существует множество плееров доступных он-лайн. Например, FlowPlayer ( скачать FlowPlayer ). После скачивания архива загрузите его на сайт в папку с соответствующим названием flowplayer. После этого надо прикрепить к странице с видео данный плеер, для этого вставляем в head следующую строку:
Код HTML
Останется только на самой стране вставить код для проигрывания видео. В href не забудьте вставить путь к видео.
Из плюсов данного метода хотел бы отметить отсутствие рекламы при проигрывании видео и, при нормальной работающем хостинге(!), быструю загрузку видео.
Короткий код вставки видео с Youtube на сайт
На этот случай достаточно одной строки кода с использованием iframe. В коде будет менять только http://www.youtube.com/embed/WRtAVxqacQM короткий идентификационный код для видео. Также по желанию можно изменить размеры окна видео: width (ширина в пикселях), height (высота в пикселях).
Код HTML (вставляем куда угодно в body документа)
И наслаждаемся клипом LP!)
Вставка видео или тег video в HTML5
Позволяет встраивать, воспроизводить и управлять настройками видеоролика на веб-странице.
Синтаксис
Пример кода тега video
Вставка видео с помощью в html-страницу при помощи embed
Элемент embed используется для загрузки и отображения объектов (например, видеофайлов, флэш-роликов, некоторых звуковых файлов и т.д.), которые исходно браузер не понимает. Чем метод отличается от предыдущих? В большинстве случаев, подобные объекты требуют подключения к браузеру специального модуля, который называется плагин, или запуска вспомогательной программы.
К слову, спецификация HTML 4.0 рекомендует использовать тег object для загрузки внешних данных вместо тега embed. Однако некоторые браузеры не отображают таким образом нужную информацию, поэтому наилучшим вариантом будет поместить embed внутрь контейнера object.
Спасибо за внимание! И успехов при вставке видео на сайт!)
Как поделиться ссылкой на видео с выбранного момента?
Всем, привет! В этой статье покажу, как можно поделиться ссылкой на видеоролик с выбранного момента. Это удобно, в частности, если в видео есть интересующая другого человека информация, но она дается не вначале, а где-нибудь по ходу видео. И чтобы ему не смотреть ролик сначала, или не передвигать ползунок в поисках нужного кадра, вы просто даете такую ссылку, при переходе по которой видео начинает воспроизводиться с нужного фрагмента.
Рассмотрим эту возможность на примере видеороликов с YouTube, Вконтакте, Одноклассников и Vimeo.
Вы можете посмотреть мое видео по данной теме:
Начнем с Ютуба. Здесь, чтобы скопировать ссылку на видео с привязкой ко времени, передвиньте ползунок проигрывателя на нужный фрагмент. Далее под роликом нажмите на вкладку «Поделиться» и под ссылкой поставьте галочку напротив «Начало». В окошке уже отобразилось время, с которого начнется проигрывание (в моем случае это 7-ая секунда), а к ссылке добавился соответствующий хвостик:
Если вы просматриваете видеоролик, встроенный с Ютуб, на каком-нибудь сайте и также хотите поделиться им с определенного фрагмента, не обязательно переходить на видеохостинг. Просто зафиксируйте ползунок на желаемом моменте, нажмите по ролику правой кнопкой мыши и выберите пункт «Скопировать url видео с привязкой ко времени» (браузер Google Chrome).
Ссылка сохранится в буфер обмена, а далее сочетанием клавиш ctrl+v вставьте ее там, где хотите поделиться. Эту же опцию можно использовать и на самом YouTube, минуя вариант, описанный выше.:)
Если вы встраиваете видео с Ютуб на свой сайт и хотите, чтобы оно запустилось с выбранного фрагмента, рекомендую статью о дополнительных настройках плеера.
Если вы просматриваете видеоролик в плеере Вконтакте, то им также можно поделиться с желаемого фрагмента. Здесь, по аналогии с Ютубом, передвигаете ползунок в нужное место видео, жмете по плееру правой кнопкой мыши и выбираете «Копировать ссылку на кадр».
Получаете ссылку вот такого вида:
При переходе по ней ролик начнет воспроизводиться с указанного фрагмента. В моем примере – это 11-ая минута 33-я секунда.
Для видеоплеера Одноклассников это тоже работает. При нажатии по проигрывателю правой кнопкой мыши выбираем пункт «Скопировать url с привязкой ко времени».
И получаем свою ссылку:
Что касается проигрывателя Vimeo, здесь все также – останавливаем ползунок на желаемом фрагменте. В правом углу плеера кликаем по иконке «Share» (Поделиться). В поле «Link» выделяем ссылку мышкой, сразу под ней появится отметка «Start video at» (начать видео с такого-то момента) и выбранное вами время. Поставьте галочку рядом и скопируйте свою ссылку.
Друзья, вот так просто все делается. Если вы еще не пользовались этой возможностью, то теперь знаете, как поделиться видеороликом с нужного фрагмента.
Спасибо вам за внимание!
Самый простой способ добыть ссылку на видео, mp3 и тому подобное 🕔 1 мин.
Внимательные читатели уже знакомы с DowloadHelper, плагином для браузера Mozilla Firefox (почитать и скачать можно в этом посте). Подробно рассказывалось, как с его помощью можно скачивать изображения на странице превью, не открывая каждый исходный файл.
После постов “Как сделать простой MP3-плеер в посте” и “Вставляем в пост видеоплеер, не загружая файлы” больше всего не очень опытных пользователей напугала система “добычи” ссылки на MP3, FLV или, например, MP4-файлы. С плагином DownloadHelper этот процесс превращается в сплошное удовольствие.
Ничего не поняли? 🙂 Посмотрите предыдущий пост с фильмом “Свадебный переполох”, прочитайте указанные выше посты про видео- и mp3-плееры. Принцип такой: находим в Интернете файл и собираем плеер, не загружая видеоаудиофайл, а только указывая на него ссылку. Понятнее?
Подробно о создании такого простого, но очень удобного видеоплеера рассказано в упомянутой статье “Вставляем в пост видеоплеер, не загружая файлы”.
В итоге нам нужно получить примерно такой код:
Самое важно – это получить ссылку на видеофайл — http://media.win.online.ua/d1/005/052/179/145917.flv. И здесь на помощь приходит плагин.
1. После установки плагина (как устанавливать плагины Firefox подробно написано в этом посте), в панели браузера появится вот такой значок:
Вначале он будет неактивный (серого цвета). Но когда мы переходим на страницу с медиафайлами, значок станет цветным и начнет вращаться – плагин что-то обнаружил.
Для скачивания (конвертации, получения ссылки…) видео переходим на страницу с ним и нажимаем воспроизведение (просмотр видео).
Теперь нажимаем на черную стрелочку справа от разноцветного значка плагина, выбираем нужный файл (в данном случае он один) и в выпадающем меню нажимаем на “Копировать ссылку”. Всё!
Эта система работает на 99% сайтов и позволяет получать ссылки на любые медиафайлы: фото, видео, аудио разных форматов.
В нашем случае мы скопировали ссылку http://media.win.online.ua/d1/005/052/179/145917.flv. По ней можно скачать видео или вставить ее в код, как описано выше.
Вопросы по теме прошу задавать в комментариях. Спасибо за внимание! Получайте удовольствие в Интернете!
Вечно ваш, дядя Шурик.
Опубликовано: 14 Июня 2010 г. 11:19
Если вы нашли ошибку, пожалуйста, выделите фрагмент текста и нажмите Ctrl+Enter.
Ссылка на видео и HTML-код для вставки видео на сайт c YouTube
Интерфес на YouTube поменялся и статья «Как получить HTML-код для вставки на сайт видео с YouTube» немного устарела, хотя все принципы получения HTML-кода видео для вставки на сайт остались прежними. К тому же хочется ещё затронуть вопрос о том, как получить просто ссылку на видео с Ютуба. Поэтому решил обновить материал и добавить в него информацию про ссылку на видео. Итак, обо всём по порядку:
Кнопка «Поделиться» для получения ссылки на видео и HTML-кода для вставки видео на сайт c YouTube
Кнопка «Поделиться» для получения ссылки на видео и HTML-кода для вставки видео на сайт находится справа под заголовком видео YouTube (под самим видео). Рядом с кнопками лайков и прочими ссылками по пользовательскому управлению видео.
Для того, чтобы открыть панель со ссылкой на видео и HTML-кодом для вставки, нужно найти эту кнопку и кликнуть по ней один раз левой кнопкой мышки:
Как скопировать ссылку на видео YouTube
После того, как открыто всплывающее окно со ссылками, нужно обратить внимание на строчку типа:
Как получить HTML-код для вставки на сайт видео с YouTube
Кнопка «Встроить» HTML-код с YouTube
Для того, чтобы получить HTML-код для вставки на сайт видео с YouTube нужно кликнуть левой кнопкой мышки один раз по кнопке в виде <> с названием «Встроить». Эта кнопка первая в верхнем ряду кнопок со ссылками на соц.сети:
с названием «Встроить»» width=»674″ height=»698″/>
Копирование HTML-кода для вставки на сайт видео с YouTube на широких экранах
На широких экранах при раскрытии нового всплывающего окна в нижнем правом углу будет ссылка-кнопка «Копировать». После клика по этой кнопке, HTML-код для вставки видео с Ютуба будет скопирован в буфер обмена. Об этом будет сообщено в надписи в нижнем правом углу экрана: «Ссылка скопирована в буфер обмена». После этого, полученный код можно вставлять в HTML-документ.
Код выглядит например так:
Ну и конечно картинка, как найти эту кнопку «Копировать» на Ютубе:
Копирование HTML-кода для вставки на сайт видео с YouTube на узких экранах
На узких экранах кнопки «Копировать» почему-то дизайнерами YouTube не предусмотрено, поэтому HTML-код для вставки нужно скопировать вручную. Для этого нужно кликнуть один раз левой мышки в любое место, где расположен код:
Для тех, кто привык пользоваться мышкой для копирования, нужно кликнуть правой кнопкой мышки по выделенному HTML-коду. Откроется контекстное меню браузера. Из него нужно выбрать пункт «Копировать»:
Резюме:
Таким образом можно быстро найти и скопировать либо ссылку на видео с YouTube, либо HTML-код для вставки на сайт видео.
Как вставить видео с YouTube в публикацию на сайте Joomla. Вставка тега iframe в админке Joomla.
На краю земли
Личный блог Лапаевой Людмилы
Как получить HTML код видео
Чтобы вставить видео на сайт, сначала надо получить его HTML код
Самый простой вариант кликаем по нему правой кнопкой мышки и в открывшемся окне находим строчку скопировать HTML код и вставляем код себе на сайт, но иногда это не срабатывает, есть другие варианты:
Рассмотрим три варианта открытых источников
1.Вариант, когда при наведении мышки на экран в правом верхнем углу высвечиваются три квадратика, нас в данном случае интересует средний
нажимаем на него и получаем картинку ниже, где нажимаем «COPY» и HTML код видео копируется в буфер обмена
Нажимаем на экране перейти на You Tube
Переходим на сайт You Tube и видим под роликом слово «поделиться»
Нажимаем на него и появляется новая строчка, находим слово «HTML-код», нажимаем на него
Появляется сам код
Копируем его и вставляем на сайт
Если мы хотим, чтобы показывалось только наше видео и после просмотра не предлагались другие видео, надо нажать на слово «ещё» под кодом
откроется предварительный просмотр, ниже ролика будет табличка
убрать галочку в графе «Показать похожие видео после завершения просмотра».
Нажимаем на видео кнопочку @mail.ru и переходим на сайт
В новом окне ниже видео есть разные варианты, нас интересует «Опубликовать»