Показать видео на сайте WordPress с помощью функций движка и плагина
Прогресс идет вперед и не всегда текстовый формат помогает понять тему, легче и быстрее записать ролик. Загрузить на youtube легко, но как потом показать видео на сайт WordPress вот проблема. Статья полностью ответит на данный вопрос и даст простые и пошаговые инструкции.
Вставить через прямые ссылки
После загрузки файла на любой из популярных хостингов, например Vimeo, Youtube и Tumblr можно воспользоваться прямым URL на видеофайл из браузера. Идем на страницу, где проигрывается ролик и копируем url.
Переходим в создание статьи или записи и во вкладке Визуально (старого редактора), или в поле абзац в (Gutenberg), прописываем ссылку и она автоматически преобразуется в экран просмотра.
Показать как именно происходит загрузка невозможно, просто заносите адрес. Можно воспользоваться инструментом для видео формата в редакторе гутенберг.
- Нажимаем на плюс
- Находим раздел вставка
- Ищем сервис или социальную сеть откуда нужно взять ролик на сайт WordPress
Появится блок WordPress куда заносим адрес и нажимаем кнопку вставить.
Метод подходит только для популярных видео сайтов, в других случаях пользуемся встроенным инструментом сервиса.
Добавить iframe в WordPress для видео на сайте
Универсальный метод, каждый сервис, дающий возможность добавить видеоролик на сервер, заботиться чтобы его могли порекомендовать и вывести на сайтах, используется тег iframe.
Таковой является социальная сеть Вконтакте, WordPress не воспринимает ВК и редакторе нет. Открываем видео на сайте ВК и смотрим инструкцию.
- Жмем на стрелочку
- Переходим во вкладку Экспортировать
- Копируем код
- Если нужно, то перед копированием настраиваем величину
Переходим на сайт, в старом редакторе вставляем код во вкладке текст.
Код в WordPress обработался, в Визуально увидим сформированное видео.
Если работаем в Gutenberg, ставим блок HTML-код.
Помещаем iframe конфигурацию, можно нажать Посмотреть, WordPress обработает и добавить видео на экран.
Данная возможность на YouTube находится под видео. Настраиваем отображение и копируем HTML.
На любом сервисе и в социальных сетях ищите кнопку поделиться, и там найдете такую функцию как в ВК экспортировать или встроить. Для более наглядного примера смотрите наше видео.
Как разместить видео на блоге с плагином ARVE
WordPress Плагин ARVE упростит процесс и может с расширенными настройками разместить ролик Ютуб на сайте. Находится в официальном репозитории здесь.
Устанавливается стандартно, имеет несколько настроек. Единственный минус, что дружит плагин только со стандартным редактором WordPress. Переходим в написание записи и видим новую кнопку Video, нажимаем.
Появится всплывающее окно, можно сделать множество интересных вещей:
- Задать миниатюру
- Выровнять по центру (что бывает проблематично)
- Задать продолжительность
- Сделать автозапуск
- Выставить ширину и высоту
- Управление звуком
- Авто реплей
Плагин переведен на русский язык и не требует разбора. Пользуйтесь если вас не устраивает стандартный функционал WP.
Устаревший тег embed
В вордпрессе существует поддержка бесполезного шорткода embed, его заменил автоматический процесс. Если интересен метод, то берем конфигурацию такого вида.
[ embed ]URL скопированная с ютуба[ /embed ]Видео формат через компьютер (без ссылок на ютуб)
Выставить видео на сайте можно без ссылки на ютуб, а через жесткий диск компьютера. Ролик будет загружаться с хостинга где располагается блог WordPress. Сразу напишу, почему не стоит использовать способ:
- Сокращает пространство
- Тормозит сайт
- Форматы поддерживаются только в mp4 расширении
- Большие файлы нельзя загрузить
Если не переубедил, то движемся дальше. Нажимаем на кнопку Добавить Медиафайл.
При работе в Gutenberg находим плюс, в разделе основные выбираем блок Видео, остальные шаги одинаковые.
Перетаскиваем с компьютера файл, он загружается.
После сохранения в углу жмем Добавить в запись.
Если процесс прошел хорошо, то в предварительном просмотре увидим загруженное.
Используя любой вариант исполнения следите, чтобы на мобильных устройствах сайт отображался корректно.
Лучший способ: используя плагин OmniVideo
Выше рассмотрены стандартные способы добавить видео на сайт, которые вебмастеры WordPress используют уже много лет. Но я считаю лучшим более современный метод, предполагающий применение плагина OmniVideo.
“ОмниВидео” — это плагин студии WPShop, который позволяет создать на сайте единый блок с роликами из нескольких источников.
С OmniVideo можно работать, как в классическом редакторе, так и в Gutenberg.
Классический редактор. Используйте шорткод, где указываются ссылки на конкретные ролики и основные настройки блока. Подробнее о настройках прочитайте в обзоре функций OmniVideo на нашем сайте. Пример кода:
[omnivideo title='название' youtube='ссылка' vk='ссылка'/]Описание[/omnivideo]Gutenberg. В редакторе добавляется отдельный одноименный блок после установки плагина. В нем достаточно задать все необходимые параметры.
Обзор блока Gutenberg в OmniVideo
Скидка на OmniVideo
Закончу статью, мы ответили на вопрос как работать с видео на блоге, в статьях и записях с помощью простых инструкций без кодирования.
Пожалуйста, оцените материал:
