Скидка 50% до 1 января 2025

Виджет Video Gallery

Виджет видео галереи позволяет демонстрировать видео YouTube, Vimeo и Wistia с помощью инновационной техники оптимизации. С помощью этого виджета, вы можете добавить на страницу несколько видео, не жертвуя скоростью страницы.


Ниже приведены ключевые моменты виджета видео галереи:


  • Оптимизация времени загрузки
  • Фильтруемая видео галерея
  • Макет сетки/карусели
  • Простая сортировка и заказ видео
  • Различные стили кнопки воспроизведения
  • Возможность воспроизведения видео в лайтбоксе или встроенном режиме
  • Пользовательские миниатюры и эффекты наложения миниатюр
  • Возможность добавлять и стилизовать подпись к видео

Прежде чем начать, обязательно включите виджет в настройках Ultimate Addons for Elementor.


Чтобы добавить видео в галерею, выберите «Тип видео» и введите действительный URL-адрес. Ниже приведен пример действительных и недействительных URL-адресов.


Для видео на YouTube

Действительная ссылка : https://www.youtube.com/watch?v=aqz-KE-bpKQ&t=3s

Недействительная ссылка : https://youtu.be/aqz-KE-bpKQ


Для видео Vimeo

Действительная ссылка : https://vimeo.com/274860274

Недействительная ссылка : https://vimeo.com/channels/staffpicks/274860274


Для Wistia Video

Чтобы получить ссылку на видео Wistia, вам нужно будет перейти к своему видео Wistia, щелкнуть по нему правой кнопкой мыши и выбрать последний вариант « Копировать ссылку и миниатюру ». Теперь скопируйте то же самое и вставьте в поле «Ссылка и миниатюра».

Примечание. Если вы меняете миниатюру или ссылку из соответствующего видео Wistia, обязательно вставьте текст ссылки и миниатюры в это поле еще раз.


Оптимизация времени загрузки

Этот виджет использует ту же технику оптимизации, что и видео-виджет . Виджет встраивает миниатюру видео YouTube/Vimeo вместо самого видео. Посмотрите, как работает эта техника?


Фильтруемая видео галерея

Эта функция позволяет классифицировать видео. Он отображает все категории видео с фильтруемыми вкладками. При нажатии на вкладку отобразится видео, отнесенное к соответствующей категории. Видео будут отображаться с анимацией перетасовки по умолчанию. Прочтите , как создать фильтруемую видеогалерею ? Вы можете отображать определенную вкладку категории по умолчанию при загрузке страницы .


Вы можете добавить заголовок для фильтруемой вкладки. Здесь будет описано больше о фильтруемых вкладках и видеогалерее.

Включите параметр «Заголовок для фильтруемой вкладки» и введите заголовок. Вы можете настроить заголовок в разделе «Стиль» (вкладка) > «Заголовок».

Макет сетки/карусели

Отобразите все видео на странице с помощью сетки или отобразите их в красивом слайдере с помощью карусели. Выберите лучший макет, чтобы ваша галерея выглядела потрясающе.

Простая сортировка и заказ видео

После добавления видео в список вы можете изменить их порядок простым перетаскиванием. Видео можно сортировать по категориям с помощью опции «Фильтрируемая видеогалерея».

Различные стили кнопки воспроизведения

Эту настройку можно найти в разделе «Стиль» (вкладка) > «Кнопка воспроизведения».


Кнопку воспроизведения можно установить как изображение или значок.


Для изображения


  • Выберите подходящее изображение из Медиа-библиотеки.
  • Опция «Анимация при наведении» придает кнопке воспроизведения интересный вид.

Для значка


  • Выберите значок из раскрывающегося списка
  • Вы можете установить обычный цвет и цвет при наведении, а также тень текста для значка.
  • Опция «Анимация при наведении» доступна на вкладке «Наведение».

Возможность воспроизведения видео в лайтбоксе или встроенном режиме

Встроенный вариант будет воспроизводить видео в самом макете видео. В то время как опция лайтбокса будет воспроизводить видео в красивом всплывающем окне.

Пользовательский значок для видео

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


Эту настройку можно найти в разделе «Галерея» > «Редактировать видео» > «Пользовательский значок».


Включите параметр «Пользовательский эскиз» и установите изображение .

Возможность добавлять и стилизовать подпись к видео

Подпись добавит краткое описание видео. Вы можете отобразить их при наведении видео.

Шаг 10. Затем откройте другую вкладку и войдите в свою учетную запись Instagram. Перейдите в «Профиль» > «Редактировать профиль» > «Приложения и веб-сайты» > «Приглашения тестировщика» и примите приглашение.

Вариант самостоятельного размещения видео

Это позволит вам отображать видео прямо из вашей медиатеки или внешних источников всего за несколько кликов.


Ключевая особенность:


Недавно добавленная опция для типа видео, размещаемого на собственном хостинге:


Внешний URL-адрес: вставьте внешний URL-адрес видео.

Выберите файл: если у видео нет ссылки на внешнее видео, вы можете выбрать существующий видеофайл из медиатеки.

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

Вам просто нужно будет выбрать тип видео как «Самостоятельное размещение» из предыдущих вариантов типа видео, таких как Wistia, YouTube, Vimeo.


Кроме того, у вас есть возможность установить заголовок для видео, отобразить миниатюру, а также добавить категории к этому типу видео.

Поддержка схемы

Чтобы активировать эту опцию, вам необходимо отредактировать виджет Видеогалерея:


Шаг 1. Нажмите вкладку «Содержимое» и разверните раздел «Галерея» ;

Шаг 2. Включите опцию « Поддержка схемы ».


Добавить схему к видео

Теперь вы можете добавить схему к своим видео:


Шаг 1. Начните редактировать свою страницу или публикацию с помощью Elementor и добавьте виджет «Видео галерея» (перетащите);


Шаг 2. Затем нажмите на существующие видео, чтобы отредактировать их, или добавьте новое. Здесь, в верхней части области редактирования видео, вы увидите вкладки. Нажмите на вкладку «Схема» ;

Шаг 3. Теперь добавьте схему к вашему видео. Вам необходимо добавить заголовок , описание , миниатюру, а также дату и время загрузки . Имейте в виду, что все эти поля являются обязательными . Если какое-либо поле в разделе схемы оставить пустым, схема не будет создана;


Шаг 4. Вы можете повторить шаги 2 и 3 для любого видео в галерее. Закончив, сохраните изменения (кнопка «Опубликовать/Обновить»).


Миниатюра

Важно отметить, что миниатюры для ваших видео можно добавить также через вкладку «Общие» . Эта опция используется для добавления миниатюры к вашему видео в целом. Напротив, миниатюра схемы используется только в качестве данных схемы.


При редактировании видео на вкладке «Общие» вы можете найти опцию « Пользовательский значок ».

Вы можете включить опцию « Пользовательская миниатюра » и добавить миниатюру для видео. В этом случае пользовательская миниатюра также будет использоваться в качестве миниатюры видео для схемы.


Другими словами, пользовательская миниатюра, если она добавлена, заменит миниатюру схемы. Кроме того, если включен параметр «Пользовательский эскиз», но изображение не добавлено, схема не будет создана.


Тестирование схемы видео галереи

Кроме того, вы можете протестировать схему, которую вы добавили в свою видео галерею. Таким образом, вы можете использовать тест расширенных результатов Google и инструмент проверки разметки схемы .


Вы можете получить доступ к любому из вышеупомянутых инструментов. Оказавшись там, вам нужно добавить URL-адрес или исходный код страницы или публикации, куда вы добавили виджет и схему «Видео галерея». Для иллюстрации мы протестируем демонстрационную видео галерею с помощью инструмента RichResults:


Шаг 1. Посетите тестовый сайт с расширенными результатами;


Шаг 2. Сначала вам нужно выбрать, как вы хотите протестировать свою страницу. Вы можете выбрать метод URL-адреса и добавить URL-адрес своей страницы:

Альтернативно вы можете протестировать его с помощью кода:

Следующие шаги практически идентичны. Таким образом, в нашем примере мы решили протестировать нашу страницу с помощью URL-адреса. Нажмите «Тестировать код», чтобы начать тестирование;


Шаг 3. Как только анализ будет готов, вы увидите отчет обо всех обнаруженных элементах, содержащих схему (т. е. структурированные данные). Поскольку мы хотим проверить схему видео галереи, мы щелкнем раздел «Видео»;

Шаг 4. Затем просмотрите список файлов и нажмите на любое из ваших видео.

Это покажет вам схему, которую вы добавили с помощью поддержки схемы Ultimate Addons for Elementor.

Автор

Поделиться

Комментарии

Один ответ на “Виджет Video Gallery”

Розалия Баязитова

Спасибо за просмотр! Оставляйте свои комментарии и вопросы!

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

Ваш электронный адрес не будет опубликован. Обязательные поля отмечены *

' skin='skin1'}}

Найдите свой шаблон для сайта среди 300+ вариантов

Generic selectors
Exact matches only
Search in title
Search in content
Post Type Selectors

Все шаблонные сайты

Найдите свой шаблон для сайта среди 300+ вариантов

Generic selectors
Exact matches only
Search in title
Search in content
Post Type Selectors