Работа с предустановленными стилями

Статья
07/30/2024

В этой статье описывается, как работать с предустановками стилей в построителе сайтов Microsoft Dynamics 365 Commerce.

Предустановка стиля представляет собой сохраненный набор всех значений настраиваемого стиля для темы сайта. Она может использоваться для немедленного изменения оформления сайта с помощью построителя сайтов. Предустановки стилей позволяют авторам построителя сайтов Commerce быстро изменять, просматривать и активировать набор значений стилей на своем сайте без необходимости использовать каскадные таблицы стилей (CSS) или развертывать темы. Стили шрифтов, стили кнопок и цвета узла являются типичными примерами переменных стиля, которыми можно управлять через предустановки стилей.

Набор переменных стиля, доступных на сайте, определяется библиотекой темы и модулей, которая развернута в клиенте сайте. Онлайн-пакет SDK Dynamics 365 Commerce позволяет разработчикам реализовать сколько угодно настраиваемых переменных стиля для данной темы. При включении дополнительных переменных стиля разработчик темы может передавать окончательные стили сайта в руки построителя сайтов. Таким образом, пользователи-неразработчики не могут обновлять и предварительно просматривать стили сайтов с помощью набора инструментов. Возможность также полезна для любого сценария, в ходе которого прямые изменения тем или CSS вызовут ненужные издержки.

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

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

Предварительный предустановки стиля

Чтобы просмотреть предустановку стиля на сайте в построителе сайтов, выполните следующие действия.

В левой области перехода для своего сайта перейдите Параметры сайта > Дизайн.
На вкладке Предустановки стилей в верхней части редактора дизайна в списке Доступные предустановки выберите предустановку, а затем выберите Предоставление, чтобы перейти к заранее редактору предустановок.

Если в настоящее время нет предустановок в списке Доступные предустановки см. раздел Создание настраиваемой предустановки стиля для получения сведений о создании настраиваемой предустановки стиля.

Примечание

Предустановки, которые были включены в тему, обозначаются значком Встроено. Эти встроенные предустановки предназначены только для чтения. Чтобы скопировать встроенную предустановку в качестве новой настраиваемой предустановки, выберите кнопку с многоточием (…) для предустановки, а затем выберите Сохранить как.
На панели команд выберите Предварительный просмотр.
Выберите URL-адрес со своего сайта, чтобы использовать для предварительного просмотра предустановки стиля, а затем нажмите ОК.
Выберите вариант URL-адреса, относящийся к каналу и языковым параметров для предварительного просмотра, выбрав название варианта. Откроется новое окно предварительного просмотра в браузере, в котором выбранная предустановка стиля применена к указанной странице.

Примечание

URL-адрес предварительного просмотра является постоянным и с аутентификацией. Таким образом, можно скопировать, вставить и отправить другим аутентифицированным сотрудникам на рассмотрение, прежде чем установить для значение "активно" на действующем сайте. URL-адрес предварительного просмотра также полезен для проверки стилей на других устройствах, в других браузерах и на других экранах.

Совет

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

Создание настраиваемой предустановки стиля

Чтобы создать настраиваемую предустановку стиля в построителе сайтов, выполните следующие действия.

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

Примечание

Кроме того, можно создать новую настраиваемую предустановку стиля из любой существующей предустановки, нажав кнопку с многоточием (...) для этой предустановки, а затем выбрав Сохранить как. Или выберите Сохранить как на панели команд в редакторе предустановок.

Изменение значений глобальных стилей и стилей типов модулей

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

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

Примечание

Иерархия значений стиля на сайте осуществляется следующим образом. Значения стиля, которые появляются вправо, переопределяют значения стилей слева от них.

Значения по умолчанию для темы < Глобальные значения стиля < Значения стиля типа модуля < Переопределение CSS

Чтобы изменить глобальные значения или значения типа модуля предустановки стиля в построителе сайтов, выполните следующие действия.

В левой области перехода для своего сайта перейдите Параметры сайта > Дизайн.
На вкладке Предустановки стилей в верхней части редактора дизайна выберите Представление для любой предустановки стиля, чтобы перейти к редактору предустановок.
Выберите Предварительный просмотр и выполните шаги выбора URL-адреса, чтобы открыть предварительный просмотр в полном окне браузера для данной предустановки. Оставьте окно предварительного просмотра в браузере открытым.
В редакторе предустановок выберите Правка в верхнем правом углу.
Для изменения некоторых глобальных значений стиля используйте элементы управления переменных стиля в редакторе.
В верхней части редактора на вкладке Модули справа от вкладки Глобальный выберите тип модуля, стиль которого следует изменить.
С помощью элементов управления стиля измените некоторые значения для типа модуля.
Когда все готово для предварительного просмотра изменений, выберите Сохранить на панели команд.
Вернитесь в окно предварительного просмотра браузера и обновите его. Предварительный просмотр в полном окне браузера полезен для проверки изменений стилей в других составляющих представлениях, в других браузерах и на других платформах устройств.
После того как все изменения завершены и проверены, выберите Завершить правку в верхнем правом углу редактора.

Примечание

При редактировании предустановки стиля, которая в настоящее время активна на сайте, в редакторе будет отображен синий значок Активно. Этот значок означает, что данная предустановка в настоящее время используется на веб-сайте. При изменении активной предустановки выберите Опубликовать, чтобы отправить эти изменения на активный сайт.

Активация новой предустановки стиля на действующем сайте

Чтобы задать предустановку стиля как новую активную предустановку на своем сайте, выполните следующие действия.

Выберите Задать как активную кнопку в одном из следующих мест:
- Панель команд в редакторе предустановок стилей
- Меню с многоточием (…) для любой доступной предустановки в главном представлении на вкладке Предустановки стилей в Параметры сайта > Дизайн

Значения стиля предустановки становятся активными на общедоступном веб-сайте.