分享方式:


建立入口網站品牌

適用於: SQL Server 2016 (13.x) Reporting Services 與更新版本 Power BI 報表伺服器

了解如何自訂 SQL Server Reporting Services (SSRS) 或 Power BI 報表伺服器入口網站,使之符合您企業的商標。 使用上傳的品牌套件時,您可以在入口網站上變更色彩、標誌和其他樣式元素。 品牌套件包含三個您封裝為 ZIP 檔案的項目。 下列各節說明品牌套件中的項目,並提供內容範例。

必要條件

  • SQL Server Reporting Services (SSRS) 或 Power BI 報表伺服器已安裝和設定。
  • 存取 Reporting Services 入口網站。
  • 報表伺服器資料庫連線。

建立品牌套件

若要建立品牌套件,可以從頭開始建立檔案或從 GitHub 網站下載範例

如果從頭開始,請先建立每個檔案並在品牌套件中為檔案命名,如下所示:

  • metadata.xml
  • colors.json
  • logo.png (可選檔案)

您可以隨意命名 zip 檔案。

如果選擇使用範例商標套件,請下載 zip 檔案並解壓縮,以便根據需求加以編輯。

定義品牌中繼資料 (metadata.xml)

metadata.xml 檔案會指定品牌套件的名稱,並參考 colors.jsonlogo.png 檔案。

若要變更品牌封裝的名稱,請變更 SystemResourcePackage 項目的 name 屬性。

<?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"
    >
</SystemResourcePackage>

您可以在品牌套件中加入標誌。 此項目包含在 [內容] 元素中

下列範例不包括標誌檔案:

<?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" />
    </Contents>
</SystemResourcePackage>

下列範例包括標誌檔案:

<?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)

colors.json 檔案定義品牌套件的色彩配置。 上傳品牌套件時,伺服器會從此檔案中擷取名稱/值對,並將其與主要的 LESS 樣式表 brand.less 合併。 它會處理樣式表,並將產生的 CSS 檔案提供給用戶端。 樣式表中的所有色彩都會遵循色彩的六個字元的十六進位表示法。

以下是 colors.json 檔案的範例:

{
    "name": "Multicolored example brand",
    "version": "1.0",
    "interface": {
        "primary": "#009900",
        "primaryContrast": "#ffffff",
        "secondary": "#042200",
        "neutralPrimary": "#d8edff",
        "neutralSecondary": "#e9d8eb",
        "danger": "#ff0000",
        "success": "#00ff00",
        "warning": "#ff8800"
    },
    "theme": {
        "dataPoints": ["#0072c6", "#f68c1f", "#269657"],
        "good": "#85ba00",
        "bad": "#e90000",
        "neutral": "#edb327"
    }
}

LESS 變數的作用原理

LESS 樣式表包含參考某些預先定義的 LESS 變數的區塊。 下列範例顯示樣式表如何使用 LESS 變數:

/* primary buttons */
.btn-primary {
    color:@primaryButtonColor;
    background-color:@primaryButtonBg;
}

儘管此語法類似於 CSS,但色彩值 (以 @ 符號作為首碼) 對 LESS 是唯一的。 colors.json 檔案會設定這些變數。

例如,colors.json 檔案可能包含下列值:

"primary":"#009900",
"primaryContrast":"#ffffff"

處理時,LESS 變數將對應至 colors.json 檔案中的對應值。 產生的 CSS 看起來類似以下範例:

.btn-primary {
    color: #ffffff;
    background-color: #009900;
} 

隨後所有主要按鈕都會呈現深綠色以及白色文字。

colors.json 中的物件

colors.json 檔案包含兩個主要物件:

  • 介面:入口網站特有的屬性。
  • 主題:您建立的行動報表的特定屬性。

interface 物件分為以下屬性:

區段​ 描述
Primary 按鈕和暫留色彩。
次要 標題列、搜尋列、左邊功能表 (如果顯示) 及那些項目的文字色彩。
主要中性色彩 首頁和報表區域背景。
次要中性色彩 文字方塊和資料夾選項背景,以及設定功能表。
第三個中性色彩 站台設定背景。
危險/警告/成功訊息 適用於這些訊息的色彩。
KPI 將色彩控制為良好 (1)、中性 (0)、中性 (-1) 和無。

theme 物件分為以下屬性:

區段​ 描述
資料點 圖表和視覺效果中資料點的色彩。
良好/不良/中性 指示狀態的色彩。
背景 整體的背景色彩。
前景 整體的前景色彩。
地圖基底 地圖的基底色彩。
面板的背景/前景/輔色 面板的色彩。
資料表輔色 資料表的輔色。

當您第一次使用已部署品牌套件的行動報表發行工具連線到伺服器時,發行者會將佈景主題新增至可用佈景主題清單。

[選擇調色盤] 對話方塊的螢幕擷取畫面。

接著可針對您建立的任何行動報表使用該佈景主題,即使它們不在您已部署該佈景主題的同一部伺服器上。

使用標誌 (logo.png)

如果您在品牌套件中加入標誌,其會出現在入口網站中,取代您最初為入口網站設定的名稱。

請確定標誌檔案為 PNG 格式。 上傳至伺服器之後檔案維度會調整。 標誌將縮放至大約 290 x 60 像素。

將品牌套件套用至入口網站

  1. 存取入口網站。

  2. 在 Power BI 服務中,選取右上角的齒輪圖示,然後選擇網站設定

    [設定] 清單的螢幕擷取畫面,其中醒目提示 [網站設定] 選項。

  3. 選取 [建立品牌] 。

    [網站設定] 頁面的螢幕擷取畫面,其中醒目提示 [商標] 索引標籤。

    [目前安裝的品牌套件] 會顯示已上傳套件的名稱,或顯示 [無]

  4. 選取 [上傳品牌套件]。 品牌套件會上傳至報表伺服器,入口網站將立即轉譯更新的商標。

下載或移除品牌套件

如果您看到 [目前已安裝的品牌套件] 方塊中所列的品牌套件,可以選擇下載或移除套件。 如果想要調整現有的套件並套用這些變更,可以下載套件。 移除套件時,入口網站會立即重設為預設品牌。 選擇 [下載] 或 [移除],具體視您想要採取的動作而定。

更多問題嗎? 嘗試在 Reporting Services 論壇提問。