範例 - 使用內嵌 HTML 範本建立電子郵件報告
在此範例中，您會將 HTML 報告範本直接內嵌於電子郵件訊息中，以建立並傳送報告。
您將在此範例中建立的電子郵件報告。
要求
-
為 Qlik Cloud 租戶設定的電子郵件提供者。請參閱： 設定報告和通知的電子郵件
-
Private Analytics Content Creator 安全性角色，或在共用空間中足以用於報告開發的空間角色。請參閱： 權限
步驟 1：上傳範例來源
請參閱此處的範例應用程式來源：範例材料 - 應用程式內報告。將應用程式和資料檔案上傳到空間，然後重新載入應用程式。您已準備好完成該範例。
步驟 2：開發範本
建立新範本
請執行下列動作：
-
在您的應用程式中，使用導覽列中的下拉式功能表並選取報告。
-
切換到範本索引標籤。
-
在右上角按一下新建 > HTML 範本。
-
輸入範本的名稱。
就會開啟 HTML 設計工具。
新增表格式資料
接下來，將表格式資料新增至範本。
請執行下列動作：
-
按一下物件面板中的
。 -
按一下新增表格。就會顯示可用工作表清單。
-
展開 Sales Tables 工作表。
-
按一下 Yearly Regional Sales 圖表旁邊的
圖示。 -
在下拉式功能表中，選取個別欄。
-
在選取要新增的欄之下，選取全部。按一下新增。
圖表作為表格結構新增至範本中。
-
選取新的表格後，在物件面板中變更表格的以下屬性：
-
在表格設定之下，關閉保留來源格式。
-
將顯示標頭切換為隱藏。
-
-
在表格中，在現有的列定義上方新增列。在包含 <tbody><tr> 的行下方新增行。貼上以下內容：
<th>Order year</th> <th>Region</th> <th>Sales</th> </tr> <tr>
設定表格樣式
接下來，在 HTML head 中新增樣式定義以及在 table 結構本身中新增內嵌樣式，以設定表格元素的樣式。
請執行下列動作：
-
在範本的 title 定義下方新增行。
-
貼上以下內容：
<style>html { font-family: sans-serif } table { border: 2px solid #000000 } tr, th, td { border: 1px solid #000000 } th { font-size: large } td { font-size: medium }</style> -
在 table 結構中找到定義資料的行。看起來應該如下所示：
<td>%%OrderYear%%</td><td>%%Region%%</td><td>%%Sales%%</td> -
將 style="text-align: center" 新增至第一個 td 元素的開頭標記。整行現在看起來應該如下所示：
<td style="text-align: center">%%OrderYear%%</td><td>%%Region%%</td><td>%%Sales%%</td>這會讓第一欄的文字置中對齊。
新增動態標題
接下來，建立運算式，以儲存銷售年份範圍的計算結果。然後，將此運算式合併到報告標題中，以便內嵌為電子郵件主旨。
請執行下列動作：
-
按一下物件面板中的
。 -
按一下新增運算式。
-
在名稱欄位中，輸入 YearRange。
-
在運算式欄位中，貼上下列運算式：
= min(OrderYear)& ' - ' & max(OrderYear) -
按一下建立。
-
在設計介面上，尋找 title 元素。將整行替換為以下內容：
<title>Sales Report: </title> -
在剛剛貼上的行上，將游標放在 Sales Report: 之後
-
在物件面板中，按一下新增運算式標記。
-
該行現在應該是：
<title>Sales Report: %YearRange%%</title>
新增開場白和結束語
接下來，新增稱呼和開場白，並以結束語結束報告。
請執行下列動作：
-
在開始 body 標記下方新增一行。
-
貼上以下內容：
<p>Hello,</p> <p>The table below outlines regional sales details for the requested years.</p> -
在包含表格結束標記的行下方新增一行。
-
貼上以下內容：
<p>Regards,</p> <p>- Management</p>
儲存並完成工作
按一下儲存範本以儲存您的工作。完成的範本程式碼應如下所示。
<html><head>
<title>Sales Report: %%YearRange%%</title>
<style>html { font-family: sans-serif }
table { border: 2px solid #000000 }
tr, th, td { border: 1px solid #000000 }
th { font-size: large }
td { font-size: medium }</style>
</head>
<body>
<p>Hello,</p>
<p>The table below outlines regional sales details for the requested years.</p>
<table cellspacing="0" style="border-collapse: collapse">
<tbody><tr>
<th>Order year</th>
<th>Region</th>
<th>Sales</th>
</tr>
<tr>
<td style="text-align: center">%%OrderYear%%</td><td>%%Region%%</td><td>%%Sales%%</td></tr>
</tbody></table>
<p>Regards,</p>
<p>- Management</p>
</body></html>步驟 3：新增發佈清單
在應用程式的報告區段中的收件者或群組索引標籤之下新增發佈清單檔案。確保已透過電子郵件將您新增為收件者，而且發佈清單不包含任何篩選條件或群組。
如需關於發佈清單的資訊，請參閱 建立報告的發佈清單。
步驟 4：建立報告任務
請執行下列動作：
-
在應用程式的報告區段開啟報告任務索引標籤。
-
按一下建立報告任務。就會開啟報告任務對話方塊。
-
為報告任務輸入標題。
-
也可以選擇新增說明。
在範本對話方塊索引標籤中，按一下新增現有範本。選取您上面開發的範本。
-
按一下下一步。對話方塊移動至輸出索引標籤。
-
在輸出對話方塊索引標籤中，為報告輸出輸入檔案名稱。
-
按一下下一步以繼續前往發佈對話方塊索引標籤。
-
將您自己新增為報告輸出的收件者。
-
在電子郵件之下，選取 HTML 報告。這會將報告內嵌於電子郵件訊息中，而不是作為檔案附加。
-
按一下下一步以繼續前往排程對話方塊索引標籤。
-
選取預設排程設定並按一下儲存。
步驟 5：傳送報告
請執行下列動作：
-
繼續留在應用程式的報告區段中的報告任務索引標籤。
-
按一下新報告任務旁的
。 -
按一下
立即傳送。
收到電子郵件後，開啟即可查看結果。
產生的電子郵件報告