「全てのページにコメントフォーム」の改造

2018/03/27

オートリンク機能を追加、削除確認ダイアログの位置ずれ解消

2017/02/01

コチラのサイトで「全てのページにコメントフォーム」を設置できるツールがダウンロードできる。CMSやブログには大抵備わっているお決まりの機能だが、普通のHTMLページに数行コードを書き加えるだけで実現できるのでとても便利そうだ。

うまくいくと、必要なファイルをアップロードして、設置したいHTMLに、

<link rel="stylesheet" href="commentform/commentform.css" type="text/css">

<div id="commentBox"></div>
<script type="text/javascript" src="commentform/commentform.js"></script>

というコードを加える。たったこれだけで作れてしまう。しかし、utf8版をダウンロードして設置してみたら、う〜っ、いきなり文字化け。自分はphpはほとんど分からないので、あきらめかけていたのだが勘でなんとか解消できた (^^;

このツールのもう一つ残念なところは、せっかくページにコメントを投稿してもらえるのに、投稿があったことを知らせるメール通知機能がない点だ。このままではコメントがあっても気づかなかったり、質問に対する回答のタイミングを失してしまう可能性がある。これもなんとか機能を追加することができた。その他にも少々気になるところがあったので改造した。

sample

気が向いたらダウンロードして、設置してみてください。設置方法はreadme.txtに書いています。

Download:commentform_modified.zip（phpのバージョンによって一部の関数が機能しない場合があるようです）

以下は改造した内容です。仕組みについて興味のない方はスルーしてください。

utf8版の文字化け解消

/*$value = mb_convert_encoding($value, "UTF-8", "EUC-JP");*/

スクリプトやcssを任意のフォルダにまとめる

インストール方法を読むと、上の３つのファイルはルート直下に置くことになっている。ログはルート直下の指定したフォルダの中に蓄積されるが、もしこのフォルダが存在しないと自動で作成してくれるようになっている。しかしそのためにはルートのパーミッションを777にしておかなければならない。これは気持ち悪い。というわけで、３つのファイルをどこかのフォルダーにまとめ、そのフォルダの中にさらにログ・ファイルを蓄積するフォルダを作成したい。３つのファイルをルート直下でなく/commentform/というフォルダにまとめることにした。

したがってフォームを設置するページにはオリジナルと違って下のようなコードを追加することになる。

<link rel="stylesheet" href="/commentform/commentform.css" type="text/css">

<div id="commentBox"></div>
<script type="text/javascript" src="/commentform/commentform.js"></script>

改造は下の事項について書き換えた。

commentform.php、
commentform.js、
設置するHTMLなどの中の
/commentform.php、
/commentform.js、
/commentform.css
となっているところを、
/commentform/commentform.php、
/commentform/commentform.js、
/commentform/commentform.css
のように書き換えればよいだけなのでそれほど数も多くないし、手作業でおこなった。

ログの保存フォルダは、/commentform/の中のさらに commentfiles/ とする。フォルダ名はcommentform.phpの13行目に指定してあるので適当に名前を変えてもよいようにした。

$commentdir = 'commentfiles';

/commentform/のパーミッションを777にしておくと、データディレクトリは自動で作成してくれる。うまくいかなかったら自分でデータディレクトリを作成してパーミッションを777にしておく。

メール通知機能

data_save("$commentdir/$_REQUEST[file].dat", $Comment);

data_save("$commentdir/$_REQUEST[file].dat", $Comment);

/*メール送信*/

/*サーバーURL、最後の / は不要*/
$myhost="http://hoge.co.jp";

mb_language("Japanese");
mb_internal_encoding("UTF-8");

$to      = 'to@hoge.co.jp';
$subject = 'コメントの投稿がありました。';
$body = 'Commented HTML : '.$myhost.$m_file. "\r\n====\r\n".$m_comment;
$headers = 'From: from@hoge.co.jp' . "\r\n";
mb_send_mail($to, $subject, $body, $headers);

ここで設置しているサーバーURLとメールアドレスを指定しておく。to@hoge.co.jpとfrom@hoge.co.jpは同じでもかまわない。YahooメールやGメールの場合、自動的に迷惑メールに振り分けられることもあるので、そのあたりは注意する。

投稿フォームとコメントのリストの順序を入れ替える

配布されているものは、コメントのリストの最後にフォームが表示される。この順序はこれはこれで意味があるとは思うのだが...つまり返信しようと思えばまず上にある、過去に投稿された記事に目を通すというのが手順のはずだから....しかし、投稿数が多くなるとフォームまでのページ内移動分が大きくなりスクロールするのが面倒だ。どうせ最近の記事は上の方に掲載されているのだから、最近の記事の近くにフォームがあった方がUI的に良いと思う。本当はページャー機能付きだといいのだがそこまでの改造は自分には無理ポ orz

とりあえず順序の入れ替えは簡単だ。 commentform.phpの52行目あたり

header("Content-type:text/html; charset=UTF-8");

foreach ($Comment as $line) {
...
_;
}

echo <<<_
<form action="javascript:void(0)" name="commentform"
...
_;

commentの改行が反映されない

url = url + '&comment=' + comment.value;

↓

url = url + '&comment=' + comment.value.replace( /\n/g , "___" ) ;

$buffer = preg_replace("/\n/", "", $buffer);

↓

$buffer = preg_replace("/\n/", "", $buffer);
$buffer = preg_replace("/___/", "<br>", $buffer);

細かい点

• 各コメントにユニークなコードが振られ表示されているが、とりあえず非表示にした（特定のコメントを指摘して返信などするのに有用かもしれないが）。
• サブミットするときの確認メッセージが変。パスワードを入れておけば自身が投稿した記事は削除できるのに、「削除もできない」などと表示される。
• コメントに関するお約束に同意するためのチェックボックスが面倒なので、とりあえずデフォルトでcheckedにしておきCSSで隠した。chekedを消して、javascriptでcheckedに変更するような仕組みにすればスパム対策にもなるだろう。

以下のフォームはテスト用ではありません。テストにはコチラをお使いください。

Ida Qitailang