Управление шаблонами отображения в Optimizely CMS (SaaS) традиционно требовало работы напрямую с REST API или управления файлами конфигурации JSON вручную. Сегодня я рад поделиться новым инструментом с открытым исходным кодом, который предоставляет визуальный, удобный интерфейс для управления шаблонами отображения: Optimizely SaaS Style Manager.
Что такое шаблоны отображения?
В Optimizely CMS (SaaS) шаблоны отображения (также известные как «стили») определяют, как редакторы контента могут настраивать визуальное представление контента. Они позволяют создавать предопределенные параметры стиля для разделов, строк и столбцов в Visual Builder, предоставляя редакторам контента гибкость, не требуя вмешательства разработчика для каждого изменения дизайна.
Каждый шаблон отображения может включать в себя:
- Уникальный ключ для идентификации
- Отображаемое имя показано редакторам контента
- Базовый тип (Раздел, строка или столбец)
- Связанный тип контента для контекстно-зависимого стиля
- Пользовательские настройки с различными типами редакторов (текстовый, логический, числовой, раскрывающийся список)
Вызов
Хотя API Optimizely CMS обеспечивает полные операции CRUD для шаблонов отображения, управление ими с помощью необработанных вызовов API или файлов JSON представляет несколько проблем:
- Нет визуального интерфейса для просмотра существующих шаблонов
- Ручное редактирование JSON склонен к синтаксическим ошибкам
- Трудно мигрировать шаблоны между средами
- Никакого поиска и фильтрации когда у тебя много шаблонов
Войдите в Менеджер стилей
Style Manager — это веб-приложение на базе Blazor, которое подключается напрямую к вашему экземпляру Optimizely CMS через REST API, предоставляя полный интерфейс управления шаблонами отображения.
Ключевые особенности
1. Полные операции CRUD
Создавайте, просматривайте, редактируйте и удаляйте шаблоны отображения с помощью интуитивно понятного интерфейса на основе форм. Больше не нужно вручную создавать JSON или выполнять необработанные вызовы API.
2. Умный поиск и фильтрация
Быстро находите шаблоны с помощью текстового поиска по ключам и отображаемым именам или фильтруйте по базовому типу (Раздел, Строка, Столбец). Благодаря устранению дребезга ввода интерфейс остается отзывчивым даже при работе с большими коллекциями шаблонов.
3. Управление динамическими настройками
Настройте параметры шаблона визуально с поддержкой нескольких типов редакторов:
- Нить – Поля ввода текста
- логическое значение – Тумблеры
- Число – Числовые входы
- Выбирать – Выпадающие меню с возможностью выбора
Добавляйте, удаляйте и меняйте порядок настроек и вариантов, не касаясь JSON.
4. Интеграция типов контента
Новый раскрывающийся список типов контента с возможностью поиска выбирает доступные типы контента непосредственно из вашего экземпляра CMS. Просто начните вводить фильтр, используйте навигацию с помощью клавиатуры и выберите подходящий тип контента для вашего шаблона.
5. Импорт и экспорт
Легко передавайте шаблоны между средами:
- Экспорт все шаблоны или выберите определенные для загрузки в формате JSON
- Импорт вставив JSON или загрузив файл
- Разрешение конфликтов – выберите пропустить или перезаписать существующие шаблоны
- Подробные результаты отображение успеха/неудачи для каждого импортированного шаблона
6. Безопасная аутентификация OAuth
Диспетчер стилей использует поток учетных данных клиента OAuth 2.0 с автоматическим кэшированием и обновлением токенов. Ваши учетные данные API настраиваются один раз, и приложение прозрачно обрабатывает аутентификацию.
Начиная
Предварительные условия
Конфигурация
Обновлять appsettings.json с вашими учетными данными API:
{
“OptimizelyApi”: {
“BaseUrl”: “https://api.cms.optimizely.com/preview3”,
“TokenUrl”: “https://api.cms.optimizely.com/oauth/token”,
“ClientId”: “идентификатор-вашего-клиента”,
“ClientSecret”: “секрет вашего клиента”
}
}
Запуск приложения
dotnet run
Перейдите к https://локальный хост:5001 и начните управлять шаблонами отображения.
Варианты использования
Миграция окружающей среды
Разрабатываете новые шаблоны в промежуточной среде? Экспортируйте их в формате JSON и импортируйте в производство несколькими щелчками мыши. Функция разрешения конфликтов гарантирует, что вы случайно не перезапишете расходящиеся шаблоны.
Аудит шаблонов
Хотите просмотреть все шаблоны для определенного типа контента? Используйте возможности поиска и фильтрации, чтобы быстро находить и проверять соответствующие шаблоны.
Быстрое прототипирование
Создавайте и изменяйте конфигурации шаблонов через визуальный интерфейс, а затем экспортируйте окончательный JSON для контроля версий или документации.
Сотрудничество в команде
Делитесь экспортированными файлами JSON с членами команды для проверки перед импортом в общие среды. Функция предварительного просмотра показывает, что именно будет создано или обновлено.
Техническая Архитектура
Менеджер стилей создан с использованием современных технологий .NET:
- ASP.NET Core Blazor с интерактивным серверным рендерингом для гибкого взаимодействия с SPA
- CSS попутного ветра для чистого, практичного дизайна
- HttpClient с шаблоном DelegatingHandler для прозрачной аутентификации
- System.Text.Json для эффективной сериализации JSON
Приложение следует принципам чистой архитектуры с четким разделением между:
- Страницы – Компоненты Blazor для пользовательского интерфейса.
- Услуги – Бизнес-логика и API-коммуникация
- Модели – Объекты передачи данных, соответствующие схеме API Optimizely.
Что дальше?
Это только начало. Потенциальные будущие улучшения включают в себя:
- Массовые операции для одновременного управления несколькими шаблонами
- Управление версиями шаблона отслеживать изменения с течением времени
- Правила валидации для значений настроек
- Дублирование шаблона для быстрого создания вариаций
- Темный режим для ночных сеансов управления шаблонами
Заключение
Optimizely SaaS Style Manager превращает управление шаблонами отображения из задачи API, ориентированной на разработчиков, в доступный визуальный рабочий процесс. Являетесь ли вы разработчиком, желающим ускорить создание шаблонов, или техническим менеджером контента, которому необходимо проверять существующие шаблоны, Style Manager предоставит вам необходимые инструменты.
Приложение имеет открытый исходный код и доступно для использования, изменения и внесения вашего вклада. Попробуйте и дайте нам знать, как это улучшит ваш рабочий процесс Optimizely CMS!
Диспетчер стилей использует REST API Optimizely CMS для управления шаблонами отображения. Убедитесь, что ваши учетные данные API имеют соответствующие разрешения для операций, которые вам необходимо выполнить.
13 января 2026 г.
Ещё по этой теме
