【Volar2】の動作検証でキャプチャした画像は、基本的には【Volar2】の開発ベースになってる「ベーステンプレート」のレイアウトデザインが元になってます。
そのため他のテンプレート利用時には当サイトでご紹介しているキャプチャ画像とは若干異なる場合もあります。
また他のテンプレート利用時には場合によっては動作に多少の違いが生じる可能性もありますこと予めご了承ください。
パーツ＜問い合わせフォーム＞は、通常なら面倒な手続きを経ないと設置が難しい”お問い合わせフォーム”をメールアドレスを設定するだけでサイト内に設置できる便利機能です。
自動返信メールの設定もできたりするので、お問合せフォームが必須の企業系サイトなどでのSIRIUS2活用も増えるのではないでしょうか。
SIRIUS2アップデートver.16にて『追加項目』の設定が追加されたのと画面の内容が若干変更になっていたので当ページの内容も多少書き換えました。
なお問い合わせフォーム機能は1サイトにつき1つのみの設置しかできません。
設定画面（メール設定）
先に”メールアドレスの設定だけで設置できる”と書きました。
それは本当ですが、実際にはあなたのサイトに合わせた文言等に変更したり表示項目の選択などチェックすべきところはいろいろあります。
それでは実際の手順を見ていきます。
＜問い合わせフォーム＞機能を使うにはサイトURLの設定が必須なので、必ず事前に「サイト全体設定」でサイトURLを設定しておく必要があります。
＜問い合わせフォーム＞の設定画面は、
【パーツ】→＜問い合わせフォーム＞→【問い合わせフォームの設定】
から開けます。
送信者情報
『問い合わせフォームの設定』を開くと下のような画面が立ち上がります。
この画面（タブ「入力画面」）はほかのタブ「確認画面」「送信画面」と共に完成形のプレビューエリアみたいなもので、このあと文言などをカスタマイズしていくに伴ってこの画面の内容も変わります。
（※デフォルトの設定が既にSIRIUS2側で設定済み）
最初に最上部左端の「メール設定」をクリックします。
すると「送信者情報」の設定画面が立ち上がります。
縮小版
- ①メールアドレス
-
問い合わせメールを受信したり、自動返信メールの送信時に使われるメールアドレスを設定しておきます。
（※自動返信メールはデフォルトではOFFになってます）
- ②送信者名
-
ここで設定した名前が自動返信メールに記載されます。
- ③CC設定
-
自動返信メール送信時にここに入力したメールアドレスにも自動返信メールが送信されます。
C.C.なのでここに入力したメールアドレスは返信先の相手にもわかってしまいます。
（※複数のメールアドレスを設定する場合は改行しながら入力）
- ④BCC設定
-
自動返信メール送信時にここに入力したメールアドレスにも自動返信メールが送信されますが、B.C.C.なので返信先の相手には伏せられた状態になります。
通常はこちらを使うでしょうね。「他にも転送しといたよ～」なんてわざわざ知らせる必要はないでしょうから。
- ⑤件名
-
問い合わせメールを受け付けると自分のところ（or 担当者）にメールが届きますが、そのメールの件名です。
「（※サイト名）から問い合わせが入ってるよ～」でもなんでもいいので、わかりやすい件名にしておくと目につきやすいかもです。
- ⑥メール本文
-
問い合わせメールの内容がここに表示されます。
『%%%◯◯%%%』は自動変換タグなのでここは変更不可です。
それ以外のテキストは基本的には変更可です。
ちなみに「%%%日時%%%」であれば問い合わせの受付日時が自動で記載されます。
ただし返信する際に（デフォルトでは）引用という形で表示されるので、丁寧な文章のままにしておいた方が無難です。
自動返信メール
『自動返信メール』をクリックすると下のような設定画面に切り替わります。
この機能を有効にしたい場合は最上段の「自動返信メール」をクリックしてONに変更します。
ONになると下の設定画面の編集ができるようになります。
筆者
こちらも基本的にはテキスト部分だけの変更になります。
企業サイトではなく個人運営のサイトであれば自動返信メールはスパム対策用にもOFFのままにしておいた方がいいかもしれません。
設定画面（フォーム設定）
タブ『フォーム設定』をクリックすると「入力画面の設定」用画面が開きます。
入力画面の設定
縮小版
- ①基本設定（フォームタイトル）
-
上の①のところに表示されるテキストです。
デフォルトで「お問合せフォーム」が設定されています。
あとで紹介しますがここを空欄にして④フリーテキストで変えることもできます。
筆者
『列数』のところはよくわかりません。
- ②注意事項
-
フォーム下部②の位置に表示されるテキストです。
もちろん変更可です。
- ③個人情報の取り扱い
-
設定済みの③リンクタグをクリックすると”モーダルウィンドウ”で個人情報の取り扱いに関するテキストが表示されます。
このテキストそのものを表示したくない場合は空欄にします。
- ④フリーテキスト
-
デフォルトではOFFになってますが、ONにするとフォーム上部に任意のテキストを表示できます。
下のサンプルは①のフォームタイトルを非表示にしてフリーテキストだけを有効にしたものです。
（HTMLタグも使えるようです）
最初の入力画面に戻ると修正した設定が反映されてるのが確認できます。
最後に必ず「保存」をクリックして修正を確定させておきます。
確認画面の設定
送信ボタンをクリックした後に表示される確認画面の設定になります。
①でタイトルが変更できます。空欄も可。
②のチェックをONにすると先ほどのフリーテキストと同じ扱いで別に設定したテキストも表示できます。
送信画面の設定
送信後に表示される画面の設定になります。
②「テキストの設定」をOFFにすれば②のテキストは非表示になります。
（表示させておいた方が親切かも）
「確認画面」も「送信画面」も最初の入力画面に戻ると修正した設定が反映されてるので、最終的なチェックはそこで確認できます。
最後に必ず「保存」をクリックして修正を確定させておきます。
フォーム追加項目
こちらはSIRIUS2アップデートver.16にて追加された項目で、電話番号や住所、選択項目など好きな項目を自由に追加できます。
『新規追加』をクリックすると入力画面が立ち上がります。
タイプには追加項目のタイプ（型）を指定します。
右端の三角をクリックするといくつもの選択肢が表示されるので具体的に見ていきます。
電話番号
整数での入力可能なテキストボックスが表示されます。
項目名には「電話番号」と入力してみます。
とりあえずこれでOKをクリックすると【フォーム追加項目】に”電話番号”が登録されます。
これで一度入力画面を確認してみると、ちゃんと電話番号登録欄が追加されてます。
住所
郵便番号と住所を入力可能なテキストボックスが表示されます。
項目名には「住所」と入力し、必須項目もONにしてみます。
日付
年月日（YYYY/MM/DD）形式で日付を表示（設定）できます。
項目名には「お受取り希望日」と入力してみます。
1行テキスト
任意の文字列を入力可能な1行のテキストボックスが表示されます。
複数行テキスト
任意の文字列を入力可能な複数行のテキストボックスが表示されます。
項目名には「備考欄」と入力してみます。
選択項目（ラジオボタン）
複数の選択肢の中から1個だけ選択可能なタイプ。選択肢は最初から全表示。
項目名には「ご希望の商品」と入力してみます。
タイプが「選択項目」に関しては『項目の値』欄が入力可能な状態になるので、選択肢を入力していきます。
選択項目（セレクトボックス）
複数の選択肢の中から1個だけ選択可能なタイプ。
選択肢は最初の1個だけ表示で残りはプルダウンで全表示。
選択項目（チェックボックス）
複数の選択肢の中から好きなだけ選択可能なタイプ。
選択肢は最初から全表示。
追加した項目は「編集・削除・表示順」などの調整もできます。
設定画面（プライバシーポリシー設定）
プライバシーポリシーに関する記述の設定です。
基本的には修正する箇所はないかと思います。
問い合わせフォームの設置
問い合わせフォームの修正が完了したら、表示したいエントリーページを開き、【パーツ】→＜問い合わせフォーム＞→【問い合わせフォームタグの挿入】をクリックします。
専用の独自タグ[% contactForm %]が挿入されて完了です。
送信テスト
お問合せフォームの設置が完了したら必ず送信テストをやっておきます。
実際のお問合せページで適当に入力して送信を完了させて設定したメールアドレスまでちゃんと届けばOKです。
送信テストはプレビュー画面ではできません。
アップロードした実際のページでテストする必要があります。
項目の表示順を変える
＜問い合わせフォーム＞の項目の表示順は固定になってます。それでもデフォルト設定でのフォーム作成なら違和感は全くありません。
でも『追加項目』で項目を足していった場合、項目の内容によっては表示位置を変えたいケースも出てくるかもしれません。
というのも『追加項目』で追加された各項目は［メールアドレス］と［問い合わせ内容］の間に表示される仕様になってるみたいだからです。
そのため仮に”この項目は［問い合わせ内容］の後ろに表示させたい”と思っても変えることはできません。
（位置変更用の設定がないようです）
ですが、スタイルシートに特定の記述を加筆すれば『追加項目』だけでなく、全項目の表示順を自在に変更できるようになります。
詳しくはこちらに書いておきましたので興味のある方はご一読ください。
『問い合わせフォーム』の関連記事
-
SIRIUS2の＜画像レイアウト＞についての詳細ページ。 -
SIRIUS2の＜画像ギャラリー＞についての詳細ページ。 -
SIRIUS2の＜画像スライダー＞についての詳細ページ。 -
SIRIUS2の＜タブコンテンツ＞についての詳細ページ。 -
SIRIUS2の＜フローチャート＞についての詳細ページ。 -
SIRIUS2の＜アイテム比較＞についての詳細ページ。 -
SIRIUS2の＜CTA＞機能についての詳細ページ。 -
SIRIUS2の＜リンクカード＞についての詳細ページ。