We use cookies and similar technologies to improve your experience, analyse traffic, and personalise content. You can accept all cookies or reject non-essential ones.
Это руководство проведёт вас через создание портала и использование каждой вкладки в редакторе Design — Pages, Layouts, Navigation, Components и Branding — для сборки полноценного фирменного интерфейса, готового для участников.
Портал открывается в редакторе Design — мастер из трёх шагов сверху: Design → Preview → Publish.
При открытии совершенно нового портала вам предлагается пять стартовых шаблонов. Каждый из них заранее заполняет страницы, структуру навигации, макет боковой панели, баннер-герой и соответствующие компоненты, чтобы у вас сразу было с чем работать:
| Шаблон | Лучше всего подходит для | Готовые страницы |
|---|---|---|
| Retailer Portal | Самообслуживания по возвратам (RMA), гарантиям и счетам | Home · My Returns · Return Detail · Warranties · Warranty Detail · Invoices · My Account |
| Education Portal | Тестов, викторин, таблиц лидеров и сертификатов | Dashboard · Available Tests · Test Detail · My Results · Result Detail · Leaderboard · Certificates |
| Support Portal | Отслеживания тикетов и базы знаний | Dashboard · My Tickets · Ticket Detail · Knowledge Base · Article · My Account |
| Research Portal | Опросных панелей и исследовательских программ | Dashboard · My Surveys · Survey Detail · My Responses · Scores · Certificates · Profile |
| Survey Analytics Portal | Персональных аналитических дашбордов | Dashboard (with analytics widgets) · My Responses · Scores · Profile |
| Blank Canvas | Полностью индивидуальных порталов, созданных с нуля | Одна главная страница — всё остальное вы строите сами |
Выберите наиболее подходящий шаблон и настройте его под себя. Позже вы также можете переключить шаблон из панели инструментов, не потеряв настройки брендинга.
Левая часть редактора — это панель значков с пятью вкладками. Каждая вкладка открывает панель, управляющую отдельным аспектом вашего портала. Нажмите на значок, чтобы переключить панель; холст справа сразу отражает ваши изменения.
На вкладке Pages вы управляете каждым экраном вашего портала. У каждой страницы есть три настройки:
invoices становится panel.acme.com/invoices. Используйте строчные буквы, цифры и дефисы. Slug, содержащий сегмент с двоеточием — например tickets/:ticketId — это динамическая страница: один и тот же шаблон отображает разные записи в зависимости от того, что указано в URL.Одна страница отмечена как default landing page — куда участники направляются сразу после входа. Изменить страницу по умолчанию можно в настройках страницы.
Slug страницы вида tickets/:ticketId создаёт динамическую страницу. Когда компонент Data List переходит на неё, ID записи помещается в URL, и компонент Data Detail на этой странице автоматически загружает соответствующую запись. Этот шаблон из двух компонентов и двух страниц даёт участникам полноценный опыт детализации данных для любого типа записей — без написания кода.
Чтобы добавить страницу: нажмите Add Page, заполните заголовок, slug и уровень доступа, затем нажмите Save. Чтобы удалить страницу, нажмите значок удаления в её строке — после этого обновите все элементы навигации, ссылавшиеся на неё.
Layout — это визуальная оболочка, которая оборачивает каждую страницу — где располагается навигация и как пропорционирована основная область контента. Выберите из доступных миниатюр макетов:
Все макеты адаптивны для мобильных устройств — навигация подстраивается под маленькие экраны без какой-либо дополнительной работы.
Вкладка Navigation управляет меню, которое участники видят в боковой панели (или там, где активный макет размещает навигацию). Постройте и управляйте структурой меню:
Держите навигацию сфокусированной — от пяти до восьми пунктов — это оптимальный диапазон. Участники должны уметь ориентироваться с одного взгляда. Динамические страницы деталей (например, tickets/:ticketId) не обязаны присутствовать в навигации — участники попадают на них, кликая по строкам в списке.
Вкладка Components — это ваша библиотека строительных блоков. Сначала выберите страницу на вкладке Pages, чтобы открыть её на холсте, затем переключитесь на вкладку Components, чтобы добавлять элементы на эту страницу.
Перетащите любой компонент на холст или нажмите, чтобы вставить его внизу страницы. У каждого компонента есть панель настроек справа в редакторе, где вы настраиваете его содержимое, привязки данных и стиль.
Единое агрегированное число — количество, среднее или сумма — взятое из любой сущности данных, с опциональным применённым фильтром. По умолчанию привязано к вошедшему участнику. Разместите несколько таких карточек в Section Container, чтобы собрать панель метрик:
Таблица записей с пагинацией, сортировкой и поиском. В настройках компонента выберите:
tickets/:ticketId), обеспечивая полную детализациюПолное детальное представление одной записи, определяемой параметром URL. Разместите этот компонент на динамической странице (например, tickets/:ticketId), задайте тип сущности и укажите имя параметра как :ticketId. Когда участник нажимает на строку в Data List, ведущую сюда, этот компонент автоматически загружает и отображает соответствующую запись.
Вкладка Branding управляет каждым элементом визуальной идентичности вашего портала — от того, что участники видят ещё до входа в систему, до логотипа в боковой панели на каждой странице. Изменения здесь сохраняются автоматически при потере фокуса.
Логотип вашей организации, отображаемый в заголовке боковой панели и на видном месте на экранах входа и регистрации. Чтобы задать или изменить логотип:
Если логотип конкретного портала не задан, портал автоматически использует логотип вашей организации. Это означает, что только что созданный портал уже выглядит фирменно без каких-либо дополнительных шагов.
Жирный заголовок, который участники видят на экране входа перед аутентификацией — первый фирменный текст, который они видят на вашем домене. Примеры:
Это поле переводимо: добавьте значение для каждого языка, поддерживаемого вашим порталом, и участники увидят его на своём языке.
Короткий абзац сразу под заголовком входа — естественное место для контекста программы, инструкций по участию или краткого ценностного предложения. Примеры:
Также переводимо для каждого языка.
Пользовательское имя хоста, на котором обслуживается этот портал. В выпадающем списке отображаются только подтверждённые домены панели (из Settings → Domains → Participant Panel). Выбор домена здесь связывает ваш дизайн с реальным URL, который будут использовать участники.
Если вы ещё не добавили домен, в выпадающем списке появится опция + Add new domain, которая направит вас прямо на экран настройки домена. Вернитесь и выберите домен, как только он будет подтверждён.
Короткий, безопасный для URL идентификатор, используемый в ссылке живого предпросмотра, чтобы вы могли протестировать портал в реальной вкладке браузера. Используйте строчные буквы, цифры и дефисы. Он задаётся автоматически при создании портала, но при необходимости может быть отредактирован здесь для более понятного идентификатора.
Каждое изменение на каждой вкладке сохраняется автоматически в фоновом режиме. Панель инструментов показывает индикатор синхронизации — «Saved», когда всё сохранено, и «Saving…» кратко во время обновления. Кнопка ручного сохранения не нужна.
Все сохранённые состояния хранятся в панели Version History (значок часов на панели инструментов). Найдите любую предыдущую версию и нажмите Restore, чтобы откатиться назад — это полезно, когда экспериментальное изменение не сработало.
Каждое текстовое поле в редакторе — заголовки страниц, метки навигации, заголовки, абзацы, подписи кнопок, заголовок входа и описание входа — показывает переключатель языка, если в вашей организации включено несколько языков. Заполните каждую локаль. Портал отображается на предпочитаемом языке участника и переключается на язык по умолчанию для любых непереведённых строк.
Как только ваш дизайн собран, пройдите весь опыт самостоятельно, прежде чем его увидит хоть один участник. Перейдите к разделу Предпросмотр и тестирование вашего портала.