# HTML レポートの作成

HTML レポートには、HTML ファイルと画像ファイルが含まれています。これらのファイルは .zip ファイルとしてユーザーに配信されます。

このチュートリアルでは以下の方法を説明します:

* HTML の作成
* HTML レポートへの画像の埋め込み
* レベルの追加
* ラベルとしてのレベル変数タグの追加

最終レポートでは、3 年ごとにフレームに適切なタイトルと画像が挿入されます。HTML レポートは大部分の Qlik Sense オブジェクトに対応しています。参照先: [Qlik オブジェクトの操作](https://help.qlik.com/ja-JP/nprinting/May2026/Content/NPrinting/ReportsDevelopment/Qlik-objects-supported-NP.htm)



## テスト

サンプル ファイルを使用してレポートを作成できます。これらのファイルをダウンロードするには、次を参照してください: 「[サンプル ファイル](https://help.qlik.com/ja-JP/nprinting/May2026/Content/NPrinting/Examples/Examples.htm)」を参照してください。

## 新規 HTML レポートの作成

以下を実行します。

1. Qlik NPrinting メイン メニューで [レポート] を選択してから、[レポートの作成] をクリックします。

2. レポートに [タイトル] を入力します。

3. [タイプ] ドロップダウン リストから [HTML] を選択します。

4. [アプリ] ドロップダウン リストからアプリを選択します。

5. 利用可能なオプションから [テンプレート] を選択します。

   * テンプレートを使用 - 空のテンプレートを使用する

   * 既定テンプレート - 既定テンプレートを使用する ([レポート設定] で既定テンプレートが設定されている場合にのみ使用可能)。

     「[Office、HTML または PixelPerfect ファイルをテンプレートとして読み込む](https://help.qlik.com/ja-JP/nprinting/May2026/Content/NPrinting/ReportsDevelopment/Load-file-as-template.htm)」を参照

   * カスタム - テンプレートとして使用するファイルを選択する。

6. [作成] をクリックしてレポートを作成します。

### 接続とオブジェクトの選択

以下を実行します。

1. [テンプレートの編集] をクリックして [テンプレート エディター] を開きます。
2. [画像] ノードを右クリックし、[オブジェクトの追加] を選択します。
3. 画像として追加するオブジェクトを選択します。
4. [OK] をクリックします。
5. `<body>` タグと `</body>` タグの間の行に画像オブジェクトをドラッグ アンド ドロップします。
6. [プレビュー] をクリックします。
7. レポートをチェックして閉じ、必要に応じてテンプレートを再度編集します。
8. [保存して閉じる] をクリックしてテンプレートを保存し、[テンプレート エディター] を閉じます。

## 生成されるレポート

```
 <html>
	<body Style="text-align: center;">
		<h3 Style="text-align: center; font: 21px verdana;"> Top 10 countries 		</h3> 			  <img src="%%CH320%%" alt="CH320"> 		<h3 Style="text-align: center; font: 21px verdana;"> Top 10 products 		</h3> 			<img src="%%CH184%%" alt="CH184"> 	</body>
</html>			
```

## [レベルの選択] ウィンドウを開く

各年をサイクルするレベルで HTML レポートを作成できます。

以下を実行します。

1. [レベル] ノードを右クリックし、[レベルの追加] をクリックします。

2. レベル リストから Year を選択します。

3. [OK] をクリックします。

4. [レベル] ノードを展開します。

5. Year\_Level ノード トークンを `<body>` タグと `</body>` タグの間の行にドラッグアンドドロップします。

   必要に応じて行を追加します。

   結果は、`%%Year_Level%%`、`%%/Year_Level%%`、およびこれらの行の間の空白行の、3 つの新しい行です。

6. レベル サイクルに含めたい要素の前に `%%Year_Level%%` 行を移動し、レベル サイクルに含めたい要素の後に `%%Year_Level%%` 行を移動します。

7. `Year_Level` ノードを展開します。

8. Year ノード トークンを `%%Year_Level%%` 行と `%%Year_Level%%` 行の間の行にドラッグ アンド ドロップします。

9. インライン スタイル要素を追加します。下のコード例をご覧ください。

## 生成されるレポート

たとえば、次の HTML コードは対応する HTML レポートを作成します。レポートにはそれぞれの年に対応する 3 つのタイトル付きセクションが作成されます。

```
<html>
	<body Style="text-align: center;">%%Year_Level%% 		<h2 Style="font: 24px verdana;font-weight: bold;">%%Year%%</h2>
			<h3 Style="text-align: center; font: 21px verdana;">Top 10 countries</h3> 			<img src="%%CH320%%" alt="CH320"> 			<h3 Style="text-align: center; font: 21px verdana;">Top 10 Products</h3> <img src="%%CH184%%" alt="CH184"> %%/Year_Level%%  	</body>
</html>
```

### 関連したフロー

* [HTML レポート](https://help.qlik.com/ja-JP/nprinting/May2026/Content/NPrinting/HTMLReports/IntroHTML.htm)

## 詳細を見る

* [HTML レポート](https://help.qlik.com/ja-JP/nprinting/May2026/Content/NPrinting/HTMLReports/IntroHTML.htm)