Общие сведения

В разделе Внешний вид консоли управления администратор может настроить параметры отображения единой страницы входа. Если применяются приложения Blitz Identity Provider по регистрации пользователей и восстановлению пароля, то их внешний вид также будет соответствовать заданным настройкам внешнего вида единой страницы входа.

При входе в раздел Внешний вид отображается перечень настроенных шаблонов страницы входа. Каждый шаблон описывается:

  • идентификатором;

  • названием;

  • перечнем приложений;

  • описанием.

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

Редактирование шаблона по умолчанию осуществляется с помощью специального конструктора.

Также имеется возможность:

  • создавать и изменять новые шаблоны с помощью конструктора и назначать их разным приложениям ;

  • создавать и изменять новые шаблоны в ручном режиме.

Редактирование шаблона по умолчанию

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

Настройка внешнего вида страницы входа

В стандартной поставке конструктор Blitz Identity Provider предоставляет следующие возможности:

  • три цветовых темы оформления элементов интерфейса;

  • возможность определить местоположения блока ввода сведений (идентификации и аутентификации, регистрации, восстановления пароля);

  • возможность загрузки логотипа компании для отображения в заголовке страницы;

  • выбор фонового рисунка (можно выбрать из 3 стандартных рисунков в каждой теме оформления, либо загрузить свой собственный фоновый рисунок);

  • настройка содержания футера страницы входа.

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

Пример страницы входа с social login и дополнительным футером

Пример страницы входа в темном интерфейсе и с режимами входа по электронной подписи, сеансу операционной системы или через ЕСИА

Пример страницы входа в светлом интерфейсе, с кастомным логотипом в заголовке страницы и без специальных режимов входа

Создание и изменение новых шаблонов с помощью конструктора

Blitz Identity Provider позволяет настроить разный вид страниц входа для случая входа пользователя в различные подключенные приложения. Для этого необходимо создавать новые шаблоны входа – проще всего это сделать на базе существующего default-шаблона, нажав на кнопку «Копировать». После этого будет создан новый шаблон, который можно редактировать с помощью конструктора.

Создание нового шаблона на базе существующего основного шаблона

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

Назначение шаблона страницы входа приложению

Создание и изменение новых шаблонов в ручном режиме

Для Enterprise-редакции можно настроить вид страницы входа под индивидуальные требования организации, т.е. нет необходимости ограничиваться только возможностями конструктора.

Каждый шаблон страницы входа представляет собой zip-архив. Все шаблоны размещены в директории:

\assets\themes

Самый простой способ перейти к ручному редактированию шаблона – выполнить следующие шаги:

  • создать копию существующего шаблона (например, default-шаблона), нажав в консоли кнопку "Копировать";

  • перейти в соответствующую директорию с шаблонами;

  • распаковать архив с только что созданным шаблоном;

  • отредактировать файл meta.conf, содержащийся в архиве, удалив параметр builder;

  • обратно заархивировать файлы шаблона, убедившись, что файл meta.conf находится в корневой директории.

Удаление параметра builder из файла meta.conf

После выполнения этих шагов появится возможность редактирования темы в ручном режиме. Помимо стандартных полей, описывающих саму тему, доступен блок «Шаблон страниц». Он позволяет создать / изменить шаблон – текстовый файл, который компилируется с помощью шаблонизатора Twirl .

Шаблон должен иметь сигнатуру:

@(headers: Html, form: Html, scripts: Html, pathAssets: String)(implicit request: RelyingPartyRequest[_], messages: Messages)

В качестве параметров при создании шаблона следует использовать:

  • headers – html-код заголовка страницы, который необходимо расположить в теге head;

  • form – html-код основной формы, который необходимо расположить в теге body;

  • scripts – html-код с javasctips, необходимый для корректной работы формы, который необходимо расположить в теге body;

  • pathAssets – контекстный путь к ресурсам шаблона.

Листинг простейшего шаблона приведен ниже:

@(headers: Html, form: Html, scripts: Html, path: String)(implicit request: RelyingPartyRequest[_], messages: Messages)

<!DOCTYPE html>
<html>

<head>
    @headers

</head>


<body>

    <div id="main">
        <section id="content_wrapper">
                @form
        </section>
        <div>
            <div>
                @Html(messages("author.copyright"))
            </div>
        </div>
    </div>
    @scripts

  </body>

</html>

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

Внешний вид простейшей страницы входа

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

Для их загрузки следует использовать блок «Ресурсы» внешнего вида страницы, который позволяет загрузить необходимые файлы в zip-архиве. Чтобы соответствующие файлы были доступны, их следует размещать в директории архива с названием assets. Необходимые ресурсы также можно вручную включить в состав исходного zip-архива с шаблоном страницы.

Внешний вид: доступные ресурсы