Полное руководство по работе с пресетами в Divi
В версию 4.5 темы Divi вошло изменение, которое радикально изменило концепцию строительства сайтов. Я говорю сейчас о введении системы пресетов. Она пришла на смену глобальным настройкам. Причем пресеты не отменили глобальные настройки, изменили их и подняли на новый уровень. Вместо одной глобальной установки по умолчанию разработчик темы Elegant Themes ввел несколько значений для любого элемента в Divi. С этим новшеством настройка Divi еще быстрее и проще.
В данной статье рассмотрим функционал, настойки и особенности пресетов темы.
Замена глобальных настроек по умолчанию
Предположим, у меня на сайте есть три основные дизайна кнопок, которые используются повсеместно. Назначаем каждой из этих трех дизайнов кнопок свои собственные глобальные предварительные настройки (пресеты) «Кнопка 1», «Кнопка 2» и «Кнопка 3». Теперь каждый раз, когда я создаю новую кнопку, выбираю один из этих пресетов.
Кроме того, когда я обновляю дизайн одного пресета (одной кнопки), он обновляется во всех местах, где есть по всему сайту.
Пресеты можно и нужно использовать не только для отдельных элементов, таких как текст, рисунок или видео, но и для строк и разделов. Таким образом, пресеты ускоряют процесс проектирования и обслуживания сайта.
Меню пресетов
Как мы уже выяснили, что пресеты существуют в модальных настройках любого элемента Divi. Чтобы получить доступ к ним для определенного элемента Divi, надо открыть его настройки и открыть раскрывающееся меню пресетов (1) в верхней части модального поля под заголовком.
В раскрывающемся списке есть возможность выбрать сохранённый пресет (2), создать новый (3) и (4) или обновить текущий по умолчанию.
В рассматриваемом примере по умолчанию установлен пресет «Кнопка 1» (около него стоит звездочка). Зеленая галочка свидетельствует о том, что он активен и применяется к создаваемому элементу Кнопка. Активным может быть любой из трех вариантов на выбор вебмастера.
Есть еще два пункта в выпадающем меню:
- (3) — создать новый пресет из текущих стилей или
- (4) — создать новый пресет с нуля.
Настройка дизайна и установок пресета
Для обновления, настройке дизайна и установок или редактирования надо в меню для активного пресета (он подсвечивается синим цветом) нажать на карандаш (1).
Панель элемента в Divi «разворачивается» для настроек контента, дизайна и CSS. В этот момент меняется цвет панели на серый, что говорит о том, что открыты настройки. Это сделано для того, чтобы визуально отличать редактирование предустановок пресета от тех опций, которые применяются только к элементу локально.
Обратите внимание на следующий рисунок. Левая и правая части крайне похожи, отличаются только цветом.
Левая часть (фиолетовый цвет) — это панель работы с пресетами как целыми единицами. А правая часть (серая) — это панель настроек конкретного пресета. Сделано это для того, чтобы можно оперативно отредактировать любой из возможных пресетов, находясь в меню настроек.
Использование в Divi глобальных пресетов
Глобальный пресет — это пресет по умолчанию. Конечно, все пресеты в Divi носят глобальный характер. Их глобальность проявляется в том, что установки применяются ко всем элементам, сделанных на основе того или иного пресета.
При создании того или иного элемента сайта к нему применяется глобальный пресет (установки по умолчанию). В моем случае дефолтовым выбран пресет «Кнопка».
После добавления дополнительных предустановок в раскрывающемся меню будут перечислены все доступные пресеты для элемента Кнопка. Глобальная (по умолчанию) останется в списке в верхней части раскрывающегося списка вместе с названием предустановки, на которой она основана.
Рядом с некоторыми предустановками в списке виден значки. Значок звездочки обозначает пресет, который используется по умолчанию (глобальный). Зеленый значок галочки обозначает активную предустановку (или пресет, используемый в данный момент элементом).
В нашем примере элемент Кнопка создается на основании пресета Кнопка 1, который и является по умолчанию, то есть глобальным.
Создание новых пресетов
Также в раскрывающемся списке предустановок есть две основные кнопки.
Если нажать на кнопку «Создать новый пресет на основании текущих стилей», то мы запустим создание пресета со стилями и дизайном, активными на данный момент. Или можно нажать кнопку «Добавить новый пресет», чтобы добавить новый пресет с нуля.
Меню настройки
При наведении мыши на пресет в раскрывающемся списке элемент станет синим, и появится меню с дополнительными параметрами.
Этот пункт меню включает в себя следующие параметры:
- редактировать пресет,
- обновить пресет с текущими стилями,
- удалить
- настроить,
- дублировать,
- назначить по умолчанию.
Помогу в создании блога, интернет-магазина или лендинга на премиальной теме WordPress Divi. Обучу администрированию сайта. Окажу техническую поддержку.
Обращайтесь, буду рад помочь Вашему бизнесу или хобби.
