Webの記録

無料で高機能なメールフォーム「メールフォームプロCGI」を設置してみた

投稿日:2013年6月4日 更新日:

この記事は約 7 分で読めます。

mailformpro

通常の静的なWebサイトにお問い合せフォームをつける時、自分でCGIを用意しないといけない場合、いろいろ探すのに大変でした。。。

無料でなら尚更・・・で、広告とか入っていたり、いろいろ制約があったり・・・で、困り果てた時に出会ったのがSYNCKGRAPHICAさんのメールフォームCGIでした。(もう数年前になりますけど・・・。)

無料で、しかも商用利用可能!htmlを自由にいじれるから、自分が制作しているWebサイトの中で十分に活用出来ます!!

最近になって、ようやく「メールフォームプロCGI」の方の設置を試す事が出来たので、そのメモも兼ねてここに記録を残します。



動作環境・仕様など

動作環境
  • サーバーでPerl、sendmailもしくはpostfixが使えること
  • Jcodeモジュールが使えること


仕様

機能盛りだくさんで、私にはまだまだ使いきれてない機能だらけです。。。

サーバーの仕様などがあるので、少々修正が必要ですが・・・それ以外はほぼアップロードするだけで、すぐにメールフォームが使用出来ます。
もちろん、htmlは必要に応じていじる必要はありますが・・・。

仕様などの確認・ダウンロードは以下のサイトでお願いします。
【SYNCKGRAPHICA様「メールフォームプロ」】http://www.synck.com/contents/download/cgi-perl/mailformpro.html

簡単な設置方法のメモ

  1. ダウンロードした「メールフォームプロ」を解凍する
  2. テキストエディタで「meilformpro」フォルダの中の「send.cgi」と「check.cgi」を開いて、1行目のperlのパスを確認・書き換える
  3. 「meilformpro」フォルダの中の「config.cgi」をテキストエディタで開いて、自分のメールアドレスと署名を書き換える
  4. ftpソフトでアップロード。パーミッションをサーバーの仕様に合わせて変更する
  5. アップした中の「check.cgi」にアクセスしてみる。表示されたら、修正すべき箇所を指摘してくれるので、それを見ながら修正する
  6. 「check.cgi」の修正箇所がなくなったら、html(example.html等)にアクセスして動作確認をする
  7. 「thanks.html」が無事に表示され、メール送信がうまく出来たら完了!!


1.ダウンロードした「メールフォームプロ」を解凍する

【SYNCKGRAPHICA様「メールフォームプロ」】http://www.synck.com/contents/download/cgi-perl/mailformpro.htmlでダウンロードして、ファイルを解凍してください。まずはここから!


2.テキストエディタで「meilformpro」フォルダの中の「send.cgi」と「check.cgi」を開いて、1行目のperlのパスを確認・書き換える
//1行目の以下の分のパスをサーバーの指定するパスに変更する。(ロリポップはそのままイケます)
#!/usr/bin/perl


3.「meilformpro」フォルダの中の「config.cgi」をテキストエディタで開いて、自分のメールアドレスと署名を書き換える

「config.cgi」の中で、お問い合せを受けるメールの設定をします。
ひとつの時は30行目の#を消して”の中に自分のメールアドレスを入れます。
複数の場合は、32行目の#を消して、必要なメールアドレスを入力します。

//「config.cgi」の28行目~32行目に以下のような部分があります。
##フォームからの送信先 設定したほうの先頭の#を削除してください
# ひとつの場合 
#@mailto = ('xxxxx@example.jp');
# 複数の場合 (シングルクォートでくくったメールアドレスをカンマで区切って指定)
#@mailto = ('xxxxx@example.jp','yyyyy@example.jp');

43~44行目の以下の差出人名を変更します。

##フォームの差出人名
$config{"fromname"} = 'SYNCK GRAPHICA';

107~113行目と、137~143行目、239~245行目の以下の署名を書き換えます。

━━━━━━━━━━━━━━━━━━━━━━━━━━
 ※この署名はサンプルです。必ず変更してください※ 
 シンクグラフィカ / SYNCKGRAPHICA
 〒003-0801 札幌市白石区菊水一条四丁目一番三十九号
 TEL / 011-832-8698 FAX / 011-832-8698
 http://www.synck.com
━━━━━━━━━━━━━━━━━━━━━━━━━━


4.ftpソフトでアップロード。パーミッションをサーバーの仕様に合わせて変更する

ftpソフトでドンっとアップロードしてみます。パーミッションは、サーバーの仕様とメールフォームプロのマニュアル(ダウンロードしたサイトの中にある)を確認しながら変更してください。

ちなみに、私はftpソフトは「FileZilla」を使ってます♪


5.アップした中の「check.cgi」にアクセスしてみる。表示されたら、修正すべき箇所を指摘してくれるので、それを見ながら修正する

check.cgiを動作したイメージ

「check.cgi」にアクセスして、ちゃんと作動するといろいろ修正すべき箇所を指摘した上記の画像のような画面が出ます。

「パスが違う」という最後の警告は、パスが正しくても出てくることがあるみたい。ちゃんと確認してOKだったら、この警告は気にしなくて良さそうです。

500エラーは、大抵perlのパスが違っているかパーミッションの間違いが多いみたいです。←私は、ココに時間かかってしまいました。。。


6.「check.cgi」の修正箇所がなくなったら、html(example.html等)にアクセスして動作確認をする

exsample.htmlを表示したイメージ

動作テストなので、そのまま「exsample.html」を使用して実際にお問い合せ入力してみました。

確認画面のイメージ

入力の後に上記のような確認画面が出ました♪

動くかどうか・・・神様に祈りを捧げ、世界平和を願います。そしてこのCGIを制作してくださった和田様にも感謝の念を送ります。。。。


7.「thanks.html」が無事に表示され、メール送信がうまく出来たら完了!!

thankyou画面のイメージ

動作テストなので、そのまま「thanks.html」を使用したので、送信完了の画面イメージは上記の画像となります。

祈りが通じ、無事にメールも受信出来ました!
「お問い合せありがとうございます」メールの下の署名部分は、「html.mail.cgi」の36~39行目をいじります。

	<div style="width: 100%;border-top: solid 1px #CCC;padding: 15px 0px;">
		<h2 style="font-size: 1.6em;margin: 0px;padding: 0px;"><span style="display: block;font-size: 0.4em;letter-spacing: 1.0em;color: #999;">シンクグラフィカ</span>SYNCK GRAPHICA</h2>
		<p><a href="http://www.synck.com">www.synck.com</a></p>
	</div>


ここまでで、メールフォームが使える状態になったと思います。あとは、デザインの変更やお問い合せ項目の変更など・・・htmlをいじって完了です!!

設置に関して何か困った事があった時は、制作された方がサポートセンターを設置してくださっているので、ここでいろんな事例を見ることが出来ます。自己解決が出来ない場合は書き込みして質問することになります。


本当に高機能なのに無料で商用利用可能!なのには、脱帽です!!

たまに静的サイトを作る時に利用させて頂いてます。毎回設置方法を忘れてしまうので、ここに記録を残しました。

バージョンが時々上がるので、利用する時にダウンロードを毎回した方が良さそうです。(それだけ機能アップされていくのが、また凄いです!!)

最後に、製作者の和田様に感謝です!!


関連かもしれない記事

-Webの記録
-, , ,

執筆者:


comment

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です

This blog is kept spam free by WP-SpamFree.

このサイトはスパムを低減するために Akismet を使っています。コメントデータの処理方法の詳細はこちらをご覧ください

関連記事

no image

【jQuery】PCとiPhone,iPad,Androidを判別してページを切り替え(リダイレクト)したいとき

この記事は約 2 分で読めます。 以前はPCだけを意識してWebサイトを制作してきました。 しかし、最近はだんたんとPC以外(iPhone,iPad,Android)のタブレット系端末のアクセスが増え …

no image

WordPressテンプレートタグをメモ【コンテンツ編】

この記事は約 1 分で読めます。WordPressにはたくさんのテンプレートタグがあります。 似たようなものや、同じ結果なのに記述の仕方が何通りもあったりするので、後で「何だっけ?」って思う事もしばし …

no image

Yahoo!アクセス解析を設定してみました!

この記事は約 1 分で読めます。 2013年10月30日にリリースされた「Yahoo!アクセス解析」。 まだまだリリースされて日が浅いのでGoogle Analyticsほどの資料が見つからないのです …

no image

WordPress お問い合せフォームプラグイン「Trust Form」を試してみた♪

この記事は約 1 分で読めます。 今回は、WordPressのお問い合せフォーム用プラグイン「Trust Form」を試してみました。 ・・・と言っても、まだローカル環境でのテスト操作なので全ての実験 …

no image

IE6で透過pngを表示してみました♪

この記事は約 1 分で読めます。IE6対策をいつまですれば良いのかなぁというところですが、まだもう少しIE6を意識してサイトを作ってます。 今回は、IE6ではキレイに表示されない透過pngをキレイに表 …