Більше результатів...

Загальні селектори
Тільки точні збіги
Шукати у заголовках
Шукати у контенті
Вибір типів постів
Фільтрувати за категоріями
FAQ
Hostenko
Натхнення
Відео уроки
Новини
Плагіни
Теми
Уроки
Хакі

Якщо ви використовуєте Facebook, ви знаєте, як привертає увагу відео, яке включається автоматично. Нам знайоме це почуття. Ви прокручуєте стрічку новин, і ось ви вже дивитеся відео без звуку. Ви дивитеся те відео, яким би ніколи не зацікавилися.

Як вставити відео з Facebook у WordPress та поставити його на авто-запуск

inet.ws - Powerful VPS Hosting в США, Canada, UK та DE!

І знаєте що? Ми в цьому не самотні. Кількість щоденних переглядів відео на Facebook збільшилася з 1 мільярда у 2014 до 8 мільярдів переглядів на день у 2015. Кількість відео на Facebook зростає дуже швидко.

Дивіться також:

Якщо ви хочете використовувати цей трюк на своєму сайті WordPress, ви читаєте правильну статтю. У цій статті ми розповімо про два способи розміщення відео з Facebook у WordPress. Перший спосіб трохи легший, але він не дозволяє автоматично запускати відео. Другий спосіб вимагає трохи покопатись у коді вашої теми. Після цього ви можете швидко вставляти відео та вмикати відео на авто-запуск.

Простий спосіб вставити відео з Facebook у WordPress

Якщо ви коли-небудь розміщували відео з YouTube, повинні бути знайомі з цим методом. Facebook дозволяє вам легко вставляти відео через просту вставку З дати. Цей метод швидкий і не потребує знання коду, але у вас не буде багато варіантів для налаштування відео і не вдасться включити автозапуск.

Щоб знайти код вставки iframe, вам спершу потрібно зайти в запис, де розміщено відео на Facebook. Потім натиснути на стрілочку вниз у верхньому правому кутку і вибрати Вставити:

Як вставити відео з Facebook у WordPress та поставити його на авто-запуск

Ви повинні побачити такий iframe код:

Просто скопіюйте та вставте цей код у вкладку Текст у редакторі WordPress. Ви також можете використовувати цей код у модулях/елементах, якщо ви використовуєте будівельник сторінок:

Після публікації вашого запису, Facebook відео має з'явитися там, куди ви вставили код:

От і все! Ми ж казали, що це просто.

Якщо ви хочете покращити результат, то продовжуйте читання і ви дізнаєтеся, як вставити Facebook відео та увімкнути авто-запуск, додати субтитри та багато іншого.

Як вставити відео з Facebook у WordPress з авто-запуском

Facebook повністю перейшов на авто-запуск відео з однієї причини:

Це працює!

Додавання авто-запуску відео – це дво кроковий процес. По-перше, вам потрібно додати Facebook JavaScript SDK в header.php вашої теми. А потім потрібно використовувати код у вашому записі або сторінці для вставки відео. Ось як виконати обидва ці кроки.

Додавання Facebook JavaScript SDK до header.php

Ви можете знайти останню версію JavaScript SDK сторінці розміщення Facebook відео. Ось цей код вам потрібно вставити у файл header.php прямо після відкриття тегатіло>:

 <!-- Load Facebook SDK for JavaScript -->
  <div id="fb-root"></div>
  <script>(function(d, s, id) {
    var js, fjs = d.getElementsByTagName(s)[0];
    if (d.getElementById(id)) return;
    js = d.createElement(s); js.id = id;
    js.src = "//connect.facebook.net/en_US/sdk.js#xfbml=1&version=v2.6";
    fjs.parentNode.insertBefore(js, fjs);
  }(document, 'script', 'facebook-jssdk'));</script>

Ви можете знайти цей файл, зайшовши в Зовнішній вигляд → Редактор. Потім вибрати файл header.php вашої дочірньої теми (сподіваємося, що ви використовуєте дочірню тему).

Додайте цей код відразу після тегатіло>:

Збережіть зміни та все готове! Вам потрібно зробити це лише один раз. Тепер вставляти відео буде дуже легко!

Розміщення відео з авто-запуском із Facebook у Записах WordPress

Щоб вставити відео, ви будете використовувати такий блок коду:

<div class="fb-video"
  data-href=""
  data-width="500"
  data-allowfullscreen="true"
  data-autoplay="true"
  data-show-captions="true"></div>

У код необхідно вставити URL-адресу вашого відео. Щоб дізнатися URL вашого відео, відкрийте на Facebook запис із цим відео та натисніть правою кнопкою по самому відео, виберіть Показати URL-адресу відео:

Facebook відобразить невелике віконце, де ви зможете скопіювати URL відео:

Скопіюйте та вставте цей URL у ваш код, підставивши його в рядок з data-href="":

<div class="fb-video"
  data-href="https://www.facebook.com/redbull/videos/10157935312135352/"
  data-width="500"
  data-allowfullscreen="true"
  data-autoplay="true"
  data-show-captions="true"></div>

Після вставки URL-адреси вашого відео ви можете налаштувати його зовнішній вигляд і функції.

  • Якщо ви хочете змінити ширину відео, ви можете змінити число у параметрі data-width="500"
  • Щоб вимкнути відображення відео в повноекранному режимі, потрібно змінити значення параметра data-allowfullscreen на "False"
  • Щоб увімкнути автозапуск, вам потрібно використовувати параметр data-autoplay="true"
  • Аналогічно, щоб додати субтитри, потрібно додати параметр data-show-captions="true"

От і все! У редакторі WordPress у вкладці Текст це виглядатиме приблизно так:

Ви можете також використовувати Конфігуратор відеоплеєра Facebook та генерувати код для вставки відео самостійно.

Переваги розміщення відео з Facebook у WordPress

На додаток до авто-запуску відео, ви можете використовувати цей метод для розміщення стриму, використовуючи нову функцію Facebook. Там все працює так само.

Але функціональність вашого сайту – це не єдина перевага. Розміщення відео також впливає на просування вашої сторінки у Facebook. Ви можете публікувати власні відео у вашому обліковому записі у Facebook, а потім вставляти його на сайт, створюючи прямий зв'язок.

Розміщені відео Facebook завжди відображають сторінку, на яку це відео вставили. Тому користувачі можуть перейти через нього на вашу сторінку.

Підсумки

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

Але це не найкращий спосіб, і ось чому:

Коли ви один раз додали Facebook JavaScript SDK, то ви покінчили з цим назавжди. Вам ніколи не потрібно буде згадувати про це знову. Вставити відео тепер не складніше, ніж при використанні iframe, але у вас більше контролю над такими функціями як автозапуск та субтитри.

Ось чому ми вважаємо, що краще використати другий метод.

А ви вставляєте відео з Facebookу на ваш сайт WordPress? Який метод ви використовуєте?

inet.ws - Powerful VPS Hosting в США, Canada, UK та DE!
Олексій Шевченко
редактор wpcafe
Вивчає сайтобудування з 2008 року. Практикуючий вебмайстер, що спеціалізується на створенні сайтів WordPress. Задати питання Олексію можна на https://profiles.wordpress.org/wpthemeus/

Коментарі до запису: 4

Сергій:

Після /video.php? додайте autoplay=1& . Звук при автозапуску буде вимкнений, можна включити в меню плеєра.

Діма:

Дякую Сергій – виручили!

Амірхан:

Стаття дуже корисна! На свій сайт розмістив, працює супер! Дякую за це адміністрації!

Ед:

Сергій, добрий день.
Мене Яндекс або Google не забанять, якщо у мене частина записів на сайті повністю складаються з посилань з FB?
Ось приклад такої сторінки.
http://pmppu.ru/novosti-otrasli-06-2018/
У програмі скрін коду сторінки

Додати коментар або відгук