Account Engagementのフォームは、簡単に作成できて既存ページにiframeで埋め込むだけで利用できる便利な機能です。しかし、標準デザインのままでは自社サイトのトンマナと合わないことも多く、ユーザーにとって使いやすいフォームとは言い難い場合があります。そこで今回は、お問い合わせいただいた方限定で、無料のCSSレイアウトテンプレート を配布します。さらに、そのテンプレートを活用してフォームを作成・適用する手順もご紹介します。配布テンプレートについて下記のレイアウトテンプレートを無料でご提供します。デフォルトフォームの課題Account Engagementのデフォルトテンプレートを使うと、以下のようなデザインになります。このままではサイトデザインに馴染まず、入力もしづらいケースが多いです。レイアウトテンプレートの設定手順[コンテンツ] → [レイアウトテンプレート] → [追加] でテンプレートを作成します。任意の「名前」「フォルダー」を設定します。ダウンロードした form_template.txt を開き、「レイアウト」タブにコピー&ペーストします。「デフォルトのCSSスタイルシートを含める（推奨）」のチェックを外します。保存すればレイアウトテンプレートの作成は完了です。フォーム作成手順名前[コンテンツ] → [フォーム] → [フォームを追加] でフォームを作成します。名前やフォルダーを任意の内容で設定し、次に進みます。項目フォームの項目は下記のラベルを作成してください。※ ()内はプロスペクト名会社名（Company）姓（Last Name）名（First Name）部署（Company）役職（Job Title）メール（Email）ラベルごとの編集マークを選択し、 [基本]タブでプロスペクト名はそれぞれ上記()内のラベルを選択、種別はすべて［テキスト］を選択します。必須項目にする場合は、［必須］のボックスにチェックを入れます。ラベルごとの編集マークを選択し、 [詳細]タブでクラス名が設定できます。ここで姓のCSSクラスに”col-left”、名のCSSクラスに”col-right”と入力します。こうすることで画面幅が広い時には姓名の入力欄は横並びになり、スマホなど画面幅が狭くなると自動で縦並びになります。デザインフォームとレイアウトは別管理のため、作成したフォームに先ほどのテンプレートを設定します。これで、オリジナルデザインのフォームが完成です。フォーム確認[マーケティング] → [フォーム] からレイアウトテンプレートを適用したフォームを選び、［オンラインで表示］からブラウザで表示確認が可能です。まとめCSSを一からカスタマイズするのは手間がかかりますが、今回のテンプレートを使えば簡単にデザイン性の高いフォームを導入できます。テンプレートをご希望の方は、下記のお問い合わせフォームからお気軽にご連絡ください。