Виджет фильтруемой галереи Elementor - сделайте изображения фильтруемыми
Статическая галерея показывает изображения. фильтруемая галерея позволяет людям найти то, что им небезразлично. виджет "Галерея фильтруемых изображений" дает вашему портфолио, каталогу продуктов или коллекции фотографий панель категорий вверху. Посетители нажимают на вкладку, сетка фильтруется мгновенно, и каждый элемент может нести заголовок, субтитры и две стилизованные кнопки для “View Detail” или “Live Demo”.
Виджет бесплатен в плагине Master Addons и работает без Elementor Pro.
Что можно сделать с фильтруемым виджетом галереи
Фильтрация категорий с полным контролем
Включить панель фильтров и посетители видят категории кнопки над галереей: “All”, “Branding”, “Photography”, “Web Design”, какие бы метки вы ни установили.Переименовать вкладку “All”, выровнять панель влево, в центр или вправо и стилизовать активные вкладки с отдельными цветами, фоном и границами, чтобы люди всегда знали, что они выбрали.
- Назначьте каждое изображение категории с помощью поля "Фильтр метки". Запятая-разделенная для нескольких категорий.
- Стиль активного состояния выделяет выбранную вкладку среди остальных.
- Типографика и расстояние между полосами фильтра полностью настраиваются.
Макет галереи и 3D эффекты
Выберите количество столбцов, включите Masonry для шахматной сетки в стиле Pinterest и управляйте интервалом с настройками Gutter.Тогда слой на интерактивных эффектах: шкала наведения делает элементы увеличиваться при наведении курсора мыши, а эффект наклона добавляет трехмерную перспективу, которая следует за курсором с необязательным бликом. Это такая деталь, которая заставляет галерею чувствовать себя рассмотренной вместо дефолта.
- Макет каменной кладки для динамической, неравномерной высоты изображения.
- 3D-наклон с регулируемой перспективой, скоростью и интенсивностью бликов.
- Масштаб наведения с настраиваемой скоростью перехода.
- Адаптивные столбцы, которые четко укладываются на мобильные устройства.
Стилизованные текстовые наложения и двойные CTA
Каждый элемент галереи может показать название, субтитры и метку категории, каждый с независимой типографикой и цветом. при наведении цвет наложения тускнеет, и появляются две кнопки: “Details” и “Demo” (или любой текст, который вы пишете). Обе кнопки имеют полный контроль состояния Normal и Hover для фона, цвета текста, границы, радиуса и тени.
- Отдельные разделы "Стиль названия", "Стиль субтитров" и "Стиль категории".
- Две кнопки на предмет, каждая из которых стилизована независимо.
- Наведите указатель размера и цвета значка, чтобы соответствовать вашему бренду.
- Цвет наложения изображения с плавным переходом.
- Хотите больше анимации наведения на отдельные изображения? Попробуйте Эффекты наведения изображения виджет.
Фильтруемые примеры галереи и варианты использования
- Портфолио: позвольте посетителям фильтровать по типу проекта, брендингу, Интернету, фотографии, иллюстрациям.
- Каталоги продуктов: вкладки категории для “All”, “New Arrivals”, “Sale”, “Best Sellers”.
- Меню ресторана: фильтр по “Starters”, “Mains”, “Desserts”, “Drinks”.
- Списки недвижимости: “Apartments”, “Houses”, “Commercial”, “Land”.
- Свадебная фотография: “Ceremony”, “Reception”, “Portraits”, “Details”.
- Тематические исследования агентства: фильтр по отрасли клиента или типу услуги.
Как создать фильтруемую галерею в Elementor
- Бросьте виджет. В Elementor выполните поиск по “Filterable Image Gallery” в разделе "Мастер-аддоны" и перетащите его в свой раздел.
- Добавить элементы галереи. Нажмите + Добавить элемент для каждого изображения. Загрузите изображение, напишите заголовок и подзаголовок, установите метку фильтра (имя категории) и при необходимости добавьте текст кнопки и ссылки.
- Включить планку фильтра. Включите Show Filter Nav, установите количество столбцов, выберите "Масонство" или обычную сетку и отрегулируйте расстояние между желобами. Включите шкалу наведения и эффект наклона для интерактивности.
- Стиль все. На вкладке Стиль, дизайн панели фильтров, карточки предметов, текстовые наложения, кнопки, и состояния наведения. опубликовать, когда сделано.
Часто задаваемые вопросы для галереи фильтруемых изображений
Что такое виджет "Галерея фильтруемых изображений"?
Автономный виджет Elementor, который превращает любую сетку изображений в галерею, отфильтрованную по категориям Посетители нажимают на вкладки фильтра, чтобы показать только соответствующие элементы. каждый элемент может отображать заголовок, субтитры и две стилизованные кнопки вызова к действию.
Виджет "Галерея фильтруемых изображений" бесплатен?
Да. поставляется с бесплатным плагином Master Addons, поэтому вы можете построить фильтруемую галерею без лицензии Elementor Pro или Master Addons Pro. вы можете добавить столько элементов галереи, сколько вам нужно.
Как назначить элементы категориям фильтров?
В разделе Содержимое галереи для каждого элемента найдите поле Этикетка фильтра и введите название категории (“Technology”, “Branding”, “Photography”).Все элементы с одной и той же группой этикеток под одной кнопкой фильтра. запятая-отдельно для назначения элемента нескольким категориям.
Могут ли посетители открывать изображения в лайтбоксе?
Да. каждая кнопка может ссылаться на всплывающее окно лайтбокса, внешний URL-адрес или страницу на вашем сайте. установите пункт назначения ссылки для каждого элемента в разделе содержимого галереи.
Галерея отзывчива на мобильном телефоне?
Да. столбцы складываются автоматически, четыре столбца становятся двумя или одним на меньших экранах. кнопки фильтра обертываются по размеру. используйте адаптивный режим Elementor, чтобы настроить размеры желоба и шрифта специально для мобильных устройств.
Чем это отличается от обычной Image Carousel или Gallery Slider?
Карусель или ползунок показывает одно изображение за раз и циклически проходит через них. фильтруемая галерея показывает все сразу и позволяет посетителям сузить сетку по категориям. Используйте Изображение Карусель для разделов героев и рядов логотипов, или Галерея Слайдер (Pro) когда вам нужно одно большое изображение с миниатюрами Используйте фильтруемую галерею для портфолио, каталогов и коллекций, где просмотр имеет значение.
Виджеты и расширения трендовых элементов
Создавайте сложные веб-сайты за меньшее время.
Стекломорфизм
Дополнительные контейнеры
Шаблоны
Дубликатор сообщений/страниц
