メールフォームを使おう！

2024年11月26日 11:13

このページではerlaのメールフォーム機能の使い方、別ページへの埋め込み方法、ページごとにフォームの項目を分ける方法を説明します。

メールフォームの使い方

erlaではデフォルトでメールフォーム機能が作成されています。作成できるのは一つまでです。メールフォームをトップページに設定することもできますので、各自カスタマイズして使用してください。

1.メールフォームのデザインを決める。テンプレートを使用すると簡単です。
2.メールフォームに表示させる項目を「項目設定」から作成する
※HTMLで項目を作ることはできませんので、必ず項目設定から項目を作成してください
3.メールフォームの稼働確認をする。通知メールがご登録のメールアドレスに届きます。
※全体設定から通知を停止していない場合のみ

項目設定
メールフォームに表示させる項目を設定することができます
項目を作成：項目作成画面に遷移します。
フィールド名：項目名を設定できます。（未入力での登録はできません）
項目タイプ：どのようなタイプの項目にするかを設定できます。
選択肢：項目タイプで[チェックボックス] or [プルダウン] or [ラジオボタン]のどれかを選択した際に、ここで選択肢を設定できます。
入力必須チェック：必須項目にしたい場合には「必須」を選択してください。
入力チェック：チェックしない、URLチェック、メールアドレスチェックができます。

ページ編集
ページのレイアウトなどの編集ができます。以下の通りテキストエリアにHTMLなどを入力してください。
ページ上部表示：メールフォーム画面の上部に表示される部分です。
ページ下部表示：メールフォーム画面の下部に表示される部分です。メールフォームを<div>~</div>などで囲みたい場合は、ページ上部の最後に<div>、ページ下部の最初に</div>と入力してください。
確認ページ上部：入力内容の確認ページのフォーム上部に表示される部分です。
確認ページ下部：入力内容の確認ページのフォーム下部に表示される部分です。確認用フォームを<div>~</div>などで囲みたい場合は、確認ページ上部の最後に<div>、確認ページ下部の最初に</div>と入力してください。
送信完了ページ：送信完了ページに表示されます。

HEAD間編集
ページの<head>~</head>内に挿入されます。CSSなどを入力してください。

【項目名を改行させたい】
以下のCSSを記述してください。

label{
display: block;
}

【各項目ごとにCSSを適用させたい】
以下のセレクタにCSSで装飾してください。

項目名：label
自由記述（一行）：input type="text"
自由記述（複数行）：textarea
チェックボックス：input type="checkbox"
ラジオボタン：input type="radio"
プルダウン：selectおよびoption

【不快なメッセージが届いた！】
メッセージ表示画面にブロック用のボタンを設置しています。
ブロック理由を入力後、「ブロックする」のボタンを押していただくと、メッセージの送信元をブロックすることができます。
ブロックされると、ブロックされた送信元はサイトは見れず、erlaのトップページにリダイレクトされます。
ブロックを解除したい場合は、[全体設定]のブロック一覧のページから解除が可能です。

別ページへの埋め込み方法

メールフォームをフリーページなどへ埋め込む方法を紹介します。
この作業にはパソコンが必要です。また、サポートは一切行いませんので、各自判断のもと、作業をしてください。
確認ページ、送信完了ページは1つしか設定できません。どのページからメールを送信しても同じページが表示されます。

1.項目設定からメールフォームの項目を作成します

2.「ページを見る」から公開ページを確認し、右クリック→ページのソースを確認をクリック。<form>~</form>をフリーページなどにコピペする。

3.#csrf#に書き換える。
<input type="hidden" name="_token" value="英数字">の部分を#csrf#に書き換えてください。

4.稼働テストをする。
確認ページ→送信完了ページ→メールフォームメール一覧の順に確認し、通知メールを受信しているか確認してください。

ページごとにフォームの項目を分ける

本来であればメールフォームは一つしか設置できませんが、HTMLをカスタマイズすることで別の項目を表示させたメールフォームを設置することができます。メール一覧は共通となりますのでご注意ください。
別ページへの埋め込み方法の続きから操作します。

1.項目を追加する。
この時、ページA用項目は絶対に削除しないでください。後でHTMLを編集します。削除するとメール送信時にエラーが起こり、フォームが作動しません。