Бренд веб-портала
Область применения:
SQL Server 2016 (13.x) Reporting Services и более поздних версий Сервер отчетов Power BI
Вы можете изменить внешний вид веб-портала путем фирменной символики для вашего бизнеса, который можно сделать с помощью пакета фирменной символики. Для работы с пакетами фирменной символики углубленное знание каскадных таблиц стилей (CSS) не требуется.
Создание пакета фирменной символики
Пакет фирменной символики для служб отчетов состоит из трех элементов. Он упаковывается в ZIP-файл. Файлы должны иметь следующие имена:
- colors.json
- metadata.xml
- logo.png (необязательно)
Упакуйте эти файлы в ZIP-файл. Имя ZIP-файла может быть любым.
metadata.xml
Файл metadata.xml позволяет присвоить имя пакету фирменной символики, а также содержит ссылки на файлы colors.json и logo.png.
Чтобы изменить имя пакета фирменной символики, измените атрибут name для элемента SystemResourcePackage .
name="Multicolored example brand"
В пакет фирменной символики можно включить изображение логотипа (необязательно). Этот элемент описывается в элементе Contents.
Пример без файла логотипа:
<Contents>
<Item key="colors" path="colors.json" />
</Contents>
Пример с файлом логотипа:
<Contents>
<Item key="colors" path="colors.json" />
<Item key="logo" path="logo.png" />
</Contents>
colors.json
При отправке пакета фирменной символики сервер извлекает соответствующие пары name/value из файла colors.json и объединяет их с основной таблицей стилей LESS, brand.less. Затем он обрабатывает этот файл и передает клиенту полученный файл CSS. Все цвета сохраняются в таблице стилей в формате шестисимвольного шестнадцатеричного представления.
Таблица стилей LESS содержит блоки, ссылающиеся на некоторые предопределенные переменные LESS, как показано в следующем примере.
/* primary buttons */
.btn-primary {
color:@primaryButtonColor;
background-color:@primaryButtonBg;
}
Синтаксис в целом похож на CSS, но в LESS используется уникальное обозначение цветов с префиксом @symbol. Json-файл задает эти переменные.
Например, если colors.json-файл имел следующие значения:
"primary":"#009900",
"primaryContrast":"#ffffff"
По результатам обработки выполняется поиск переменной LESS с именем @primaryButtonBg , которая сопоставляется со свойством JSON с именем primary(в нашем примере это #009900). Таким образом, он выводит правильный CSS:
.btn-primary {
color:#ffffff;
background-color:#009900;
}
Все основные кнопки будут темно-зелеными с белым текстом.
Файл colors.json для служб Reporting Services содержит две основные категории, в которых элементы группируются:
- Интерфейс включает элементы, относящиеся к веб-порталу служб Reporting Services.
- Тема включает элементы, относящиеся к создаваемым мобильным отчетам.
Раздел интерфейса разбит на следующие группировки:
| Раздел | Описание |
|---|---|
| Основной | Цвета кнопок и цвета при наведении указателя мыши. |
| Вторичные | Строка заголовка, панель поиска, меню слева (если отображается) и цвет текста для этих элементов. |
| Нейтральная основная | Фон области домашней страницы и области отчетов. |
| Нейтральная вторичная | Фон текстового поля и свойств папки, а также меню настроек. |
| Нейтральная третичная | Фон параметров сайта. |
| Сообщения об опасности, предупреждения и сообщения | Цвета для этих сообщений. |
| КПЭ | Управляет цветами для хорошего (1), нейтрального (0), нейтрального (-1) и ни одного. |
При первом подключении к серверу с издателем мобильных отчетов с развернутой фирменной символикой тема добавляется в доступные темы, которые можно использовать в правом верхнем меню приложения.
После этого вы сможете использовать тему для любого созданного вами мобильного отчета, даже если он расположен не на том сервере, где развернута тема.
Использование логотипа
Если вы включаете логотип с пакетом фирменной символики, он отображается на веб-портале вместо имени, заданного для веб-портала в меню "Параметры сайта".
Файл с изображением логотипа должен иметь формат PNG. Размеры файлов масштабируются после отправки на сервер. Масштаб должен составлять примерно 290 пикселей x 60 пикселей.
Применение пакета фирменной символики к веб-порталу
Чтобы добавить, скачать или удалить пакет фирменной символики:
Щелкните символ шестеренки в правом верхнем углу.
Выберите Параметры сайта.
Выберите раздел Фирменная символика. На экране показаны следующие элементы:
В настоящее время установленный пакет фирменной символики отображает имя отправленного пакета или отображает none.
При использовании параметра Отправка пакета фирменной символики предлагается выбрать ZIP-файл из локальной папки, а затем применить этот пакет на веб-портале. Это действие выполняется незамедлительно.
Также здесь вы можете загрузить или удалить пакет. После удаления пакета для веб-портала немедленно восстанавливается оформление по умолчанию.
Пример файла metadata.xml
<?xml version="1.0" encoding="utf-8"?>
<SystemResourcePackage xmlns="http://schemas.microsoft.com/sqlserver/reporting/2016/01/systemresourcepackagemetadata"
type="UniversalBrand"
version="2.0.2"
name="Multicolored example brand"
>
<Contents>
<Item key="colors" path="colors.json" />
<Item key="logo" path="logo.png" />
</Contents>
</SystemResourcePackage>
Пример файла colors.json
{
"name":"Multicolored example brand",
"version":"1.0",
"interface":{
"primary":"#b31e1e",
"primaryAlt":"#ca0806",
"primaryAlt2":"#621013",
"primaryAlt3":"#e40000",
"primaryAlt4":"#e14e50",
"primaryContrast":"#fff",
"secondary":"#042200",
"secondaryAlt":"#0f4400",
"secondaryAlt2":"#155500",
"secondaryAlt3":"#217700",
"secondaryContrast":"#49e63c",
"neutralPrimary":"#d8edff",
"neutralPrimaryAlt":"#c9e6ff",
"neutralPrimaryAlt2":"#aedaff",
"neutralPrimaryAlt3":"#88c8ff",
"neutralPrimaryContrast":"#0a2b4c",
"neutralSecondary":"#e9d8eb",
"neutralSecondaryAlt":"#d9badc",
"neutralSecondaryAlt2":"#b06cb5",
"neutralSecondaryAlt3":"#a75bac",
"neutralSecondaryContrast":"#250a26",
"neutralTertiary":"#f79220",
"neutralTertiaryAlt":"#f8a54b",
"neutralTertiaryAlt2":"#facc9b",
"neutralTertiaryAlt3":"#fce3c7",
"neutralTertiaryContrast":"#391d00",
"danger":"#ff0000",
"success":"#00ff00",
"warning":"#ff8800",
"info":"#00ff",
"dangerContrast":"#fff",
"successContrast":"#fff",
"warningContrast":"#fff",
"infoContrast":"#fff",
"kpiGood":"#4fb443",
"kpiBad":"#de061a",
"kpiNeutral":"#d9b42c",
"kpiNone":"#333",
"kpiGoodContrast":"#fff",
"kpiBadContrast":"#fff",
"kpiNeutralContrast":"#fff",
"kpiNoneContrast":"#fff",
"itemTypeIconColor":"#ffffff",
"reportIconBackground":"#12239e",
"excelIconBackground":"#217346",
"folderIconBackground":"#4668c5",
"datasetIconBackground":"#c94f0f",
"otherIconBackground":"#000000",
"primaryButton": "#bb2124",
"primaryButtonHover": "#d31115",
"primaryButtonPressed": "#3d0000",
"link": "#d31115",
"linkHover": "#671215",
"linkVisited": "#3d0000",
"radioButtonCheckBox": "#bb2124",
"radioButtonCheckBoxHover": "#d31115"
},
"theme":{
"dataPoints":[
"#0072c6",
"#f68c1f",
"#269657",
"#dd5900",
"#5b3573",
"#22bdef",
"#b4009e",
"#008274",
"#fdc336",
"#ea3c00",
"#00188f",
"#9f9f9f"
],
"good":"#85ba00",
"bad":"#e90000",
"neutral":"#edb327",
"none":"#333",
"background":"#fff",
"foreground":"#222",
"mapBase":"#00aeef",
"panelBackground":"#f6f6f6",
"panelForeground":"#222",
"panelAccent":"#00aeef",
"tableAccent":"#00aeef",
"altBackground":"#f6f6f6",
"altForeground":"#000",
"altMapBase":"#f68c1f",
"altPanelBackground":"#235378",
"altPanelForeground":"#fff",
"altPanelAccent":"#fdc336",
"altTableAccent":"#fdc336"
}
}
Скачивание примеров пакетов фирменной символики
Загрузите примеры с сайта GitHub Примеры пакетов фирменной символики в локальную папку. Дополнительные сведения см. в статье "Применение пакета фирменной символики к веб-порталу ".
Связанный контент
Есть еще вопросы? Попробуйте запросить форум служб Reporting Services.
Обратная связь
Ожидается в ближайшее время: в течение 2024 года мы постепенно откажемся от GitHub Issues как механизма обратной связи для контента и заменим его новой системой обратной связи. Дополнительные сведения см. в разделе https://aka.ms/ContentUserFeedback.
Отправить и просмотреть отзыв по