Как добавить видео в подпись на пост в WordPress

Иногда для улучшения визуального восприятия постов или для дополнительного привлечения внимания к важной информации в конце статьи полезно добавить видео непосредственно в подпись (футер) каждого поста. В этой статье мы подробно разберём, как добавить видео в подпись на пост в WordPress, используя как плагины, так и собственный код.

Почему полезно добавить видео в подпись поста

Видео в подписи помогает:

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

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

Добавление видео в подпись с помощью плагина OmniVideo

Почему OmniVideo?

Плагин OmniVideo (https://wpshop.ru/plugins/omnivideo/?utm_source=wpvideo.ru&utm_medium=article&utm_campaign=kak-dobavit-video-v-podpis-na-post-v-wordpress) отлично подходит для встраивания видео из разных источников. Он поддерживает YouTube, Vimeo, а также локальные файлы, имеет гибкие настройки и хорошо оптимизирован.

Пошаговая инструкция

1. Установите и активируйте плагин OmniVideo.
2. Создайте видео из нужного источника через настройки плагина.
3. Скопируйте шорткод созданного видео.
4. Добавьте в файл темы functions.php следующий код для автоматического добавления видео в подпись каждого поста:

function wpvideo_add_video_signature($content) {
    if (is_single() && in_the_loop() && is_main_query()) {
        $video_shortcode = '[omnivideo id="123"]'; // замените 123 на ваш ID видео
        $content .= '<div class="wpvideo-post-signature-video">' . do_shortcode($video_shortcode) . '</div>';
    }
    return $content;
}
add_filter('the_content', 'wpvideo_add_video_signature');

Этот код добавит видео после основного содержимого поста. Замените ID видео на ваш собственный.

Добавление видео в подпись с помощью собственного кода и HTML5 видео

Когда использовать собственный код

Если вы хотите максимально контролировать параметры видео или не использовать сторонние плагины, можно встроить HTML5 видео с локальными файлами или ссылками на внешние источники.

Пример кода для functions.php

function wpvideo_add_html5_video_signature($content) {
    if (is_single() && in_the_loop() && is_main_query()) {
        $video_html = '<video width="320" height="240" controls preload="metadata" muted playsinline>'
            . '<source src="' . esc_url(get_template_directory_uri() . '/videos/sample-video.mp4') . '" type="video/mp4">'
            . 'Ваш браузер не поддерживает видео тег.'
            . '</video>';
        $content .= '<div class="wpvideo-post-signature-video">' . $video_html . '</div>';
    }
    return $content;
}
add_filter('the_content', 'wpvideo_add_html5_video_signature');

Здесь мы добавляем видео из папки темы /videos/sample-video.mp4. Не забудьте загрузить видео в эту директорию через FTP или медиа-библиотеку.

Советы по оптимизации

• Используйте видео сжатого формата (MP4 с H.264) для лучшей совместимости.
• Добавляйте атрибуты preload="metadata" и muted, чтобы видео не мешало загрузке страницы и автоматически включалось при необходимости.
• Используйте CSS для адаптивного отображения видео в подписи.

Стилизация видео в подписи с помощью CSS

Добавим базовый CSS для корректного отображения видео в подписи. Пример можно добавить в style.css вашей темы или в кастомные стили:

.wpvideo-post-signature-video {
    margin-top: 20px;
    text-align: center;
}
.wpvideo-post-signature-video video {
    max-width: 100%;
    height: auto;
    border-radius: 8px;
    box-shadow: 0 2px 8px rgba(0,0,0,0.15);
}

Это обеспечит аккуратный и адаптивный вид видео под любым разрешением экрана.

Использование плагина My Popup для показа видео в подписи

Если вам нужно не просто встроить видео в подпись, а сделать его всплывающим при клике, подойдет плагин My Popup (https://wpshop.ru/plugins/my-popup/?utm_source=wpvideo.ru&utm_medium=article&utm_campaign=kak-dobavit-video-v-podpis-na-post-v-wordpress).

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

Пример кода для вставки кнопки в подпись поста

function wpvideo_add_popup_video_button($content) {
    if (is_single() && in_the_loop() && is_main_query()) {
        $button = '<button class="wpvideo-popup-btn" data-popup-id="video-popup">Смотреть видео</button>';
        $popup = '<div id="video-popup" style="display:none;">'
            . '<iframe width="560" height="315" src="https://www.youtube.com/embed/VIDEO_ID" frameborder="0" allowfullscreen></iframe>'
            . '</div>';
        $content .= '<div class="wpvideo-post-signature-video">' . $button . $popup . '</div>';
    }
    return $content;
}
add_filter('the_content', 'wpvideo_add_popup_video_button');

Замените VIDEO_ID на ID вашего YouTube видео. Настройте плагин My Popup для открытия блока с ID video-popup.