Как встроить видео из Facebook в WordPress (3 простых способа)

Хотите встроить видео из Facebook в WordPress?

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

В этом руководстве мы шаг за шагом расскажем о 3 простых способах встроить видео из Facebook в WordPress.

Вишенка сверху? Добавить видео из Facebook в WordPress невероятно просто с помощью правильных инструментов, поэтому щелкните любую из быстрых ссылок ниже, чтобы перейти к вашему любимому методу:

Как встроить видео из Facebook в WordPress с помощью SeedProd

Один из способов добавить видео на ваш сайт WordPress — на этапе проектирования и разработки. Например, вы можете добавить приветственное видео на свою домашнюю страницу или объясняющее видео на целевую страницу продукта.

Поскольку исследования показывают, что добавление видео на целевые страницы может повысить коэффициент конверсии на 34 % , это разумный шаг для любого владельца веб-сайта. Итак, вместо того, чтобы использовать видео с YouTube, почему бы не использовать повторно видео со своей страницы в Facebook?

Лучший способ создать целевую страницу или индивидуальный дизайн WordPress — это использовать конструктор страниц WordPress, такой как SeedProd.

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

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

Следуйте приведенному ниже руководству, чтобы встроить видео из Facebook в WordPress с помощью SeedProd.

Шаг 1. Установите и активируйте SeedProd

Сначала установите и активируйте плагин SeedProd на своем сайте WordPress. В этом руководстве мы будем использовать SeedProd Pro из-за его расширенных функций.

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

Шаг 2. Выберите шаблон

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

В SeedProd это можно сделать двумя способами:

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

Примечание. Оба варианта позволяют использовать блоки Facebook для встраивания видео.

В этом руководстве мы будем использовать конструктор целевых страниц. Итак, перейдите в SeedProd » Landing Pages на панели инструментов WordPress и нажмите кнопку «Добавить новую целевую страницу» .

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

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

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

Шаг 3. Настройте шаблон целевой страницы

На следующем экране вы увидите конструктор страниц SeedProd с функцией перетаскивания. Он предварительно отобразит ваш шаблон справа и покажет несколько блоков и настроек слева.

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

Если вам нужны дополнительные параметры настройки, перейдите на вкладку «Дополнительно» для этого блока. Здесь вы увидите параметры настройки типографики, цвета, отступов, интервалов, адаптивности к мобильным устройствам и многого другого.

Поскольку в этом шаблоне нет встроенного видеоэлемента, нам нужно добавить его для отображения видео Facebook. Мы покажем вам, как это сделать дальше.

Шаг 4. Добавьте блок встраивания Facebook

Чтобы встроить видео Facebook на свою целевую страницу, прокрутите раздел «Дополнительные блоки» слева и найдите блок Facebook Embed. Теперь перетащите этот блок на место на целевой странице.

По умолчанию блок Facebook Embed будет отображать пост-заполнитель Facebook вместо видео. Чтобы изменить это, откройте настройки блока, щелкнув по нему, и выберите параметр «Видео» в раскрывающемся меню «Тип».

Затем вставьте URL-адрес видео на Facebook в поле «Ссылка на видео». Теперь вы должны увидеть предварительный просмотр вашего видео на Facebook, встроенного в вашу целевую страницу.

Существует несколько способов настроить внешний вид встроенного видео. Например, вы можете включить или выключить переключатели, чтобы разрешить полноэкранный режим, автоматическое воспроизведение видео и включить субтитры.

На вкладке «Дополнительно» есть настройки для изменения интервала видео, атрибутов CSS, видимости устройства и добавления эффектов анимации.

Продолжайте настраивать целевую страницу, пока не будете довольны дизайном. Например, вы также можете добавить кнопку Facebook «Мне нравится», отзывы или даже форму подписки для сбора адресов электронной почты.

Не забудьте нажать кнопку Сохранить , чтобы сохранить изменения.

Совет для профессионалов: при настройке целевой страницы перейдите на вкладку «Настройки страницы» , чтобы настроить параметры SEO на странице и добавить информацию об отслеживании пикселей Facebook.

Шаг 5. Опубликуйте свою страницу видео на Facebook

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

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

Оттуда вы можете продолжить и нажать «Опубликовать» под кнопкой «Сохранить», чтобы ваша целевая страница с видео в Facebook была встроена в прямом эфире.

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

Как встроить видео в Facebook с помощью плагина Facebook Video

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

Например, вы можете добавить видеопоток Facebook на боковую панель своего блога или включить его в сообщение WordPress, чтобы проиллюстрировать его пользовательским контентом.

В этом методе мы будем использовать плагин Custom Facebook Feed Pro от Smash Balloon.

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

Кроме того, Pro-версия Smash Balloon позволяет вставлять видео в формате HD, 360o и Facebook Live, а также общее количество лайков, комментариев, акций и реакций для каждого сообщения. Это очень полезно, если вы публикуете регулярные прямые трансляции.

Шаг 1. Установите плагин Facebook Feed Pro

Для начала установите и активируйте плагин Custom Facebook Feed Pro на своем сайте WordPress. Если вам нужна помощь в этом, вы можете следовать этому руководству по установке и активации плагина WordPress.

После того, как плагин активен, перейдите в Facebook Feed »Настройки в панели администратора WordPress и введите лицензионный ключ Smash Balloon. Эта информация находится под вашей учетной записью на веб-сайте Smash Balloon.

После ввода ключа нажмите кнопку Активировать .

Шаг 2. Подключите свою страницу или группу Facebook к WordPress

В Smash Balloon вы можете вставлять видео со страницы Facebook или группового канала. Однако для этого вам сначала нужно подключить свою группу или страницу Facebook к WordPress.

Итак, перейдите в раздел Facebook Feed »All Feeds и нажмите кнопку «Добавить новый» .

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

Теперь вы можете выбрать источник своей ленты: страница Facebook или группа. Для этого нажмите Добавить новый .

Затем выберите вариант «Страница Facebook» или «Группа Facebook» и нажмите кнопку «Подключиться к Facebook» .

Откроется окно, в котором вы можете подключиться к своей учетной записи Facebook и выбрать страницы или группы для использования с Smash Balloon.

После этого нажмите Далее .

Теперь Facebook позволит вам выбирать тип информации, к которой может получить доступ Smash Balloon, и функции, которые он может выполнять. Чтобы ограничить доступ, отключите любой из переключателей.

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

Когда вы довольны разрешениями, нажмите «Готово» , чтобы вернуться на панель управления WordPress.

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

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

Шаг 3. Создайте макет ленты видео на Facebook

Теперь Smash Balloon вернет вас на страницу «Создать ленту Facebook». Здесь вы можете выбрать только что добавленную страницу и нажать кнопку «Далее» .

Следующим шагом будет создание макета вашего видеопотока на Facebook. На следующем экране вы можете выбрать одну из нескольких тем с различными эффектами стиля:

• По умолчанию
• Современный
• Социальная стена
• Контур
• Перекрывать

Выберите понравившуюся тему и нажмите кнопку «Далее» .

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

Мы используем макет по умолчанию, но вы можете выбрать любой понравившийся макет и нажать «Далее» .

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

Если вы выберете вариант «Список воспроизведения», вам нужно будет вставить URL-адрес списка воспроизведения в поле, прежде чем нажимать «Далее».

Теперь плагин создаст ленту на основе вашего источника Facebook и выбранного вами шаблона. Это отличный способ начать; однако вы можете дополнительно настроить внешний вид видео на своем сайте.

Шаг 4. Настройте свои видео на Facebook

Smash Balloon предоставляет множество различных способов настроить отображение видео на Facebook на вашем веб-сайте. Чтобы найти эти настройки, просто щелкните значок карандаша рядом с любым из ваших каналов.

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

Слева находится панель с параметрами настройки для настройки:

• Шаблон
• Тема
• Тип фида
• Макет ленты
• Цветовая схема

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

Не забудьте нажать кнопку Сохранить , чтобы сохранить изменения.

Шаг 5. Вставьте свои видео с Facebook в WordPress

Теперь пришло время встроить вашу индивидуальную ленту Facebook на ваш сайт WordPress, и Smash Balloon упрощает этот процесс.

В редакторе каналов нажмите кнопку «Встроить» в правом верхнем углу.

Откроется всплывающее окно с тремя различными способами публикации видео на Facebook:

• С шорткодом Smash Balloon
• Использование блока Smash Balloon на странице WordPress
• Использование блока Smash Balloon в области виджетов

Нажав кнопку «Страница», вы откроете список доступных страниц на вашем веб-сайте. Просто выберите переключатель на соответствующей странице и нажмите кнопку «Добавить» .

Выбранная вами страница откроется автоматически. Оттуда вы можете щелкнуть значок «Плюс», чтобы добавить новый блок WordPress и выполнить поиск блока Custom Facebook Feed.

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

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

Добавление фида в область виджетов происходит аналогично. Перейдите к Внешний вид » Виджеты , щелкните значок плюса в любой области виджетов и найдите блок Custom Facebook Feed.

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

Вот скриншот того, как может выглядеть добавление вашего видеопотока Facebook на боковую панель WordPress:

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

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

Однако этот метод предлагает меньше вариантов настройки, чем более ранние решения. Это также требует копирования и вставки фрагментов HTML-кода из конфигуратора, поэтому, если вам это не нравится, мы рекомендуем метод 1 или 2.

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

Откроется всплывающее окно с кодом iframe, который вы можете скопировать и вставить на свой сайт WordPress. Вы можете либо включить полную публикацию, либо вставить видео с определенного времени начала.

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

Скопировав код, создайте или отредактируйте запись или страницу в WordPress и добавьте блок Custom HTML в редакторе блоков.

Теперь вставьте код встраивания видео в блок Custom HTML. Если хотите, вы можете щелкнуть вкладку «Предварительный просмотр», чтобы увидеть, как это выглядит.

Оттуда нажмите кнопку публикации или обновления, чтобы сделать ваше видео живым.

Вот оно!

Мы надеемся, что это руководство помогло вам встроить видео из Facebook в WordPress. Чтобы получить еще больше полезных советов и руководств, ознакомьтесь с руководствами ниже:

• 23 идеи розыгрыша Facebook для развития вашего бизнеса
• Как легко создать лендинг для видео (+ 5 шаблонов)
• Как добавить виджет Twitter в WordPress (шаг за шагом)

Спасибо за прочтение. Следите за нами на YouTube, Twitter и Facebook, чтобы получать больше полезного контента для развития вашего бизнеса.