書類テンプレートのレイアウトは、HTMLでの編集も可能です。

HTMLタグの編集手順

書類テンプレートのレイアウトをHTMLで編集するには、まず編集画面の上部にある [HTMLタグ表示] アイコンをクリックしてください。

クリックすると、編集画面がHTMLタグ表示に切り替わります。

編集を行った後は、もう一度 [HTMLタグ表示] をクリックして表示を切り替え、画面下部にある [更新] ボタンをクリックすると、保存されます。

表（テーブル）の下にできた空白を埋める

書類テンプレートを作成すると、表（テーブル）の下に空白ができることがあります。

テーブルの下にある空白を埋めるには、テーブルの開始タグ <table> 内を編集してください。

テーブルのスタイルを style="margin-bottm 0;" に書き換えます。

最後に、ツールバーにある [HTMLタグ表示] でテキスト表示に切り替え、画面下部にある [更新] ボタンをクリックします。

更新が完了すると、テーブル下のスペースがなくなります。

テーブルの間にある空白を埋める

書類テンプレートを作成するとき、テーブルとテーブルのあいだに空白ができることがあります。

テーブル間にできた空白を埋めるには、1つ目のテーブルの開始タグに style="margin-bottom: 0px;" を追加します。

次に、今回の例に使用したテンプレートの場合、2つのテーブルタグの間にある <p style="line-height: 1.2;"><span style="font-size: 12px;"><br></span></p> という箇所も削除します。

最後に、ツールバーにある [HTMLタグ表示] でテキスト表示に切り替え、画面下部にある [更新] ボタンをクリックします。

更新が完了すると、テーブル間のスペースがなくなっています。

テーブルの罫線を非表示にする

テーブル内の罫線は削除できません。

非表示にしたい場合は、罫線の色を白に指定してください。

罫線の色を白にするには、HTMLモードに切り替え、罫線を削除したい箇所にある <table> と <td> タグに、 style="border:1px solid #fff;" を挿入します。

最後に、ツールバーにある [HTMLタグ表示] でテキスト表示に切り替え、画面下部にある [更新] ボタンをクリックします。

更新が完了すると、罫線が見えなくなります。

画像の位置を右揃えにする

書類テンプレートに挿入した画像は、デフォルトでは左揃えのレイアウトで表示されます。

画像を右揃えで表示させるには、HTMLを編集する必要があります。

HTMLモードに切り替え、imgタグのスタイル部分を、 style="display: block; margin: auto; margin-right: 0;" に書き換えてください。

ツールバー上部の [HTMLタグ表示] をクリックしてテキスト表示に切り替えた後、画面下部の [更新] をクリックすると、画像が右揃えで表示されます。