Головна Різне 🎥 Як додати відео на сайт

🎥 Як додати відео на сайт

Востаннє оновлено May 06, 2025

Ви можете легко додати відео на платформу за допомогою вбудованого iframe із YouTube або Facebook.

Де можна додати відео?

  • Публікації

  • Нормативно-правові акти

  • Публічна інформація

  • Сторінки

Як додавати відео?

Для того щоб додати відео, вам необхідно створити нову або відкрити на редагування вже існуючу публікацію/рішення/сторінку та перейти до текстового редактора, в якому набирається основний текст публікації/рішення/сторінки. Всі подальші кроки стосуються редактора, в якому і є можливість додати відео.

ВАРІАНТ 1: Використання кнопки Iframe

КРОК 1. Отримайте embed-посилання на відео

Для YouTube:

  1. Відкрийте відео на YouTube.

  2. Натисніть кнопку "Поділитися" (Share) під відео.

  3. У вікні, що відкриється, виберіть "Вбудувати" (Embed).

  4. Скопіюйте HTML-код, що починається з <iframe ...>...</iframe>.

  5. У цьому коді буде посилання вигляду

    src="https://www.youtube.com/embed/ID_відео",

    вам потрібно те що в лапках, тобто

    https://www.youtube.com/embed/ID_відео

    ⚠️ При потребі, перед копіюванням переконайтесь, що галочка "Дозволити вбудовування" (Allow embedding) активна в налаштуваннях відео. Це має бути дозволено власником відео.

Для Facebook:

  1. Відкрийте публічне відео на Facebook.

  2. Натисніть на три крапки (...) у правому верхньому куті відео або під ним.

  3. Виберіть "Embed" (Вбудувати) або "Get embed code" (Отримати код для вбудовування).

  4. Скопіюйте код <iframe ...>...</iframe> або div зі script — залежить від типу генерації.

  5. У цьому коді буде посилання вигляду

    src="http://www.facebook.com/video/embed?video_id=ID_відео",

    вам потрібно те що в лапках, тобто

    http://www.facebook.com/video/embed?video_id=ID_відео

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

КРОК 2. Вставка через кнопку Iframe

  1. В редакторі натисніть кнопку "Iframe" (зазвичай має вигляд іконки рамки або екрана).

  2. У вікні, що з’явиться:

    • В полі "URL" вставте посилання з YouTube або Facebook, яке ви отримали з тегу <iframe>.

    • Встановіть ширину (наприклад: 560) та висоту (наприклад: 315).

  3. Натисніть OK, щоб вставити відео.

ℹ️ Якщо код був складнішим (наприклад, з Facebook і містить script), тоді використовуйте варіант 2 (режим Джерело).

ВАРІАНТ 2: Використання режиму Джерело (Source)

  1. У редакторі CKEditor натисніть кнопку "Джерело" (Source) — зазвичай має вигляд </>.

  2. Вставте повний HTML-код, який ви скопіювали з YouTube або Facebook.

Наприклад:

<iframe width="560" height="315" src="https://www.youtube.com/embed/ID_відео" frameborder="0" allowfullscreen></iframe>

або для Facebook:

<div id="fb-root"></div>

<script async defer crossorigin="anonymous"

src="http://www.facebook.com/video/embed?video_id=ID_відео" nonce="abc123"></script>

<div class="fb-video"

data-href="https://www.facebook.com/facebook/videos/ID_відео/"

data-width="500" data-show-text="false">

</div>

  1. Знову натисніть "Джерело", щоб повернутись до звичайного режиму. Ви побачите місце для відео або саме відео.

ВАЖЛИВІ НАЛАШТУВАННЯ

Для YouTube:

  • Відео має бути доступним для перегляду (не приватне).

  • Увімкнена опція "Allow embedding" (Дозволити вбудовування) в налаштуваннях відео.

Для Facebook:

  • Відео має бути публічним.

  • Сайт, на який вбудовується відео, має мати підключений Facebook SDK (для деяких embed-кодів).

  • Якщо код містить <script>, переконайтесь, що ваш сайт дозволяє його виконання (не блокує CSP або плагіни безпеки).

Рекомендації

  • Завжди перевіряйте попередній перегляд перед збереженням.

  • Якщо відео не відображається — перевірте права доступу або правильність посилання.

  • Уникайте просто вставки посилання на YouTube/Facebook — воно не вбудується автоматично, потрібен саме вбудований код або iframe.

Пряме завантаження відеофайлів на платформу нажаль наразі не підтримується через обмеження щодо обсягів пам’яті.

Інші статті по темі