Как использовать видеоблок WordPress

Блок видео WordPress позволяет легко загружать и добавлять видео на ваши страницы и сообщения. Это дает вам множество возможностей для управления размером и функциями. Добавление видео с помощью этого блока делает контент более профессиональным и желанным. К счастью, видеоблок прост в использовании.

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

Как добавить блок видео в сообщение или страницу

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

Если вы предпочитаете, вы можете ввести / video, где вы хотите разместить блок, и нажать Enter или выбрать его из вариантов.

Видеоблок будет размещен в области содержимого. Вставка мультимедиа работает так же, как блок изображения. Загрузите видео, выберите видео из библиотеки или вставьте URL-адрес видео, которое вы хотите отобразить. Если URL-адрес получен из такого источника, как YouTube, блок будет преобразован в блок этого типа. Вариантов минимальные, пока вы не загрузите видео.

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

Настройки и параметры видеоблока

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

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

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

Блок или стиль изменения видео

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

Группа - добавляет блок в группу, чтобы вы могли настроить их как единый блок.

Столбцы - блок помещается в столбцы.

Медиа и текст - добавляет текст рядом с медиафайлами, создавая две колонки.

Обложка - над видео помещается подпись. Вы можете изменить заголовок с блока абзаца на другие типы текстовых блоков или кнопки.

Файл - это превращает видео в кнопку с подписью, позволяя пользователю загружать видео, а не воспроизводить его с веб-сайта.

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

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

Затем видеоблок будет размещен на новом месте.

Перемещение блока видео

Переместите видеоблок на один раздел содержимого с помощью стрелок вверх и вниз.

Выравнивание изменения видеоблока

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

Это широкая ширина. Занимает большую часть экрана.

Текстовые дорожки видеоблока

Текстовые дорожки показывают субтитры и подписи во время воспроизведения видео. Они отформатированы как файлы WebVTT (Web Video Text Tracks) .vtt. Файлы загружаются из медиатеки.

После того, как вы загрузили файл .vtt, вы увидите варианты редактирования трека. Добавьте метку, выберите язык и тип трека.

Метка - это заголовок текстовой дорожки, который пользователь увидит, когда посмотрит на доступные дорожки.

Исходный язык - это язык текстовой дорожки.

Kind относится к типу трека, который будет отображаться. Варианты включают:

• Субтитры - перевод диалога.
• Подписи - транскрипция диалогов, звуковые эффекты, музыка и т. Д.
• Описания - текст, описывающий происходящее.
• Главы - заголовки глав для навигации.
• Метаданные - данные для использования JavaScript.

Затем подписи добавляются к параметрам проигрывателя, которые могут выбирать пользователи.

Заменить блок видео

Это позволяет заменить видео другим видео.

Параметры видеоблока

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

Вот что делают варианты:

Скрыть дополнительные настройки - это скрывает правую боковую панель, удаляя отвлекающие факторы и расширяя рабочее пространство.

Копировать - это копирует видеоблок в буфер обмена, чтобы вы могли вставить его в любом месте содержимого.

Дублировать - добавляет дубликат блока под оригинал.

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

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

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

Редактировать как HTML - показывает HTML только этого блока, оставляя все остальные блоки как обычно.

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

Группа - добавляет блок в группу, чтобы вы могли настроить все блоки как единое целое.

Удалить блок - удаляет блок.

Параметры субтитров для видеоблока

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

• Встроенный код
• Встроенное изображение
• Ввод с клавиатуры
• Зачеркнутый
• Нижний индекс
• Надстрочный
• Цвет текста

Каждый из них влияет на выделенный вами текст.

Настройки видеоблока

Настройки для видеоблока включают видео и расширенные. Давайте посмотрим на оба.

Настройки видео

Настройки видео позволяют контролировать работу плеера. Варианты включают:

Автовоспроизведение - автоматически воспроизводит видео при загрузке страницы.

Цикл - воспроизведение видео в непрерывном цикле.

Без звука - отключает звук.

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

Play Inline - воспроизводит видео в области воспроизведения элемента.

Предварительная загрузка - устанавливает, какая часть видео загружается при загрузке страницы. Выберите «Авто» (все видео), «Метаданные» (только основная информация) или «Нет» (ничего не загружается автоматически).

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

Передовой

Расширенные настройки видео включают привязку HTML и дополнительные классы CSS.

Якорь HTML - позволяет указать текст, который будет использоваться в качестве настраиваемого URL-адреса для этого конкретного блока.

Дополнительные классы CSS - предоставляет поле для добавления любых классов CSS, которые вы хотите использовать для этого блока.

Советы и рекомендации по эффективному использованию видеоблока

Если вы встраиваете видео из таких источников, как YouTube или Vimeo, используйте их блок, а не блок видео.

Сожмите видео и уменьшите его размер и время загрузки.

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

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

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

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

Часто задаваемые вопросы о видеоблоке

Какова цель этого блока?

Этот блок упрощает размещение видео на вашем веб-сайте и дает вам контроль над работой плеера.

В чем разница между видеоблоком и встроенным видео?

Встроенное видео из таких источников, как YouTube и Vimeo, не дает вам контроля над функциями проигрывателя.

Как лучше всего использовать этот блок?

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

Заключение

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

Ждем вашего ответа. Вы используете видеоблок? Расскажите нам о своем опыте в комментариях.

Лучшее изображение через PD99 / shutterstock.com