Случилось прекрасное. Получив волшебный пинок в виде замедления и потенциального прекращения работы YouTube, отечественные видеохостинги оживились и ежедневно обретают новых пользователей. В одном из материалов я рассказывал о том, как вставить VK Video на сайт под управлением Joomla. Сегодня же речь пойдет про RUTUBE. Мы поговорим про встраивание видео с этого замечательного видео хостинга на свой сайт.
Забегая вперед, расскажу. Для поставленной задачи мной были разработаны два плагина.
Один позволяет вставить полученный с RUTUBE код в визуальный редактор, второй плагин обеспечивает вывод вставленного кода на сайте.
Оба плагина совместимы исключительно с Joomla 5.
Установка на Joomla 3 и Joomla 4, вероятнее всего, приведет к тому, что ваш сайт перестанет работать!
В рамках этой статьи, мы еще обсудим плагины. Скачать их можно совершенно бесплатно по ссылке ниже:
https://sitogon.ru/joomla-plugins/vstavka-rutube-video
С плагинами или без, нам в любом случае нужен код видео. И сейчас мы поговорим о том, где его взять.
Как получить и скопировать код RUTUBE
Для того, чтобы получить и скопировать код видеоролика, размещенного на видеохостинге RUTUBE, необходимо открыть страничку видеоролика.
Хочу обратить ваше внимание! Все действия мы производим исключительно на компьютере!
Кликаем правой кнопкой мышки по видео и в контекстном меню выбираем пункт «Скопировать код для вставки видео».
Вариант два — это нажатие на кнопку «Поделиться», что расположена под видео.
При нажатии на неё откроется всплывающее окошко, где нас интересует очень похожая на ссылку кнопка «Код вставки плеера».
Нажатие откроет окно с кодом плеера. Для того чтобы получить код, достаточно нажать на надпись «Скопировать».
При желании, предварительно можно поиграться с настройками параметров. Однако, ничего полезного для себя я там не увидел.
В результате полученный действий мы получим код, состоящий из тега IFRAME.
Выглядеть он будет примерно так:
<iframe width="720" height="405" src="https://rutube.ru/play/embed/6b66c1eb0c106f6f7bdc9c902f4560f8/" frameBorder="0" allow="clipboard-write; autoplay" webkitAllowFullScreen mozallowfullscreen allowFullScreen></iframe>
Как растянуть видео с RUTUBE на всю ширину экрана?
Перед тем, как отправиться в административную панель сайта, дабы вставить полученный код в статью, модуль или еще какое место, рекомендую произвести одно несложное, но важное действие.
Откроем на компьютере самый простой текстовый редактор. Под Windows это будет «Блокнот», под Linux - «Kwrite» , «gedit» или что то подобное. Для Mac Os подойдет «TextWrangler».
Вставим туда наш код и поменяем параметр width, отвечающий за ширину. Установим новое значение равным 100%.
Теперь наш код будет выглядеть так:
<iframe width="100%" height="405" src="https://rutube.ru/play/embed/6b66c1eb0c106f6f7bdc9c902f4560f8/" frameBorder="0" allow="clipboard-write; autoplay" webkitAllowFullScreen mozallowfullscreen allowFullScreen></iframe>
Вставляем видео с RUTUBE с помощью плагинов
В начале статьи я упоминал плагины собственной разработки, которые помогают вставить код с RUTUBE на сайт.
Предвижу законный вопрос: «Зачем нам твои плагины, когда мы можем просто взять и вставить полученный код в нужное место?».
Проблема заключается в том, что многие визуальные редакторы удаляют теги IFRAME из кода страницы.
Сделано это в целях безопасности.
В итоге при попытке вставить видео, не вставляется ничего.
Вернёмся к моим плагинам.
После скачивания архива, его необходимо распаковать. Внутри находятся два дистрибутива, которые последовательно устанавливаем.
Внимание! Плагины совместимы исключительно с Joomla 5!
plg_editors-xtd_insertsitogonrutube.zip - плагин для вставки кода в визуальный редактор.
Тип плагина: editors-xtd.
plg_system_sitogonrutube.zip - системный плагин для вывода видео на сайте.
Тип плагина: system.
После установки каждый из плагинов необходимо активировать.
Далее открываем статью, где планируется вставка видео из RUTUBE.
В визуальном редакторе нажимаем на кнопку «Контент» и далее жмем на кнопку «Вставить код RUTUBE видео».
Откроется окно диалога с текстовым полем, куда мы должны вставить наш скопированный и видоизмененный код с сервиса RUTUBE.
Жмем на кнопку «Продолжить» и наблюдаем чудесную вставку кода, который отныне никакой не IFRAME. А набор параметров внутри тегов {RUTUBE}.
Не забываем сохранить статью.
Результат работы плагина можно увидеть на демонстрационном сайте по ссылке ниже:
https://joomla4.sitogon.ru/rutube-video
Заключение
Очень хочется верить в то, что развитие сервиса RUTUBE будет идти не только за счет закрытие сторонних ресурсов, а за счет развития функционала. Благо есть к чему стремиться и на что ориентироваться.
Особенно, пожелаю перестать рекламировать на главной странице канал ТНТ и сделать удобный личный кабинет. Так, как это реализовано в YouTube.
А нас можно поздравить. Мы узнали, как вставить видео с RUTUBE на сайт под управлением Joomla.
Если у вас остались вопросы и предложения, с радостью их выслушаю в своей группе VK по ссылке ниже:
С уважением, Владимир Егоров.