Недавно пользователь спросил нас, как создать видео галерею в WordPress. WordPress позволяет легко вставлять видео в сообщения блога, но не позволяет создавать видеогалереи из коробки. В этой статье мы покажем вам, как легко создать видео галерею в WordPress.
^
Когда и зачем создавать видео галерею в WordPress
WordPress позволяет легко вставлять видео в сообщения блога, просто вводя URL-адреса видео. Он также может отображать размещенные видео на вашем собственном сайте.
Тем не менее, вы никогда не должны загружать видео в WordPress. Видеоролики – это большие файлы, и их непосредственная доставка может вызвать проблемы с вашим хостингом WordPress.
Вы можете легко добавить одно видео в свои сообщения, но что, если вы хотите показать несколько видео на странице?
Один из способов сделать это – добавить одно видео за другим. Хотя он работает, он создает неприятный пользовательский опыт, поскольку требует много прокрутки.
Разве не было бы лучше, если бы вы могли создать видео галерею с миниатюрами, как фотогалерея? Это позволит вам показывать больше видео в меньшем пространстве, используя красивую мобильную сетку.
Давайте посмотрим, как легко создать видео галерею в WordPress.
Способ 1: создать видео галерею в WordPress с Envira Gallery
Для этого метода мы будем использовать плагин Envira Gallery. Это лучший плагин для галереи WordPress на рынке. Он также имеет видео-аддон, который позволяет вам создавать красивые мобильные видео-галереи в WordPress.
Envira Gallery – платный плагин, и вам понадобится хотя бы их профессиональный план для доступа к видео дополнению.
Пользователи WPTec могут использовать этот купон Envira Gallery, чтобы получить скидку 25%.
Первое, что вам нужно сделать, это установить и активировать плагин Envira Gallery. Для получения более подробной информации, смотрите наше пошаговое руководство по установке плагина WordPress.
После активации необходимо зайти на страницу «Галерея Envira» и добавить свой лицензионный ключ. Вы можете найти эту информацию в своем аккаунте на сайте галереи Envira.
^
Затем вам нужно перейти на страницу Envira Gallery »Addons. Вы увидите все доступные для установки дополнения. Ищите аддон Видео и установите его.
^
Envira Gallery теперь загрузит и установит дополнение для видео. После этого вам нужно нажать «Активировать», чтобы начать использовать его на своем веб-сайте.
^
Теперь вы готовы создать свою первую видео галерею.
Перейдите в галерею Envira »Добавить новую страницу, чтобы создать свою галерею. Во-первых, вам нужно предоставить название для вашей галереи.
^
Envira Gallery может создавать видеогалерею видео для собственного размещения, а также видео, размещенных на YouTube, Vimeo и Wistia. Мы рекомендуем использовать сторонние услуги видеохостинга для лучшего взаимодействия с пользователем.
Во-первых, вам нужно загрузить видео на YouTube или Vimeo. После этого нажмите кнопку «Выбрать видео из других источников», чтобы продолжить.
Появится всплывающее окно «Вставка мультимедиа», в котором необходимо щелкнуть ссылку «Вставить видео» в левом столбце.
^
Вам нужно нажать на кнопку «Добавить видео», чтобы ввести название и URL видео.
Чтобы добавить другие видео, нажмите кнопку «Добавить видео» еще раз. Не стесняйтесь добавлять столько видео, сколько вам нужно.
После добавления всех видео, которые вы хотите показать в галерее, нажмите кнопку «Вставить в галерею», чтобы продолжить.
Envira теперь получит эскизы для ваших видео и покажет их в разделе изображений.
Вы можете редактировать видео в любое время, нажав на значок «карандаш» или удалить любое видео. Вы также можете добавить больше видео, если это необходимо.
Ваша видео галерея почти готова. Давайте настроим настройки видеогалереи.
Начните с нажатия на вкладку «Конфигурация» в левом столбце, а в разделе «Количество столбцов галереи» выберите макет с двумя или тремя столбцами.
Это гарантирует, что миниатюры вашего видео выглядят красиво с достаточным пространством между каждым видео.
^
Теперь давайте добавим кнопку воспроизведения к миниатюрам вашего видео.
Перейдите на вкладку «Видео» и установите флажок рядом с «Показать значок воспроизведения поверх изображения галереи».
^
Ваша видео галерея готова. Идите дальше и нажмите кнопку публикации, чтобы сделать вашу видео галерею доступной для WordPress.
Показать видео галерею на вашем сайте
Envira Gallery позволяет легко отображать вашу видео галерею в любом сообщении или странице WordPress. Вы также можете отобразить галерею на боковой панели.
Давайте создадим новую страницу в WordPress и дадим ей соответствующий заголовок, например: «Видео».
Затем нажмите кнопку «Добавить галерею» в верхней части редактора сообщений.
^
Появится всплывающее окно, где вы увидите свою видео галерею. Нажмите, чтобы выбрать его, а затем нажмите кнопку Вставить.
^
Шорткод Envira Gallery теперь появится в вашем редакторе сообщений.
Теперь вы можете обновить или опубликовать свою страницу и посетить страницу, чтобы увидеть свою видео галерею в действии.
^
Самое приятное, что нажатие на элемент видео откроет его во всплывающем окне лайтбокса в режиме театра. Это обеспечивает гораздо лучший опыт просмотра для ваших пользователей.
Они смогут просматривать видео, не покидая ваш веб-сайт, а также просматривать другие видео в галерее, нажимая на миниатюры под проигрывателем.
^
Способ 2. Создание видео галереи в WordPress с помощью галереи каналов YouTube
Этот метод требует API-ключа YouTube для работы, что делает процесс немного длиннее. Не волнуйтесь, мы проведем вас через это.
Первое, что вам нужно сделать, это установить и активировать плагин YouTube Channel Gallery. Для получения более подробной информации, смотрите наше пошаговое руководство по установке плагина WordPress.
Затем вам нужно перейти на веб-сайт консоли разработчика Google, чтобы сгенерировать ключ API YouTube.
Нажмите кнопку «Выбрать проект» в верхнем левом углу экрана, а затем нажмите кнопку добавления.
^
На следующем экране вам нужно указать название вашего проекта и согласиться с условиями обслуживания. После этого нажмите кнопку «Создать», чтобы продолжить.
^
Далее вам нужно нажать на библиотеку API и затем выбрать ссылку API данных YouTube.
^
Это приведет вас на страницу сведений об API, где вам нужно нажать на ссылку Включить, чтобы включить этот API для вашего проекта.
^
Консоль разработчика теперь включает API для вашего проекта. Вам все еще нужно создать учетные данные, чтобы получить ключ API.
Нажмите кнопку «Создать учетные данные», чтобы продолжить.
^
Теперь вам нужно ввести, как вы будете использовать ключ API. Для параметра «Откуда вы будете вызывать API?» Выберите «Веб-браузер (JavaScript)» и выберите «Публичные данные» в разделе «К каким данным вы будете обращаться?».
^
Нажмите кнопку «Какие учетные данные мне нужны», чтобы продолжить.
Консоль разработчика теперь покажет ваш ключ API. Вам необходимо скопировать и вставить этот ключ API в простой текстовый файл. Это понадобится вам позже для создания видео галерей.
Остался еще один последний шаг – ограничить использование ключа API только на вашем веб-сайте. Для этого нажмите ссылку Ограничить ключ, отображаемую на экране ключа API.
^
На странице ограничений выберите опцию HTTP Referrers и введите ниже свое доменное имя в следующем формате:
* .yourdomain.com
^
Не забудьте нажать кнопку «Сохранить», чтобы сохранить изменения,
Теперь, когда у вас есть ключ API данных YouTube, пришло время создать вашу видеогалерею.
Плагин YouTube Channel Gallery поставляется с мощным шорткодом, который вы можете добавить к своим сообщениям и страницам для отображения своей видео галереи.
Просто создайте новую страницу или отредактируйте существующую и добавьте следующий шорткод в редакторе сообщений.
[Youtube_Channel_Gallery user = “wpbeginner” maxitems = “8” thumb_columns_phones = “2” thumb_columns_tablets = “4” key = “your-youtube-api-key-go-here”]
Не забудьте заменить пользователя своим именем пользователя YouTube, а ключ – ключом API YouTube, который вы создали ранее.
Теперь вы можете сохранить свой пост / страницу и посетить свой веб-сайт, чтобы увидеть свою видео-галерею в действии.
^
Плагин не имеет всплывающего окна лайтбокса, и ваши видео будут воспроизводиться на странице. При нажатии на миниатюру видео в галерее видео будет воспроизводиться в топовом плеере.
Для получения более подробной информации, пожалуйста, смотрите наш учебник о том, как показывать последние видео с вашего канала YouTube в WordPress.
Это все на данный момент.
Мы надеемся, что эта статья помогла вам научиться создавать видеогалерею в WordPress. Возможно, вы также захотите ознакомиться с нашим пошаговым руководством о том, как повысить скорость и производительность WordPress.