Виджет фильтруемой галереи Elementor - сделайте изображения фильтруемыми
Статическая галерея показывает изображения. фильтруемая галерея позволяет людям найти то, что им небезразлично. виджет "Галерея фильтруемых изображений" дает вашему портфолио, каталогу продуктов или коллекции фотографий панель категорий вверху. Посетители нажимают на вкладку, сетка фильтруется мгновенно, и каждый элемент может нести заголовок, субтитры и две стилизованные кнопки для “View Detail” или “Live Demo”.
Виджет бесплатен в плагине Master Addons и работает без Elementor Pro.
Смотрите вкладки фильтра в действии
Эта сетка - сам виджет, а не скриншот Четыре категории и вкладка "Все" расположены над ним, а щелчок по категории скрывает каждый элемент, на котором нет этой метки. Каждая карта здесь также показывает заголовок и субтитры, взятые из своих полей.
- Все объявления
- Апартаменты
- Виллы
- Таунхаусы
- Офисы
Лофт на Коув-стрит
2-спальная кровать · 1 ванна · 940 кв. футов — 2450 долларов США/млн долларов США
Марина Пойнт 8Б
1 кровать · 1 ванна · 680 кв. футов — 1890 долларов США/млн долларов США
Риджуэй Вилла
4-спальная кровать · 3 ванна · бассейн 1,24 миллиона долларов
Теплица на Вязе
3-спальная кровать · 2 ванна · 2100 кв. футов — 980 000 долларов США
Бриклейн Роу 12
3-спальная кровать · 2 ванна · гараж ♪ 720,000 долларов
Ольховый суд 4
2 кровати · 2 ванны · обнесенный стеной сад ♪ 645 000 долларов
Гавань работает, этаж 3
4200 кв. футов 38 столов · 6400 долларов США в месяц
Набережная Студия
1800 кв. футов 16 столов · 2950 долларов США в месяцЧто можно сделать с фильтруемым виджетом галереи
Фильтрация категорий с полным контролем
Включить панель фильтров и посетители видят категории кнопки над галереей: “All”, “Branding”, “Photography”, “Web Design”, какие бы метки вы ни установили.Переименовать вкладку “All”, выровнять панель влево, в центр или вправо и стилизовать активные вкладки с отдельными цветами, фоном и границами, чтобы люди всегда знали, что они выбрали.
- Назначьте каждое изображение категории с помощью поля "Фильтр метки". Запятая-разделенная для нескольких категорий.
- Стиль активного состояния выделяет выбранную вкладку среди остальных.
- Типографика и расстояние между полосами фильтра полностью настраиваются.
Макет галереи и 3D эффекты
Выберите количество столбцов, включите Masonry для шахматной сетки в стиле Pinterest и управляйте интервалом с настройками Gutter.Тогда слой на интерактивных эффектах: шкала наведения делает элементы увеличиваться при наведении курсора мыши, а эффект наклона добавляет трехмерную перспективу, которая следует за курсором с необязательным бликом. Это такая деталь, которая заставляет галерею чувствовать себя рассмотренной вместо дефолта.
- Макет каменной кладки для динамической, неравномерной высоты изображения.
- 3D-наклон с регулируемой перспективой, скоростью и интенсивностью бликов.
- Масштаб наведения с настраиваемой скоростью перехода.
- Адаптивные столбцы, которые четко укладываются на мобильные устройства.
Стилизованные текстовые наложения и двойные CTA
Каждый элемент галереи может показать название, субтитры и метку категории, каждый с независимой типографикой и цветом. при наведении цвет наложения тускнеет, и появляются две кнопки: “Details” и “Demo” (или любой текст, который вы пишете). Обе кнопки имеют полный контроль состояния Normal и Hover для фона, цвета текста, границы, радиуса и тени.
- Отдельные разделы "Стиль названия", "Стиль субтитров" и "Стиль категории".
- Две кнопки на предмет, каждая из которых стилизована независимо.
- Наведите указатель размера и цвета значка, чтобы соответствовать вашему бренду.
- Цвет наложения изображения с плавным переходом.
- Хотите больше анимации наведения на отдельные изображения? Попробуйте Эффекты наведения изображения виджет.
Создайте фильтруемый портфель в Elementor
Виджет собственного Портфолио Элементора нуждается в Pro. Эта сетка работает на Главных Аддонах, поэтому панель фильтров работает на бесплатной установке Элементор. каждый элемент несет название проекта, субтитры для категории или года, и два поля кнопок, что является как карта портфолио может указать на живой сайт и тематическое исследование одновременно. кнопки ниже перейти на демо-страницу.
- Все проекты
- Жилой
- Гостеприимство
- Розничная торговля
- Рабочее место
Эшгроув Хаус
Частная резиденция · Мельбурн · 2025
Апартаменты «Стирка извести»
Полный ремонт · Лиссабон · 2025
Фенвик Отель
Лобби и гостиная · Эдинбург · 2024
Гостевой дом Келлнер
32 номера · Вена · 2024
Флагманская студия "Девять"
Розничная отделка · Копенгаген · 2025
Марлоу и Фолд
Концептуальный магазин · Торонто · 2023
Штаб-квартира Beacon Labs
1400 кв м рабочее место · Берлин · 2025
Ярые партнеры
Офис и конференц-зал · Дублин · 2024Фильтруемая галерея в Elementor без Pro
Бесплатная Галерея изображений Elementor - это сетка со лайтбоксом Весь список управления - это изображения, столбцы, пробел, субтитры, ссылка и лайтбокс, поэтому в нем нет ни панели фильтров, ни кладки Elementor сохраняет свой более богатый виджет Gallery в списке Pro, куда и поступает лицензия. Этот виджет добавляет панель фильтров на бесплатную установку Elementor.
| Особенность | Галерея изображений Elementor (бесплатно) | Галерея фильтруемых изображений Master Addons |
|---|---|---|
| Вкладки фильтра категории | Нет | Да, с метки фильтра на каждый товар |
| “All” вкладке | Нет | Да, со своим лейблом |
| Масонство | Нет | Да |
| Столбцы | Да | Да, с 1 по 6 |
| Лайтбокс | Да | Да |
| Подписи | Подпись к вложению | Название, подзаголовок и категория, которые вы вводите по каждому элементу |
| Кнопки на предмете | Нет | Два, каждый со своим URL |
| Ленточный значок | Нет | Да |
| 3D-наклон на зависании | Нет | Да, бликами |
| Нужен Элементор Про | Нет | Нет |
Что делает и не делает виджет
Все, что ниже, было отмечено на панели виджетов Вторая половина имеет такое же значение, как и первая: если вам нужен пейджинг или окно поиска, это неправильный виджет, и лучше знать сейчас.
| Настройка | Поддерживается |
|---|---|
| Вкладки фильтра категории | Да, одна метка фильтра на элемент, запятая отделена более чем на один |
| “All” вкладке | Да, и можно переименовать |
| Масонство | Да |
| Блокировка соотношения сторон изображения | Да |
| Столбцы | от 1 до 6, одно значение для каждого размера экрана |
| Всплывающее окно Lightbox | Да |
| Ссылки вместо всплывающего окна | Да |
| Кнопки на единицу | Два, каждый со своим URL |
| Ленточный значок | Да, 12 предустановок плюс поле скидки |
| Название, подзаголовок и метка категории | Да, каждый со своей типографикой |
| Совет по элементу | Да |
| Наложение | При наведении всегда, никогда или прячьтесь при наведении курсора |
| 3D-наклон с бликами | Да |
| Анимация входа | Да |
| Кнопку Загрузить больше | Нет |
| Пагинация страниц | Нет |
| Поисковая коробка | Нет |
| Видео предметы | Нет |
| Сообщения или продукты в качестве источника | Нет, галерея - это ретранслятор, который вы заполняете |
Другие виджеты изображений в том же плагине: Эффекты наведения изображения для подписей, которые появляются на 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”).Все элементы с одной и той же группой этикеток под одной кнопкой фильтра. запятая-отдельно для назначения элемента нескольким категориям.
Есть ли у Elementor фильтруемая галерея?
Бесплатная Галерея изображений Elementor представляет собой простую сетку, поэтому у нее нет панели фильтров Виджет Галереи Elementor поставляется с Pro - это платный маршрут. этот виджет добавляет вкладки категории на бесплатную установку Elementor.
Могу ли я построить портфолио с помощью этого виджета?
Да. Каждый элемент принимает название проекта, подзаголовок для категории или года и две кнопки со своими URL-адресами, поэтому одна карта может указывать на живой сайт и на тематическое исследование.
Могут ли посетители открывать изображения в лайтбоксе?
Да. каждая кнопка может ссылаться на всплывающее окно лайтбокса, внешний URL-адрес или страницу на вашем сайте. установите пункт назначения ссылки для каждого элемента в разделе содержимого галереи.
Галерея отзывчива на мобильном телефоне?
Да. столбцы складываются автоматически, четыре столбца становятся двумя или одним на меньших экранах. кнопки фильтра обертываются по размеру. используйте адаптивный режим Elementor, чтобы настроить размеры желоба и шрифта специально для мобильных устройств.
Чем это отличается от обычной Image Carousel или Gallery Slider?
Карусель или ползунок показывает одно изображение за раз и циклически проходит через них. фильтруемая галерея показывает все сразу и позволяет посетителям сузить сетку по категориям. Используйте Изображение Карусель для разделов героев и рядов логотипов, или Галерея Слайдер (Pro) когда вам нужно одно большое изображение с миниатюрами Используйте фильтруемую галерею для портфолио, каталогов и коллекций, где просмотр имеет значение.
Галерея имеет большую нагрузку или нумерацию страниц?
Нет. каждый элемент в ретрансляторе загружается со страницей, поэтому портфолио из 40 изображений отправляет все 40 одновременно. Разделите очень большие наборы по страницам или сохраните файлы изображений легкими.
Почему мои вкладки фильтров не отображаются?
Три вещи для проверки: Показать Навигатор фильтра включен на вкладке Настройки, каждый элемент имеет метку фильтра, и кэш страницы был очищен после того, как вы отредактировали Элемент с пустой меткой никогда не присоединяется к категории.
Виджеты и расширения трендовых элементов
Создавайте сложные веб-сайты за меньшее время.
Стекломорфизм
Дополнительные контейнеры
Шаблоны
![Расширение Master Addons Post/Page Duplicator для Elementor: ссылка на строку MA Duplicator в списке WordPress Pages, создающая целевую страницу - [Дублированный № 128] черновик](https://d1asvmc6qcowgk.cloudfront.net/wp-content/uploads/2026/09/15102930/post-page-duplicator-768x403.webp)
Дубликатор сообщений/страниц
