Чтобы применить уникальные стили или JS-анимацию к конкретной кнопке, секции или отдельной странице, не затрагивая остальные части сайта, в Gridbox используется механизм Class Suffix (Суффикс класса). Это позволяет точечно адресовать CSS-селекторы прямо к нужному узлу DOM.
1 Добавление класса к элементу, колонке или секции
Выдели нужный плагин, колонку или секцию в визуальном редакторе, перейди в его настройки и в поле Class Suffix введи имя класса без точки:
Class Suffix
custom-element2 Добавление класса ко всей странице (Body)
Если стили должны изолированно действовать только в рамках одной посадочной страницы (Landing Page), перейди в верхнем меню: Страница ➝ Настройки страницы ➝ Основные (General) и заполни поле Class Suffix:
Class Suffix (Page)
custom-page3 Стилизация через CSS селекторы
Открой Инструменты ➝ Редактор кода ➝ CSS и обратись к добавленным классам:
CSS
/* Стилизация отдельного элемента по его суффиксу */.custom-element { box-shadow: 0 10px 30px rgba(0, 102, 255, 0.15); border-color: #0066ff !important;}/* Стилизация элементов только на конкретной странице */body.custom-page .ba-header { background-color: transparent !important;}Обрати внимание:
В поле Class Suffix пишется только имя класса (например, custom-element) без точки. Если нужно назначить элементу сразу несколько классов, перечисляй их через пробел: custom-element shadow-lg is-accent.