Логотип

Как создать сайт

Всё что нужно для создания сайта!

Как добавить видео на сайт ucoz с Youtube и Vimeo


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

На этот раз, вопрос как добавить видео, мне задал человек на моём канале в youtube, он хотел узнать как можно добавить видео из популярного хостинга vimeo.com. Я ему записал урок на видео и решил поделится этими знаниями и на сайте.

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

Можно-ли загружать свои файлы?

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

Есть конечно другой вариант, купить место на диске, но 20 GB стоит 16$ - это самый большой размер на сайте, хотя если написать в службу поддержки, может за определённую суму выделят ещё место.

В общем если есть деньги, можете смело воспользоваться данным вариантом, и загружать видео на свой сайт, но проблема в то-что, система ucoz позволяет загружать самый большой файл на сайт в размере 15мб, а некоторые видео вешают намного больше, до несколько Гигабайт.

Так-что самый простой способ найти посторонний хостинг, такой как Youtube или Vimeo и на него загружать видео, либо арендовать свой хостинг, в котором будут хранится ваши файлы. На начальном этапе развития сайта, я-бы выбрал первые два варианта а потом потихоньку перешёл на свой хост.

Приступим к добавлению видео

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

dobnowost

На следующей странице у нас откроется редактор, заполните категорию и название для своего видео, после найдите кнопку (Панель HTML кодов) и нажмите.

redacktor

Теперь шагаем на youtube, найдём подходящее видео для своего сайта, под видео найдите кнопку поделится и нажмите на неё, откроется вкладка в которой найдите кнопку HTML-код и нажмите на неё, после должна открыться вкладка в которой находится код, скопируйте его.

kodyoutube

Теперь перейдём на свой сайт и вставим данный код в HTML редактор. Если вставили код, обведите его мышкой, чтобы он стал синим и нажмите кнопку выравнивание. Данная кнопка поможет видео выровнять по центру страницы - это мы увидим после добавления видео на сайт, или можно переключится на визуальный редактор и посмотреть.

center

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

tegs

В открывающем теги есть ещё атрибут align и у него значение center, как раз значение центр и выравнивает наше видео или всё что было помещено промеж этих двух тегов по центру. В коде для видео, найдите два атрибута width и height - если у них поменять значение, а в данном случае это цифры, тогда видео наше станет в первом случае шире (width - ширина) а во втором выше (height - высота).

width

Почти всё, перед добавлением видео на сайт, проверьте что-бы галочка которая добавляет автоматически тег <br> была снята, а иначе код может сломаться и видео работать не будет.

Тег <BR> - Помогает разделять строчки в тексте, другими словами создаёт пустые строчки между текстом.

br

Всё осталось нажать на кнопку добавить, и видео должно попасть на сайт. Зайдите на страницу проверьте всё-ли работает, загружается видео, текст, если вы добавляли к видео его, отображается корректно.

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

Как вставить видео с Vimeo?

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

smolet

Должно открыться окно, в котором найдите код и скопируйте его.

kopis

Данный код вставьте в HTML - редактор. Этот код содержит в себе лишние ссылки, от них нужно будет избавится. Найдите в коде тег <p> и в месте с этим тегом, обведите мышкой остальной код, до закрывающего тега </p>. Как только обвели можете смело удалять часть этого кода

Тег <p>Текст</p> - Обычный тег, который помогает наш текст брать в абзац. Если текст очень большой, его удобно разделять при помощи данного тега, просто куски текста заключать в этот тег.

p

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

Задай свой вопрос в комментариях? или в специальном разделе.
Подсказка:

Перед тем как начать создавать сайт, изучи язык разметки HTML.

Курс ещё не готов, но подписчики получат его первыми - как только работа будет закончена. На данный момент 23.08.2017 записано 19 теоретических уроков и 0 практических. Теоретический кус Готов! "Как создать, настроить, наполнить и раскрутить сайт на uCoz"