Новогодние украшения для сайта: гирлянда, снег, игрушки

Что умеет решение

Модуль для 1С Битрикс позволяет добавить на сайт адаптивные новогодние и рождественские украшения: гирлянды (статичные и анимированные), эффект снегопада и декоративные игрушки. Элементы имеют компактные размеры и подстраиваются под любое разрешение экрана, не перекрывая основной контент.

Гирлянда поддерживает размещение по любой стороне экрана. В текущей версии доступны статические и анимированные варианты; в будущих обновлениях планируется расширение ассортимента, включая интерактивные элементы.

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

Игрушки можно разместить в любом месте сайта с гибкими параметрами отображения.

Настройка модуля выполняется в административной панели 1С Битрикс: Настройки — Настройки продукта — Настройки модулей — Новогодние украшения для вашего сайта. На главной вкладке «Настройка модуля» можно включить или отключить функционал, при этом текущие параметры сохраняются.

Вкладка «Настройка гирлянды» управляет внешним видом и позиционированием декорации. Параметр Z-index задаёт положение элемента по оси Z, определяя, будет ли он отображаться поверх других объектов или под ними.

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

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

В поле CSS-селектор укажите уникальный селектор элемента сайта, к которому будет прикреплено украшение.

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

Наведите курсор на нужный элемент, нажмите правую кнопку мыши и выберите пункт контекстного меню, соответствующий вашему браузеру:

Firefox: «Исследовать»

Google Chrome: «Просмотреть код»

Откроется окно инструментов разработчика с вкладкой «Элементы» или «Инспектор» (название зависит от браузера). Код выбранного элемента будет выделен. Элемент отображается в иерархическом дереве структуры страницы; при необходимости можно выбрать другой элемент.

Выделите нужный элемент в дереве структуры и откройте контекстное меню правой кнопкой мыши. В зависимости от браузера выберите опцию копирования CSS-селектора: в Firefox это пункт «Скопировать» — «CSS-селектор», в Google Chrome — «Копировать» — «копировать selector». Полученный селектор вставьте в поле «CSS-селектор» в настройках игрушки. Дополнительные параметры позволяют определить внешний вид и положение элемента относительно выбранного узла, а также настроить его отображение с учетом разрешения экрана. Возможность добавлять несколько мест размещения для одной игрушки обеспечивает более гибкую настройку её отображения. После завершения конфигурации нажмите кнопку «Сохранить».

General iT поможет установить модуль, настроить его и проверить работу на твоём сайте.