テンプレートエディター

概要

テンプレート編集画面では、PDF 生成に使用するテンプレートの内容を編集できます。HTML コードの編集、変数の設定、リアルタイムプレビューの確認が可能です。また、変更履歴から過去のバージョンを復元することもできます。

画面構成

編集画面は以下の3つのエリアで構成されています。

機能一覧

テンプレート名の編集

1. ツールバー中央の テンプレート名 をクリック
2. 入力欄が表示されるので、新しい名前を入力（最大32文字）
3. 入力欄外をクリックして確定

コードの編集

1. 左パネルの 「コード」 タブを選択
2. コードエディタで HTML を編集
3. 右パネルのプレビューでリアルタイムに結果を確認

変数の設定

PDF 生成時に値を差し込むための変数を設定します。

変数の追加

1. 左パネルの 「変数」 タブを選択
2. 画面下部の 「追加」 ボタンをクリック
3. 新しい変数が追加される（デフォルト名: var1, var2, ...）

変数名の編集

1. 変数一覧から編集したい変数を探す
2. 変数名 入力欄に新しい名前を入力

変数の詳細設定

1. 変数の 「設定」 ボタンをクリック
2. 詳細設定ダイアログが表示される
3. 以下の項目を設定可能

4. 「閉じる」 ボタンでダイアログを閉じる

変数の並び替え

1. 変数左側の ドラッグハンドル（6つの点のアイコン）をクリック＆ホールド
2. 目的の位置までドラッグ
3. ドロップして並び順を確定

変数の削除

1. 削除したい変数の 「設定」 ボタンをクリック
2. 詳細設定ダイアログ下部の 「この変数を削除」 ボタンをクリック

プレビューの確認

右パネルの 「プレビュー」 タブで、編集中のテンプレートのリアルタイムプレビューを確認できます。コードを編集すると自動的にプレビューが更新されます。

変更の保存

1. 編集が完了したら、ツールバー右側の 「保存」 ボタンをクリック
2. 保存が完了すると成功メッセージが表示される

変更履歴の確認と復元

過去のバージョンを確認し、必要に応じて復元できます。

履歴の確認

1. ツールバー右側の 「変更履歴」 ボタンをクリック
2. 変更履歴ダイアログが表示される
3. 右パネルのバージョン一覧から確認したいバージョンをクリック
4. 左パネルで以下のタブを切り替えて内容を確認
   • プレビュー: そのバージョンのプレビュー
   • コード: そのバージョンの HTML コード（読み取り専用）
   • 変数: そのバージョンの変数設定（読み取り専用）

バージョンの復元

1. 復元したいバージョンを選択
2. 「復元」 ボタンをクリック
3. 確認ダイアログで 「復元する」 をクリック
4. 選択したバージョンの内容がエディタに反映される

テンプレート一覧への戻り方

ツールバー左側の 「テンプレート一覧へ戻る」 リンクをクリックすると、テンプレート一覧画面に戻ります。

TIPS