Как вывести видео в галерею вместе с изображениями — php?

PHP Видео Изображения

1 ответ

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

Есть php-код, который отображает только изображения. Как его изменить и что надо добавить?

&lt;?php  $project_gallery = get_field( "slajder" ); ?&gt;        &lt;div class="row"&gt;         &lt;?php if( $project_gallery ): ?&gt;           &lt;div class="col-xl-8 col-lg-7 col-12"&gt;             &lt;div class="project-slider"&gt;               &lt;div class="project-slider__content" id="project-slider"&gt;                 &lt;?php foreach( $project_gallery as $image ): ?&gt;                   &lt;div class="project-slider__slide"&gt;                     &lt;img src="&lt;?php echo $image['url']; ?&gt;" alt="&lt;?php echo $image['alt']; ?&gt;" class="project-slider__image"&gt;                     &lt;video controls="" autoplay="" name="media" src="&lt;?php echo $video['url']; ?&gt;" type="video/mp4" class="project-slider__image"&gt;&lt;/video&gt; //надо, что бы вот это выводилось вместе с изображениями                   &lt;/div&gt;                 &lt;?php endforeach; ?&gt;               &lt;/div&gt;

<?php $project_gallery = get_field( "slajder" ); ?> <div class="row"> <?php if( $project_gallery ): ?> <div class="col-xl-8 col-lg-7 col-12"> <div class="project-slider"> <div class="project-slider__content" id="project-slider"> <?php foreach( $project_gallery as $image ): ?> <div class="project-slider__slide"> <img src="<?php echo $image['url']; ?>" alt="<?php echo $image['alt']; ?>" class="project-slider__image"> <video controls="" autoplay="" name="media" src="<?php echo $video['url']; ?>" type="video/mp4" class="project-slider__image"></video> //надо, что бы вот это выводилось вместе с изображениями </div> <?php endforeach; ?> </div>

Дополнительно:

Извините, наверное я не правильно объясняю. Изначально код без этой строчки

&lt;video controls="" autoplay="" name="media" src="&lt;?php echo $video['url']; ?&gt;" type="video/mp4" class="project-slider__image"&gt;&lt;/video&gt;

<video controls="" autoplay="" name="media" src="<?php echo $video['url']; ?>" type="video/mp4" class="project-slider__image"></video>

. Если я в админке в галерею добавляю видео, то к нему подставляется тег <img> и соответственно видео не отображается на сайте. Надо, что бы к видео подставлялся тег <video>. Надеюсь, что теперь понятно объяснил.

В цикле foreach( $project_gallery as $image ) переменная $video откуда возникает?

&lt;?php  $project_gallery = get_field( "slajder" ); ?&gt;  &lt;div class="row"&gt;   &lt;?php if( $project_gallery ): ?&gt;     &lt;div class="col-xl-8 col-lg-7 col-12"&gt;       &lt;div class="project-slider"&gt;         &lt;div class="project-slider__content" id="project-slider"&gt;           &lt;?php foreach( $project_gallery as $media ): ?&gt;             &lt;div class="project-slider__slide"&gt;               &lt;?php if( $media['mime_type'] === 'image/jpeg' || $media['mime_type'] === 'image/png' ): ?&gt;                 &lt;img src="&lt;?php echo $media['url']; ?&gt;" alt="&lt;?php echo $media['alt']; ?&gt;" class="project-slider__image"&gt;               &lt;?php elseif( $media['mime_type'] === 'video/mp4' ): ?&gt;                 &lt;video controls="" autoplay="" name="media" src="&lt;?php echo $media['url']; ?&gt;" type="video/mp4" class="project-slider__image"&gt;&lt;/video&gt;               &lt;?php endif; ?&gt;             &lt;/div&gt;           &lt;?php endforeach; ?&gt;         &lt;/div&gt;       &lt;/div&gt;     &lt;/div&gt;   &lt;?php endif; ?&gt; &lt;/div&gt;

<?php $project_gallery = get_field( "slajder" ); ?> <div class="row"> <?php if( $project_gallery ): ?> <div class="col-xl-8 col-lg-7 col-12"> <div class="project-slider"> <div class="project-slider__content" id="project-slider"> <?php foreach( $project_gallery as $media ): ?> <div class="project-slider__slide"> <?php if( $media['mime_type'] === 'image/jpeg' || $media['mime_type'] === 'image/png' ): ?> <img src="<?php echo $media['url']; ?>" alt="<?php echo $media['alt']; ?>" class="project-slider__image"> <?php elseif( $media['mime_type'] === 'video/mp4' ): ?> <video controls="" autoplay="" name="media" src="<?php echo $media['url']; ?>" type="video/mp4" class="project-slider__image"></video> <?php endif; ?> </div> <?php endforeach; ?> </div> </div> </div> <?php endif; ?> </div>

Спасибо за ответ! Не сразу заметил.

Нашел ответ. Если кому-нибудь понадобиться, вот рабочее решение!

Нужно заменить $image на $item, чтобы было более релевантно. Просто проверяйте $item['type'] тип файла, в случае с картинкой будет 'image', в случае с видео, будет 'video'соответственно.

&lt;?php $project_gallery = get_field('slajder'); ?&gt; &lt;div class="row"&gt;     &lt;?php if ($project_gallery): ?&gt;         &lt;div class="col-xl-8 col-lg-7 col-12"&gt;             &lt;div class="project-slider"&gt;                 &lt;div class="project-slider__content" id="project-slider"&gt;                     &lt;?php foreach($project_gallery as $item) : ?&gt;                         &lt;div class="project-slider__slide"&gt;                             &lt;?php if ($item['type'] === 'image') : ?&gt;                                 &lt;img src="&lt;?php echo esc_url($item['url']); ?&gt;" alt="&lt;?php echo esc_attr($item['alt']); ?&gt;" class="project-slider__image"&gt;                             &lt;?php elseif ($item['type'] === 'video') : ?&gt;                                 &lt;video controls="" autoplay="" name="media" src="&lt;?php echo esc_url($item['url']); ?&gt;" type="video/mp4" class="project-slider__image"&gt;&lt;/video&gt;                             &lt;?php endif; ?&gt;                         &lt;/div&gt;                     &lt;?php endforeach; ?&gt;                 &lt;/div&gt;             &lt;/div&gt;         &lt;/div&gt;     &lt;?php endif; ?&gt; &lt;/div&gt;

<?php $project_gallery = get_field('slajder'); ?> <div class="row"> <?php if ($project_gallery): ?> <div class="col-xl-8 col-lg-7 col-12"> <div class="project-slider"> <div class="project-slider__content" id="project-slider"> <?php foreach($project_gallery as $item) : ?> <div class="project-slider__slide"> <?php if ($item['type'] === 'image') : ?> <img src="<?php echo esc_url($item['url']); ?>" alt="<?php echo esc_attr($item['alt']); ?>" class="project-slider__image"> <?php elseif ($item['type'] === 'video') : ?> <video controls="" autoplay="" name="media" src="<?php echo esc_url($item['url']); ?>" type="video/mp4" class="project-slider__image"></video> <?php endif; ?> </div> <?php endforeach; ?> </div> </div> </div> <?php endif; ?> </div>

Нужно решить такую задачу?

Опишите проблему, и специалист поможет с настройкой, исправлением ошибки или доработкой сайта. Подберём понятный план работ без лишней переписки.

Заказать помощь

Лучший ответ

Роман IT Ответ

Видео можно выводить в одной галерее с изображениями, но нужно разделить два типа элементов: картинки открывать как изображения, а видео — как iframe или HTML5 video. Если у вас сейчас галерея ожидает только attachment ID картинок, видео туда само не попадёт.

Один из рабочих вариантов — хранить массив элементов, где у каждого есть тип:

$items = [
    ['type' =&gt; 'image', 'id' =&gt; 123],
    ['type' =&gt; 'video', 'url' =&gt; 'https://www.youtube.com/watch?v=xxxx'],
];

$items = [ ['type' => 'image', 'id' => 123], ['type' => 'video', 'url' => 'https://www.youtube.com/watch?v=xxxx'], ];

Вывод:

foreach ($items as $item) {
    if ($item['type'] === 'image') {
        $thumb = wp_get_attachment_image($item['id'], 'medium');
        $full = wp_get_attachment_image_url($item['id'], 'large');
        echo '&lt;a href="' . esc_url($full) . '" class="gallery-item"&gt;' . $thumb . '&lt;/a&gt;';
    }
 
    if ($item['type'] === 'video') {
        echo '&lt;a href="' . esc_url($item['url']) . '" class="gallery-item gallery-video"&gt;';
        echo '&lt;span&gt;Видео&lt;/span&gt;';
        echo '&lt;/a&gt;';
    }
}

foreach ($items as $item) { if ($item['type'] === 'image') { $thumb = wp_get_attachment_image($item['id'], 'medium'); $full = wp_get_attachment_image_url($item['id'], 'large'); echo '<a href="' . esc_url($full) . '" class="gallery-item">' . $thumb . '</a>'; } if ($item['type'] === 'video') { echo '<a href="' . esc_url($item['url']) . '" class="gallery-item gallery-video">'; echo '<span>Видео</span>'; echo '</a>'; } }

Если видео загружены в медиатеку, проверяйте mime type:

$mime = get_post_mime_type($attachment_id);
if (str_starts_with($mime, 'video/')) {
    echo wp_video_shortcode(['src' =&gt; wp_get_attachment_url($attachment_id)]);
}

$mime = get_post_mime_type($attachment_id); if (str_starts_with($mime, 'video/')) { echo wp_video_shortcode(['src' => wp_get_attachment_url($attachment_id)]); }

Для lightbox выбирайте библиотеку, которая умеет и изображения, и iframe/video. Иначе картинки будут работать, а видео будет просто открываться ссылкой.

Другие ответы (0)

Пока нет других ответов. Будьте первым, кто поможет автору.

Ответить на вопрос

комментарий Отменить ответ

Вам также может быть интересно

VPN Как правильно настроить vless для Android TV? 0 ответов Pyrogram Как правильно зарегистрировать юзер бота в Telegram? 0 ответов печатные-платы Как заставить запускаться программу M3.exe от компании Hanxing AOI в инспекционной машине на Windows 7 Pro? 0 ответов Аккумуляторные батареи Почему при зарядке автостарта слышен писк, где искать причину? 0 ответов

Как вывести видео в галерею вместе с изображениями — php?

Дополнительно:

комментарий Отменить ответ

Вам также может быть интересно

Ежедневно, круглосуточно