Главная » Бизнес в Интернете

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

вставить видео на сайтВсе, кто начинает создавать свои сайты и блоги, рано или поздно сталкиваются с вопросом: как вставить видео на сайт, на страницу или в статью на блоге, и каким способом лучше это сделать. Самый распространенный способ — использовать один из множества видеосервисов: Яндекс Видео, YouTube, Vimeo и так далее. Конечно, такой способ самый простой. Он легок, доступен, файлы видео не занимают место на Вашем хостинге, потому что хранятся на этих видеосервисах.

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

плеер uppodДавайте научимся хранить свои видеофайлы на хостинге, там, где Вы держите свои сайты. И использовать для этого Вы будете замечательный сервис uppod.ru.

У Вас при этом появляются еще и дополнительные возможности: Вы можете настроить как угодно внешний вид плеера, можете создавать свои плейлисты и делать многое другое.

плеер uppodВидео, вставленное на сайт или страничку с помощью видеосервиса Uppod, не содержит никаких ссылок на сторонние сервисы, и даже не содержит никаких сторонних записей. Плеер от Uppod абсолютно автономный, и его работа никак не зависит от работы сервиса.

Немаловажно также и то, что плеер Uppod поддерживает множество форматов видео, в том числе один из самых распространенных форматов: mp4.

Итак, что Вы должны сделать, чтобы вставить видео на сайт и показывать его посетителям с помощью установленного на хостинге плеера Uppod.


  1. видео uppodСначала Вам нужно зарегистрироваться на видеосервисе Uppod. Заходите по адресу uppod.ru и нажимаете на кнопку Регистрация. Дальше еще проще: придумываете логин и проверяете, свободен он или нет, пишете e-mail, придумываете пароль и повторяете его. Потом нажимаете на кнопку Готово. При последующих входах Вы будете нажимать на кнопку Войти, вводить свой логин и пароль и попадать на сервис под своим именем.
  2. хостинг JinoНа хостинге, на котором Вы хотите вставить видео на сайт,  например, на хостинге Джино, Вам нужно будет выделить место, где Вы будете хранить Ваши видео. Место хранения может быть достаточно произвольным. К примеру, можно создать в корневой папке своего домена папку VideoUppod специально для этой цели. В этой папке нужно разместить еще три папки: video, styles и player. Можете при этом использовать программу Total Commander.
  3. Потом скачиваете файл плеера uppod.swf с сайта Uppod, нажав на ссылку Скачать плеер. Распаковываете скачанный архив, берете файл плеера, и закачиваете в папку player на своем хостинге.
  4. Выбираете внешний вид плеера, нажав на пункт меню Скины. Готовые стили плееров можно посмотреть, нажав на любое видео из предложенных. Стилей огромное количество, выбираете из них понравившееся, и нажимаете Сохранить. После этого нажимаете Собрать — Плеер — Видео — Стили и в стилях увидите свой стиль, который Вы только что сохраняли. Выделяете его и выбираете пункт меню Скачать. Закачиваете файл на компьютер. Потом закачиваете в папку styles на хостинге сохраненный на компьютере файл.
  5. вставить видео на сайтИ, напоследок, в папку video на хостинге закачиваете свой видеофайл. Только проверьте, чтобы формат Вашего видео соответствовал тому, который поддерживается плеером Uppod. Посмотреть список форматов Вы можете по этой ссылке.
  6. После этого на видеосервисе Uppod Вы выбираете Собрать -Видео — Файлы, нажимаете на «+» , пишете название для Вашей записи, ссылку на Ваш ролик, а также выбираете стиль и нажимаете ОК.
  7. Потом Вы проверяете, правильно ли Вы все сделали. Нажимаете на видеосервисе Uppod на пункт меню Настройки, и в окошках указываете путь к плееру, и к папке со стилями. Окошко для плейлистов заполнять не нужно, так как плейлисты Вы не создавали. Нажимаете на кнопку Сохранить.
  8. вставить видео на сайтЧтобы забрать код, переходите в Плеер — Видео — Файлы, выбираете свой видеофайл, потом выбираете Код и копируете себе html код, который Вам нужно будет потом поставить на страницу сайта, там, где Вы хотите видеть свой ролик.

Как вставить видео на сайт, используя видеосервис Uppod

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

Также на видеосервисе Uppod можно создавать собственные стили. Для этого нужно зайти в Плеер — Видео — Стили, создать новый стиль и в этом стиле выбрать опцию Редактирование.


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

Также Вы можете подписаться на блог, и узнавать о всех новых статьях.
Это не займет много времени. Просто нажмите на ссылку ниже:
    Подписаться на блог: Дорога к Бизнесу за Компьютером

Вам понравилась статья? Поделитесь, буду весьма признателен:


Также приглашаю добавиться в друзья в социальных сетях:

<< Предыдущая статья Следующая статья >>
Проголосуйте и поделитесь с друзьями анонсом статьи на Facebook:  

47 комментариев »

  • Татьяна пишет:

    Будем пробовать. Спасибо!

  • Олег пишет:

    Александр, нужный урок, спасибо! А то все только о том, как видео с Ютуб вставить пишут, еще и плагин для этого используют.

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

  • Александр пишет:

    Интересный материал. Я видео на сайты еще не загонял, а тут такая подробная инструкция как это сделать. Обязательно воспользуюсь видеосервисом Uppod.

  • Михаил пишет:

    Спасибо, Александр. Очень нужный урок. У меня уже назревает потребность в создании обучающих видеоуроков. А еще иногда появляется желание опубликовать игровые сказочные фильмы, снятые моей внучкой Таней. Она и сценарист, и оператор, и монтажер, и одна их актеров в своих фильмах. Вчера ей 15 лет исполнилось.

  • Татьяна пишет:

    Видео на сайте очень хорошо смотрится. Заставляет гостей задерживаться, привлекает посетителей. Спасибо, что обучаете.

  • Арина пишет:

    Спасибо, Александр. Пригодится ваш совет!

  • Всеволод пишет:

    Долго искал эту информацию. Описано хорошо — буду пробовать реализовать Ваши рекомендации. Спасибо за статью!

  • Lady пишет:

    Отличный сайт у Вас!Только тихонько поскиглила о том как вставить видио, а тут ...есть и конкретно...Может Вы подскажете и как вебинар сделать (есть необходимость на работе...)

  • Наталья пишет:

    Как много узнала нового! Даже не подозревала о таком замечательном видео сервисе! Что ж будем пользоваться его возможностями!!!

  • Надежда Юдина пишет:

    Спасибо за информацию, обязательно опробую и этот сервис. Но здесь существует такая же проблема, как и на других сервисах — это вставка HTML кода видео в статью. Если вставить код и сразу же опубликовать статью, то никаких проблем не возникает, а если что-либо добавить или переключить с визуального редактора на редактор HTML, сразу же ломается код и видео не работает. Подскажите, пожалуйста, в каком редакторе и как Вы вставляете код видео в статью, чтобы он не поломался и можно было продолжать вводить текст статьи далее и переключать редакторы визуальный и HTML.

  • Александр Ризун (автор) пишет:

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

  • Надежда Юдина пишет:

    Эта проблема не только у меня, если почитать форумы, она у многих. Но я сейчас так и делаю — вставляю код видео непосредственно перед нажатием кнопки «опубликовать» и больше ничего со статьей не делаю. Спасибо за ответ!

  • Cветлана пишет:

    Отличная информация. Обязательно воспользуюсь видеосервисом Uppod.

  • Нина пишет:

    Возможность хранить файлы видео у себя на хостинге, используя сервис Uppod, очень интересна и имеет право на жизнь.Вариант,когда распоряжаешься своими файлами и вставляешь их напрямую на сайт,минуя сторонние сервисы,без сомнения, нужно использовать.Большое спасибо, Александр, за подробную инструкцию.

  • Татьяна пишет:

    Заглянула :)

  • Vasili70 пишет:

    Александр, большое спасибо за статью.

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

    Вы подсказали решение. Спасибо, буду пробовать.

  • Игорь пишет:

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

  • Арина пишет:

    Александр, спасибо. У меня как раз возник вопрос, где хранить видео? Вашим советом ,думаю,воспользоваться. Спасибо!

  • Андрей пишет:

    Именно поэтому мои сайты на американском хостинге с неограниченным местом на сервере. Спасибо за подсказку про сервис.

  • Марина Гай пишет:

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

  • Арина пишет:

    Спасибо,Александр. Моя подруга уже воспользовалась вашим советом, когда я скинула ей ссылку.

  • Юлия пишет:

    Огромное спасибо за такую подробную рекомендацию. Надеюсь пригодиться-сделала закладку на Ваш сайт-)

  • Константин пишет:

    Замечательный видеосервис Uppod! Век живи, век учись! Спасибо!

  • Галина Жилкина пишет:

    Хорошее дело — Твиттер. Зашла на Ваш сайт по ретвиту Константина. Он плохого не порекомендует. У меня на сайте много видео и всегда интересовали новые возможности вставить видео на сайт. Сейчас я использую плагин WP-lightpop (подробная инструкция по установке у Константина на сайте есть). Плагин нравится, но как Вы точно отметили в статье «Видео хранятся не у Вас, значит, Вы зависите от качества работы этих видеосервисов. Кроме того, Вы можете эти видео и потерять, если с видеосервисом что-то случится.» Это уже было с несколькими видео и мне пришлось их удалять с сайта и переделывать статью, а это не совсем удобно. Спасибо Вам большое за очень полезную статью, сделала закладку. Буду пользоваться.

  • Лидия Вехтер пишет:

    Здорово!!! Обязательно попробую, спасибо!

  • Елена пишет:

    Спасибо за урок! Возьму в закладку!

  • александр пишет:

    Хорошая статья,обязательно попробую.

  • Наталья Кривцова пишет:

    Уважаемый Александр! Что бы мы без Вас делали? Ваше точное, методичное и последовательное изложение материала на фоне ваших личный глубоких знаний позволяет понять и освоить любую, даже самую сложную тему! Я думаю, что не только я, а уже тысячи людей, в т.ч. «Академиков» Вам благодарны и признательны! А про видео я теперь, уж точно, никогда не забуду. Ваш голос стал не только знакомым, но и уже родным! Спасибо преогромное!

  • Надежда Юдина пишет:

    Разместила уже два видеоурока на своём сайте благодаря Uppod и Вашей замечательной статье и видеоуроку, в которых так подробно всё представленно. Спасибо, Александр!

  • Владимир пишет:

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

  • Марина пишет:

    Спасибо! Очень полезная информация, всё подробно расписано!

  • Алевтина пишет:

    Уже не один раз пользовалась Вашими уроками: фотошоп,научись быстро печатать и многие другие.Эта статья тоже очень полезная,попробовала.всё получилась. Спасибо Вам за уроки и советы.

  • марфа пишет:

    наконец-то я нашла ту информацию, которая нужна была.

    объяснили очень хорошо буду делать, попробую.

    спасибо!

    много информации, а ответов нулевой, такие простые слова «все очень просто вставляй видео на сайт и всё», а куда вставить плеер не знала.

  • марина пишет:

    хотелось узнать как сжать видео?

  • Александр Ризун (автор) пишет:

    Марина, нужно переконвертировать, возможно, с небольшой потерей качества. А уже потом можно использовать.

  • марина пишет:

    где брать конвертировать бесплатно, то есть какая программа?

    у меня есть программа, но не знаю какая из них есть жатая.

  • Александр Ризун (автор) пишет:

    Марина, если программы есть, конвертируете, и смотрите какой размер получится после сжатия. И так проверяете программы. Я знаю платные варианты, бесплатные не пробовал.

  • Марина пишет:

    не знаю куда приписать «og:video, og:video:type»

    ПРЕДУПРЕЖДЕНИЕ: чтобы ваши данные использовались в сервисе Яндекс.Видео необходимо дополнительно указать поля: og:video, og:video:type

  • Александр Ризун (автор) пишет:

    Это касается флеш роликов:

    og:video — путь к видеоплееру или файлу

    og:video:type — тип видео, например: application/x-shockwave-flash, video/webm, video/mp4, video/ogg

    Эти данные нужны, если Вы хотите, чтобы ролик индексировался Яндексом, они добавляются в метатеги страницы.

  • Виктор пишет:

    Ну, наконец-то я нашел то, что искал!!!

    Спасибо огромное за статью и плеер!

  • Татьяна пишет:

    Здравствуйте! На хостинге Джино, купила или как правильно назвать) Хостинг, сделала папки и т.д., но совсем не вижу как у них можно копировать адрес загруженного видео. В папке же его будет много например, а копируется только название самого загруженного файла например: Нехороший мальчмк.avi , а не адрес видео, первый раз сталкиваюсь с такой проблемой, подскажите пожалуйста что я делаю не так(((.

    Заранее спасибо, Татьяна.

  • Александр Ризун (автор) пишет:

    Адрес видео — это Ваш домен, затем через косую черту все входящие папки, и затем в конце название файла видео. И не называйте файлы по русски, а также не используйте пробел.

  • Татьяна пишет:

    Спасибо за ответ! но я все равно с еще одним дурным вопросом?

    В папке video, будет же находится не один фильм, нужно выбрать просто нужный загруженный и копировать строчку браузера?

    Извиняюсь, если действительно глупо спрашиваю.

    С уважением, Татьяна.

  • Татьяна пишет:

    Приношу извинения за предыдущее сообщение, я совсем не обратила внимание на ваше видео, после просмотра мне стало все более понятно.

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

    Может у вас есть статья на эту тему которую я могу почитать.

    С уважением, Татьяна.

  • Александр Ризун (автор) пишет:

    Да, нужно домен будет прикрепить к сайту на укоз, прописать нужные DNS. Какие именно, Вам должна будет подсказать техподдержка укоза.

  • Людмила Целярицкая пишет:

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

  • Виктор пишет:

    Здраствуйте, Михаил.Я заливаю видеоролики на сервер с помощью программы FileZilla, установил Flowplayer нормально работает.Как можно изменить цвета, дизайн видеоплеера?

Оставьте свой комментарий и ответный визит Вам обеспечен