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

В визуальном редакторе «JCE» нет функции, позволяющей загрузить видео непосредственно на joomla сайт. Но, чтобы показывать на сайте видеоролики, загружать их на сайт совсем необязательно. Для этого существуют видеохостинги.

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

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

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

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

В настоящее время наиболее популярный, качественный и надежный видеохостинг – это YouTube. Чтобы иметь возможность пользоваться всеми его сервисами, необходимо на нём зарегистрироваться.

Регистрация и загрузка видео на YouTube.

Заходим по адресу http://www.youtube.com. В правом верхнем окне видим кнопку «Войти», жмём на неё. Открывается окно входа в аккаунт Google. Если Вы имеете Google-почту, вставляете адрес своей почты и пароль. Рассмотрим случай, когда Вы не имеете Google-почты. Нажимаем на кнопку «Создайте аккаунт».

Вход в аккаунт Google.

В открывшемся окне создания аккаунта заполняем все поля, внимательно следя за подсказками, которые выдает система, и нажимаем кнопку «Далее».

Создаём аккаунт Google.

Система Вам предложит добавить фото, но это можно сделать и потом. Жмем «Дальше».

Предложение добавить фото.

Google нас поздравляет с открытием аккаунта, говорим ему спасибо и жмем на кнопку «Назад к сервису YouTube».

Поздравление Google.

В открывшемся окне приветствия YouTube жмём на кнопку «Далее». В следующем окне жмём на кнопку «Сохранить». В следующем окне нас интересует кнопка «Добавить видео». Жмём на нее.

Кнопка «Добавить видео».

Нам предложат создать новый канал. Жмём на кнопку «ОК».

Создать новый канал.

Для пользователей новых аккаунтов установлен лимит для загрузки видео не более 15 мин. Чтобы увеличить лимит, необходимо нажать на строку «Увеличить лимит» и проследовать по всем инструкциям. Сделать это можно в любой момент. Сейчас же нажмём на стрелочку.

Выберите файл для загрузки.

Выбираем видео файл, который хотим загрузить на YouTube, после чего начинается загрузка. В окне «Добавление видео» мы видим процесс загрузки в процентах. Пока файл загружается, не теряем время даром – заполняем поля «Название», «Описание», «Теги».

Добавление видео.

По завершении загрузки система покажет нам адрес, по которому расположено наше видео. Жмём на адрес.

Загрузка завершена.

Любуемся результатом.

Вставляем видео на сайт с YouTube.

Как вставить видео на сайт с YouTube рассмотрим на конкретном живом примере.

Заходим в административную часть сайта «Авторская Песня Востока». Создаем новую статью. Название статьи «Как добавить видео на YouTube больше 15 мин.». Напоминаю, что в окно «Псевдоним» желательно добавлять название статьи в транскрипции на латинице, разделяя слова черточкой. В нашем случае получилось «kak-dobavit-video-na-youtube-bolshe-15-min». Статью я хочу поместить в новости, поэтому выбираю раздел «События» и категорию «Новости».

Создаем новую статью на сайте.

Переходим к нашему видео на YouTube. Под нашим видеороликом ищем строку «Поделиться» и нажимаем на нее.

Выбор строки «Поделиться».

Далее ищем строку «HTML-код» и нажимаем на нее.

Строка «HTML-код».

Мы можем выбрать размер видео. Нормальный размер видео для сайта «Авторская Песня Востока»  - 640px по ширине, поэтому в данном случае выбираем размер 640*480. Далее, копируем код видео. Для этого выделяем полностью весь код в окошке кода при нажатой левой кнопке мышки. Затем, опустив левую кнопку, нажимаем на правую кнопку мышки и в открывшемся окошке нажимаем на строку «Копировать».

Копируем код видео.

Переходим к нашей статье. Нажимаем на кнопку «Edit Code».

Кнопка «Edit Code».

В открывшееся окно вставляем скопированный код. Для этого нажимаем правую кнопку мышки и нажимаем на строку «Вставить». Нажимаем на кнопку «Update».

Вставляем код.

Видеоролик разместился в окошке редактора «JCE». Теперь нам необходимо разместить сопроводительный текс. Текс лучше всего написать в редакторе Вашего компьютера (например, Word), скопировать его в текстовый редактор Вашего компьютера «Блокнот». Далее запоминаете текст из блокнота. Для этого выделяете текс в блокноте, нажимаете правую кнопку мышки и в открывшемся окне нажимаете «Копировать».

В редакторе «JCE» размещаете курсор мышкой правее видеоролика, нажимаете кнопку клавиатуры «Enter». При этом слева, сразу же под видеороликом должна появиться вертикальная черточка

Вертикальная черточка..

Щелкаете по правой кнопке мышки и нажимаете в открывшемся окошке на строку «Paste».

Строка «Paste».

Вставляем сопроводительный текст в открывшееся окно. Для этого нажимаем правую кнопку мышки, затем нажимаем «Вставить». Нажимаем на кнопку «Insert».

Окно «Paste».

Наш текст появился в окне редактора.

Текст в окне редактора.

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

Выделение текста.

В окошке «Font Family» выберем шрифт «Verdana», в окошке «Font size» выберем размер текста «12 pt».

Кнопки форматирования текста.

Теперь можно там оставить ссылку на вот эту статью. Для этого выделяем фрагмент текста «Уроки на все случаи жизни».

Фрагмент текста для ссылки.

Нажимаем на кнопку «Insert/Edit link».

Кнопка вставки ссылки.

В открывшемся окне вставляем адрес вот этой вот статьи в окно «URL». Для того чтобы эта статья открывалась в новой странице браузера, в окне выбора «Target» выбираем строку «Open in new window». Нажимаем кнопку «Insert».

Вставляем ссылку.

В окне редактора видно, что фрагмент с ссылкой светлее, чем остальной текст и он подчеркнутый.

Текст-ссылка в окне редактора.

На этом можно было бы и остановиться. Но есть ещё один момент – видеоролик прижат к левому краю, а хотелось бы видеть его посередине. Для центровки видеоролика применим конструкцию

<p style="text-align: center;">Код видеоролика</p>

Ничего страшного и сверхсложного в этом нет. Нажимаем на уже знакомую нам кнопку «Edit Code».

Кнопка «Edit Code».

В открывшемся окне находим код видеоролика, который мы копировали с YouTube.

Вот он наш код

<iframe width="640" height="480" src="http://www.youtube.com/embed/PBNh5yiMqQg" frameborder="0" allowfullscreen></iframe>

Код видеоролика.

Справа от кода пишем тег центровки

<p style="text-align: center;">

Слева от кода пишем закрывающий тег

</p>

Должно получиться вот так

<p style="text-align: center;">
<iframe width="640" height="480" src="http://www.youtube.com/embed/PBNh5yiMqQg" frameborder="0" allowfullscreen></iframe></p>

Отцентрованный код видеоролика.

Сохраняем код, нажав кнопку «Update» в окне вставки кода и… вспоминаем, что у нас в статье есть ссылка на внешний ресурс. Чтобы робот поисковой системы индексировал наш материал, но не переходил по ссылке нам необходимо дать ему соответствующую команду. Для этого нажимаем на строку «Мета-данные».

Строка «Мета-данные».

В окно «Параметр Robots» вставляем команду для робота «index,nofollow».

Вставляем параметры робота.

Всё! Теперь сохраняем статью.

Сохраняем статью.

И любуемся результатом!

Вставляем видео на сайт с «Мой Мир».

Из социальной сети «Мой Мир» видео на сайт вставляется так же, как и с YouTube, посредством вставки кода видео. Давайте посмотрим, как нам получить код. Под видеороликом мы видим несколько кнопок. Нас интересует кнопка «Опубликовать».

Кнопка «Опубликовать».

Наводим курсор на эту кнопку и жмём на строку «Получить код».

Строка «Получить код».

В открывшемся окне копируем код HTML.

Код видео в «Мой Мир».

Вставляем код на сайт по аналогии, как вставляли код видео с YouTube.

Вставляем код с «Мой Мир».

Отцентровать видеоролик можно тем же способом, как центруется видеоролик с YouTube. Но можно и более простым способом. Выделяем видеоролик, наведя на него курсор и хлопнув по левой кнопке мышки, нажимаем кнопку «Align center».

Центровка видеоролика «Мой Мир».

Если возникнут вопросы, пожалуйста, оставляйте их в комментариях.

Уроки на все случаи жизни

Нажимайте кнопки! Делитесь информацией с друзьями! Нажимайте кнопки! Делитесь информацией с друзьями!

Получайте информацию о новых акциях и новостях на свою электронную почту!

 

Введите адрес электронной почты:

 

 

Добавить комментарий

Ваш e-mail не будет опубликован. Обязательные поля помечены *

Можно использовать следующие HTML-теги и атрибуты: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>

Разместить ссылку на свою статью