個人サイトを作ったら、連絡用にメールフォームを設置したいところです。htmlテンプレートを使っている場合、サイトの雰囲気に合わせてデザインされたメールフォームがついていたりするので、できれば活用したいですね。
メールフォームはHTMLだけでは動作しないため、送信できるようにするにはPHPによるプログラムを用意する必要があります。ですが、複雑なPHPプログラムを自分で書かなくてもメールフォームを動作させるサービスがありますので、以下で紹介します。
PHP工房の「MailForm01」を使う
おそらく、PHPファイルを自力で設置する方法の中で、最も設定が簡単なメールフォームプログラムです。
こちらのサイトからダウンロードできるPHPファイルには、あらかじめ送信に必要なプログラムがすべて書かれており、メールの送り先アドレスや自分のサイトアドレス、追加機能の使用の有無などを書き換えるだけで、設定は完了します。利用も完全に無料です。
メールフォームに嬉しい追加機能もいろいろあり、
- 送信内容確認画面が使える
- 自動返信メールを設定できる
- 入力必須項目を設定できる
- スパム送信防止機能
……などなど、これひとつでかなり機能性・安全性の高いメールフォームが自由に設定できちゃう優れものです。
またデザインの自由度も高く、HTML/CSSが書ければ思い通りにデザインできるのはもちろん、htmlテンプレートに付いているメールフォームの<form action=”○○”>の部分を書き換えるだけで、デモサイトのフォームをそのまま動作させることができます。
ただ、設定方法が簡単とはいえ自分でPHPを書き換える必要があるので「どうしてもphpを触りたくない…」という方には不向きかもです。
また、忍者ホームページやfc2などの一部の無料サーバーでは、PHPが動作しないため使えません。必ずご自分のサーバーがPHPに対応しているか、事前に確認してください。
MailForm01の設置方法
- mail.phpを開き、送り先アドレスなどの必要事項を設定します。
- htmlファイルのメールフォーム部分のはじまりに、
<form method="post" ...中略... >と書かれたところがあるので、action="mail.php"を指定します（<form action="mail.php" method="post" ...>のようになります）。 - メールフォームからテスト送信し、動作確認します。
ざっくりと以上の3ステップで完了します。設定の方法も、本体のPHPファイルに書いてあるためすぐに設定できるはずです。
もっと詳しく知りたい場合やエラーが出てしまった場合は、公式サイトのQ&Aなどをご参照ください。
フォームメーラーを使う
フォームメーラーは、無料から簡単な操作でメールフォームをつくるサービスです。
作成したメールフォームは、フォームメーラーのサーバー上で動作するため、PHPの使えない忍者ホームページやFC2ホームページのサーバーをご利用の方でも設置できます。
メールフォームの利用方法は3通りあり、
- 生成したメールフォームのアドレスに、サイトから外部リンクでつなげる（最も簡単ですが、サイトとデザインを合わせるのは難しいです）
- 生成したメールフォームを、外部サイトとしてiframeで埋め込む（次に簡単な方法ですが、デザインについては同上）
- メールフォームのHTMLを生成し、サイトに貼り付ける（デザインは自由ですが、手間が少しかかります）
詳しい手順はこちらをご参照ください。（公式サイトに飛びます）
HTMLコードを使ってフォームをサイトに埋め込む場合は、デザインは自由にできるもののメールフォームの機能の一部が使えない上に、少々手間が必要になります。具体的には、
- フォームメーラーのクレジットを削除することはできない（削除すると規約違反となり、利用停止になる可能性があります）
- フォームメーラー側で生成されたコードをそのまま貼り付けると、テンプレートのデモサイトのまんまのデザインにならない場合があるので、多少のコード修正が必要になる
- html側の文字コードをShift_JISにする必要がある（無料版だとフォームメーラー側がShift_JISでしか使えず、文字コードを合わせないと送信したメールが文字化けしてしまうため）
ちょっと作業が多くなりますので、「手間をかけてもテンプレートのデザインに合ったフォームを設置したい！」という方向けです。
フォームメーラーの設置方法
公式サイトの解説のとおりに作業すれば設置できます。
HTMLコードをサイトに埋め込む場合で、全くスタイリングされていないようなデザインになってしまったときは、テンプレートについているメールフォームの最初に書かれているformタグに注目してみましょう。
<form class="○○"...>とか、<form id="○○">のように、classやidが指定されている場合、デザインがclassやidによって割り当てられている可能性があります。同じclassやidを、フォームメーラーのformタグに追加してみると、デザインがデモと同じように変わるはずです。
メールフォームのテスト送信で文字化けしてしまう場合は、メールフォームを設置してあるHTMLファイルの<meta charset="○○">の部分を<meta charset="Shift_JIS">に書き換えて文字コードを変更してください。
他にもいろいろなサービスがあります
その他にも、さまざまなサービスがあります。
アンケート的な使い方をするならGoogleフォーム
Googleフォームは、デザインの自由度は低いですが手軽さと機能性が両立できるフォームです。
選択肢のある質問に対する回答の内訳がグラフで表示されたり、メールフォームというよりはアンケートフォーム的な使用感です。
サクサク設置できて、iframeでのサイトへの埋め込みもできるのでおすすめのツールです。
WordPressならNinja Forms一択
WordPressで作ったサイトなら、断然Ninja Formsをオススメします。
ドラッグ＆ドロップで簡単にフォームを作れて、送信まわりの設定も簡単。メールフォームを作るなら最強のプラグインです。
Ninja Forms単体でも機能は十分ですが、有料の追加機能をつけるとさらに機能性・安全性を強化できるため、商業サイトや大型サイトにも使えそうです。
おわりに
メールフォームを設置するのは一見難しそうですが、今はいろいろなサービスがあるので、うまく活用すれば知識がなくても簡単に設置できちゃいます。
ぜひ設置に挑戦して、サイトをランクアップさせてみてください！
