
Сравнение результатов: до и после
Готовый шаблон для 1С-Битрикс: эффект «Сравнение До и После». Установите модуль на сайт любой редакции и наглядно покажите изменения клиентам. Закажите.
Нужна лицензия 1С-Битрикс?
Поможем купить новую лицензию или продлить действующую — «1С-Битрикс: Управление сайтом» и Битрикс24.
Дорого?
Напишите нам — бесплатно подберём похожее решение подешевле под вашу задачу.
Технические данные
- Опубликовано:
- 19.09.2019
- Обновлено:
- 23.02.2023
- Версия:
- 0.0.3
- Установлено:
- Менее 50 раз
- Подходящие редакции:
- «Первый сайт», «Старт», «Стандарт», «Малый бизнес», «Бизнес»
- Адаптивность:
- Да
- Поддержка Композита:
- Нет
- Совместимо с Сайты24
- Нет
Онлайн-демонстрация
Хотите увидеть продукт в действии? Запросите демонстрацию — мы покажем всё вживую и ответим на вопросы.
Что входит в сравнение
Готовое решение Сравнение До и После предназначено для визуальной демонстрации изменений между двумя состояниями одного объекта. Основная задача компонента — наглядно показать разницу между исходным и итоговым вариантами: ремонт помещения, обработка фотографии, результат косметологической процедуры, работа ландшафтного дизайнера или любые другие преобразования. Пользователь управляет специальным ползунком, чтобы плавно перемещаться между двумя изображениями, мгновенно оценивая эффект. Это эффективный способ усилить доверие к услугам или товарам, так как клиент видит результат без лишних текстовых пояснений.
Как работает решение на платформе 1С-Битрикс
Компонент разработан для системы управления сайтами 1С-Битрикс и совместим с редакциями от «Первый сайт» до «Бизнес». В основе лежит стандартный механизм «Список новостей», что гарантирует стабильную работу и знакомую структуру настроек для разработчика. После установки инструмент берет данные из инфоблоков: в поле «картинка анонса» загружается изображение «До», а в поле «детальная картинка» — изображение «После». Важное преимущество — возможность выводить как один объект для сравнения, так и целый набор (например, галерею проектов). Для каждого элемента можно дополнительно отображать дату, заголовок и краткое описание.
Что получает покупатель после установки
Покупатель получает готовый к использованию компонент со следующим функционалом:
- Интерактивный слайдер для сравнения двух изображений в реальном времени.
- Автоматический подбор картинок из выбранного раздела инфоблока.
- Гибкие настройки вывода: один или несколько объектов, с описанием или без.
- Полная поддержка адаптивной верстки — корректное отображение на всех типах устройств.
- Возможность выбора конкретного раздела инфоблока для отбора элементов.
Решение не требует сложной доработки: достаточно установить компонент на страницу, указать ID инфоблока и нужный раздел. Адаптивность встроена по умолчанию, поэтому на мобильных телефонах и планшетах ползунок также работает корректно.
Для кого подходит решение
Инструмент будет полезен компаниям, чей бизнес завязан на демонстрации изменений внешнего вида, состояния или качества. В первую очередь это стоматологии и клиники эстетической медицины (результаты лечения и процедур), салоны красоты и барбершопы (прически, макияж), ремонтные и строительные организации (фото до/после ремонта), фотостудии и ретушеры (обработка снимков), а также интернет-магазины, продающие товары с эффектом преображения (например, средства для ухода или одежда). Решение подходит для любого сайта на 1С-Битрикс, где важно быстро и понятно показать клиенту разницу, не перегружая страницу текстом.
Выводит информацию из элементов инфоблоков:
До - картинка анонса,
После - детальная картинка.
Компонент сделан на основе списка новостей и содержит все его настройки.
Можно выводить как один сравниваемый объект, так и несколько.
При необходимости можно выводить дату, название и описание анонса.
Можно выбирать раздел инфоблока, из которого выводить.
Для каких задач подходит модуль «Сравнение результатов: до и после»?
С какими редакциями 1С-Битрикс совместимо решение?
Какова стоимость и условия лицензирования модуля?
Как установить и настроить модуль на сайте?
Предоставляется ли техническая поддержка после покупки?
Установка решения из Маркетплейса
Перейдите в административном разделе сайта в «Маркетплейс» → «Каталог решений». Найдите модуль «Сравнение результатов: до и после» и нажмите «Установить». Дождитесь завершения установки.
Настройка инфоблока для хранения данных
Создайте новый или выберите существующий инфоблок (например, «Наши работы»). В настройках инфоблока убедитесь, что включены поля «Картинка анонса» (для изображения «До») и «Детальная картинка» (для изображения «После»).
Добавление элементов с изображениями
Перейдите в «Контент» → «Инфоблоки» → выберите ваш инфоблок и создайте новый элемент. В поле «Картинка анонса» загрузите изображение «До», в поле «Детальная картинка» — изображение «После». Заполните название и сохраните элемент.
Размещение компонента на странице
Откройте страницу для вывода сравнения (например, главную или раздел «Портфолио») в режиме редактирования. Добавьте компонент «Список новостей» (типовой компонент) и в его настройках укажите созданный инфоблок. В шаблоне компонента выберите режим сравнения «До/После».
Проверка работы на сайте
Сохраните изменения и откройте страницу на публичной части сайта. Убедитесь, что изображения «До» и «После» отображаются, а ползунок позволяет плавно переключаться между ними. Проверьте корректность отображения на мобильных устройствах.
- v0.0.323.02.2023Обновление для поддержки версии PHP 8+
- v0.0.229.06.2020Добавлена совместимость с jquery 3
Нужна помощь с установкой?
Напишите нам — поможем установить и настроить модуль на вашем сайте.



















