自社のホームページに問い合わせフォームを作成したい

ホームページを作成する際にデザイン以外で考えなくてはならないのが、お問い合わせフォームではないでしょうか。プログラミングの知識があれば比較的簡単に作成可能ですが、自分で何とかしなければならず困っていらっしゃる方もいるかと思います。そこで、利用すると便利なのが、Microsoft365の中にあるFormsというサービスです。これを使用して、お問い合わせフォームを作成することが出来ます。

フォームのデザイン

まずはフォームのデザインをします。Microsoft Formsを開いて「新しいフォーム」をクリックします。

次「新規追加」をクリックして項目を追加していきます。

「選択肢」「テキスト」「評価」「日付」の中から入力項目を選べます。

次に「スタイル」をクリックします。背景を変更するために「カスタマイズしたテーマ」のアイコンをクリックします。

次に「画像のアップロード」のアイコンをクリックしてください。

「アップロード」をクリックします。

Formsでは初期状態で背景画像が設定されていますが、これをリセットするために模様のない画像を用意する必要があります。下記はペイントで無地の正方形の画像を用意したところです。これを保存して背景に読み込んでください。

今回作成した問い合わせフォームを以下に示します。

WEBページへのコードの埋め込み

では、これを自社のホームページに埋め込んでいきます。サンプルとして以下のようなホームページを用意しました。

Formsの画面で画面右上の「回答を収集」をクリックします。

「すべてのユーザーが回答可能」をチェックして、外部の人問い合わせフォームに入力できるようにします。そして「埋め込み」のアイコンをクリックし、表示されたHTMLを「コピー」します。

コピーしたHTMLを先ほど用意したホームページに設置してみましょう。少しHTMLを修正して幅と高さをスクロールバーが表示されないように調整します。

<iframe width=”1000px” height=”1800px”

以下のような問い合わせフォームが設置できました。色味はホームページのテーマカラーに合わせて調整したがよさそうです。

以上で、問い合わせフォームを設置できました。如何でしたでしょうか。皆様のご参考になれば幸いです。