Как добавить видео YouTube в качестве полноэкранного фона в WordPress

Вы ищете способ добавить видео YouTube в качестве полноэкранного фона в WordPress?

При осторожном использовании фоновые видео могут мгновенно привлечь внимание посетителей и удержать их на вашем сайте. Это делает их отличным выбором для целевых страниц и страниц продаж.

В этой статье мы покажем вам, как добавить видео YouTube в качестве полноэкранного фона на ваш сайт WordPress.

Зачем использовать видео YouTube в качестве полноэкранного фона?

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

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

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

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

Тем не менее, давайте посмотрим, как вы можете добавить видео YouTube в качестве полноэкранного фона на свой сайт WordPress.

Как добавить видео YouTube в качестве полноэкранного фона в WordPress

Самый простой способ добавить видео YouTube в качестве полноэкранного фона — использовать Advanced WordPress Backgrounds. Этот плагин добавляет новый блок «Фон», который позволяет создавать полноэкранный фон с использованием любого цвета, изображения или видео, включая видео на YouTube.

Во-первых, вам нужно будет установить и активировать плагин. Если вам нужна помощь, ознакомьтесь с нашим руководством по установке плагина WordPress.

После активации просто перейдите на страницу или публикацию, где вы хотите добавить видео YouTube в качестве полноэкранного фона. Затем вы можете продолжить и нажать кнопку «+».

В появившемся всплывающем окне начните вводить «Фон AWB». Когда появится правильный блок, щелкните его, чтобы добавить на страницу.

В левом меню вы увидите три вкладки для различных типов полноэкранных фонов, которые вы можете создать: «Цвет», «Изображение» и «Видео».

Поскольку вы хотите добавить видео YouTube, нажмите на вкладку «Видео».

Этот плагин позволяет использовать собственное видео в качестве фона. Однако видео занимают много памяти и трафика, поэтому вам никогда не следует загружать видео в WordPress.

При этом выберите вкладку «YouTube/Видео».

Теперь вам понадобится URL-адрес видео YouTube, которое вы хотите использовать в своем блоге WordPress.

В новой вкладке просто перейдите к видео и скопируйте ссылку в адресной строке.

Сделав это, вернитесь на панель инструментов WordPress и вставьте URL-адрес на вкладку «URL-адрес видео».

Теперь редактор блоков WordPress покажет предварительный просмотр того, как будет выглядеть этот фон. Advanced WordPress Backgrounds изменяет размер видео в зависимости от контента, который вы добавляете поверх него, поэтому не беспокойтесь, если видео в настоящее время выглядит немного маленьким.

Прежде чем вы начнете добавлять контент, рекомендуется настроить параметры фона.

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

Однако, если вы хотите показывать фоновое видео на мобильных устройствах, нажмите, чтобы активировать переключатель «Включить на мобильных устройствах».

Из коробки блок будет воспроизводить все видео YouTube по кругу.

Другой вариант — воспроизвести определенную часть видео, введя точное время в поля «Время начала» и «Время окончания».

Вы также можете остановить воспроизведение видео в цикле, отключив переключатель «Цикл».

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

Когда вы впервые добавляете видео, оно отображается со 100% непрозрачностью, поэтому оно выглядит цельным.

В зависимости от дизайна вашего сайта вы можете поэкспериментировать с полупрозрачным видеофоном, перетащив ползунок «Непрозрачность изображения». Это может быть способом создать более тонкий фон для видео на YouTube.

Если вы экспериментируете с непрозрачностью, вы также можете попробовать добавить цветное наложение.

Просто нажмите, чтобы развернуть раздел «Цвет наложения», а затем используйте настройки для создания наложений разных цветов.

Плагин Advanced WordPress Backgrounds поддерживает несколько различных эффектов параллакса. Это современная техника веб-дизайна, при которой фоновый элемент прокручивается медленнее, чем содержимое переднего плана, что часто добавляет глубины дизайну страницы.

Чтобы попробовать различные эффекты параллакса, щелкните, чтобы развернуть раздел «Параллакс», а затем выберите параметр в раскрывающемся меню.

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

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

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

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

Чтобы начать, щелкните значок «+» в середине блока «Фон» (AWB).

Откроется всплывающее окно, в котором вы можете выбрать блок, который хотите добавить. Плагин Advanced WordPress Backgrounds работает со всеми стандартными блоками WordPress, поэтому вы можете добавлять любой контент, который хотите.

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

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

Когда вы довольны тем, как она выглядит, нажмите кнопку «Обновить» или «Опубликовать», чтобы страница заработала. Теперь, если вы посетите свой веб-сайт WordPress, вы увидите фоновое видео в действии.

Бонус: как добавить видеопоток YouTube в WordPress

Видеофон может привлечь внимание посетителей, а также продвигать ваш канал на YouTube. Однако, если вы действительно хотите привлечь больше посетителей и подписчиков на YouTube, вы можете добавить больше видео на свой веб-сайт.

Вот тут-то и появляется Smash Balloon.

Smash Balloon YouTube Feed Pro — лучший плагин для галереи YouTube на рынке. Он автоматически показывает все последние видео с вашего канала YouTube, поэтому посетители всегда видят самый последний контент.

Просто создайте канал YouTube с помощью простого редактора Smash Balloon, а затем добавьте его на любую страницу или в публикацию, используя либо шорткод, либо готовый блок плагина.

Вы также можете использовать Smash Balloon для встраивания плейлистов YouTube, избранного и прямых трансляций на свой веб-сайт WordPress.

Лучшее в Smash Balloon то, что он не замедляет работу вашего сайта. Встроенная в плагин функция кэширования YouTube гарантирует, что ваш сайт всегда будет загружаться быстро, что отлично подходит для SEO.

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

Если вам понравилась эта статья, подпишитесь на наш канал YouTube для видеоуроков по WordPress. Вы также можете найти нас в Twitter и Facebook.