Відео — це чудовий спосіб урізноманітнити ваш контент, оскільки доведено, що інформація сприймається краще під час перегляду відео, ніж читання довгого цільного тексту. Тому вам обов’язково слід розглянути можливість додавання YouTube відео у ваш контент.

У Magento 2 можна вставити відео двома способами: медіа інструментом WYSIWYG за замовчуванням та модулем Magento 2 YouTube Video. Давайте з’ясуємо який із них кращий проаналізувавши їх характеристики та ефективність.

Медіа інструмент WYSIWYG за замовчуванням

Magento, спандартно, має Медіа інструмент, який дозволяє вставляти відео у ваш контент.

Magento 2 blog post page

Після натискання на нього з'являється спливаюче вікно вставлення/редагування медіафайлу. У розділі General вам потрібно вставити посилання на Джерело YouTube відео, та задати його Розміри (Dimensions). Поставте галочку, щоб обмежити пропорції.

Magento 2 insert edit media

Ви також можете Вставити код відео, яке потрібно додати у відповідному полі.

Magento 2 embed media code

Нарешті, у розділі Advanced ви можете встановити Альтернативне джерело та Постер, який буде заставкою вашого відео. Зверніть увагу, що цей розділ є необов’язковим, тому ви можете залишити ці поля порожніми.

Magento 2 insert media advanced

Після того, як ви закінчите і натиснете кнопку ОК, ви побачите, що ваше відео успішно вставлено.

Magento 2 blog post content

Ось як це виглядатиме на вітрині магазину.

Magento 2 blog post storefront

Magento 2 Youtube Video від Magefan

Так само, як і з медіа інструментом, у Magento 2 є інструмент віджетів.

Magento  2 WYSIWYG widgets

Після встановлення модуля Magento 2 Youtube Video ви зможете вибрати його зі списку доступних віджетів.

Magento 2 YouTube widget

Параметри, якими оснащений YouTube віджет:

  1. YouTube Video URL.
  2. Width and Height. Якщо залишити ці поля порожніми, буде використана ширина 100% та висота 400 пікселів.
  3. Start At. Ви можете задати час, з якого починатиметься відео, якщо є певний момент, з якого ви хочете його показувати.
  4. Repeat (loop) Video. Увімкніть цю опцію, якщо ви хочете, щоб відео повторювалось після завершення.
  5. Display Related Videos. Наприклад, якщо ви ділитеся відео зі свого YouTube каналу, ви можете показати деякі пов’язані відео.
  6. Allow full screen. Якщо цей параметр увімкнений, люди, що переглядають відео зможуть ввімкнути його на весь екран.
  7. Preview Image Quality. Якість постера, який автоматично генерується з YouTube.

Magento 2 YouTube widget options

8. Preview Image Size. Ця опція дозволяє задавати розмір зображення відео у фоновому CSS. Ви можете вибрати Contain, Cover, Auto.

9. Video Rich Snippet. Video rich snippets використовуються для того, щоб надсилати дані про відео у Google. Якщо ви їх задасте відео буде відображатись біля відповідного пошукового запиту. Ви можете задати Name, Description, Upload Date та Duration  для сніпета відео.

YouTube Widget Options

Після натискання кнопки Вставити віджет ви побачите YouTube відео, яке буде вставлено в WYSIWYG редактор.

Magento 2 YouTube widget by Magefan

Відповідно до вибраних вами параметрів, ваше відео буде відображатися на вітрині наступним чином:

Magento 2 YouTube Video

Крім того, якщо ви хочете замінити віджет YouTube в описі продукту нашим оптимізованим віджетом YouTube, ви можете перейти в Stores > Configuration > Magefan Extensions > YouTube Widget і ввімкнути відповідну опцію.

Replace YouTube iframe in Product Description Magento

Чому я повинен використовувати платний модуль замість стандартного функціоналу Magento?

Перш за все, Magento 2 YouTube віджет дає вам безліч можливостей для додавання YouTube відео як завгодно. Другою і не менш важливою особливістю є швидкість веб-сторінки. Цей модуль має відкладене завантаження відео та відеозображень, тому відео починає програватись лише тоді, коли користувач натискає кнопку Відтворити.

Також якщо відео знаходиться десь внизу або посередині сторінки, його зображення не завантажується, поки користувач не прокрутить сторінку вниз.

Порівняно з цим модулем, медіа інструмент за замовчуванням вставляє IFRAME, що збільшує час завантаження сторінки. Тож різниця цілком очевидна.

Якщо вас це зацікавило, ви можете придбати YouTube Widget як окреме розширення: Magento 2 Youtube Video та як частину Блог Екстра розширення Magento 2 Блог.