広告

posted by fanblog
「ここにブログの名前を入れます」は更新を終了しました。記事はすべて新ブログ「Big Bang」に移転済みです。記事のタイトルをクリックすると新ブログの該当記事に移動します。そちらでお楽しみください。

どうでもいいコメントフォームを作る

このブログのサイドバーに「どうでもいいコメント用フォーム」を作りました。記事とは関係ないコメント用です。「お問い合わせフォーム」みたいな使い方も出来るでしょうが、このブログではジョークソフトの感覚で設置しています。

以下は、その設置方法です。

ご自由にコピペしていただいて構いませんが、厳密に考えて作っていませんのでトラブルがあっても当方は責任を持ちません。お使いの際は、それをご了承ください。

クッキーや入力チェックはありません。
追記:ファンブログのみ、ログイン中のクッキーを有効にしました。

サポートはしません。質問には答えませんので、見てわからなければ設置はあきらめてください。

送信先ページを作る

まず、フォームに入力されたコメントが送られる先、言い換えると、書き込まれたコメントの表示先となるページを作ります。

これは普通にブログの記事をひとつ作るだけです。記事のタイトルも文面も、ご自由に作ってください。

ページが出来たら、ブラウザでそのページを開きます。そして、表示されたページのソースを見ます。

ソースを見るには、Google chromeやfirefoxなら右クリックして、「ページのソースを表示」を選択します。その他のブラウザの場合は、、、、調べてください。

ページのソースの中に下の箇所があります。ブログだと通常は送信フォームは一つしかないと思いますので、ページ検索すればすぐに見つかると思います。

nameの値 WriteCommentForm はファンブログの場合です。

<form method="post" name="WriteCommentForm" action="URL">

formタグの中にあるactionに書いてあるURLをコピーします。このURLが送信先のURLです。

あとは、サイドバーに送信フォームを作り、送信先に先ほどの送信先のURLを指定するだけです。

以下は、このブログを書いているファンブログの場合ですが、その他のブログでも { と } で括ったファンブログの独自タグを削除して、すべてのname属性の値を正しく書き換えれば使えると思います。青字部分は、お好みで書き直してください。

{ と } で括ったファンブログの独自タグは、送信後、エラーがあった場合にそこにエラーが書き込まれるもので、ファンブログのみで有効です。

ここに表示ページのURLと書いてある場所には、コメントを送信するために作った記事のURLを書き込みます。

スタイルシートはご自分のブログに合わせて作ってください。

フォームのソース

ファンブログで、上に出てきた name="WriteCommentForm" をつけるとクッキーが反映されません。

<h3>どうでもいいコメントはこちらへお願いします</h3>
<form method="post" action="ここに送信先のURLを記入">
<table border="0" cellspacing="0" cellpadding="0">
<tr align="left" valign="top" height="25">
<td class="text" width="50" nowrap align="right">名前:</td>
<td class="text"> <input name="author" value="{$CommentValueAuthor$}" /> <br /> {$CommentErrMsgAuthor$} </td>
</tr>
<tr align="left" valign="top" height="25">
<td class="text" nowrap align="right">Email:</td>
<td class="text"> <input name="email" value="{$CommentValueEmail$}" /> <br /> {$CommentErrMsgEmail$} </td>
</tr>
<tr align="left" valign="top" height="25">
<td class="text" nowrap align="right">URL:</td>
<td class="text"> <input name="url" value="{$CommentValueUrl$}" /> <br /> {$CommentErrMsgUrl$} </td>
</tr>
</table>
<textarea name="comment" rows="10" style="width:100%;"></textarea><br />
{$CommentErrMsgComment$}
<p style="text-align:right;"><input type="submit" name="post" value="送信する" /></p>
</form>
<p style="margin-top:1em;"><a href="ここに表示ページのURL">どうでもいいコメント一覧を見る!</a></p>

ファンブログ用の追記

ファンブログのみ、クッキーを有効にしました。
下のコードを上のフォームの直後に追加すれば、ログイン中は自動で名前やURLが入力されるようになります。

<script type="text/javascript">
<!--
(function(){
	var gCommentInCookie=new Cookie(document,'blog.comment.preferences.in');

	if(gCommentInCookie.load()){
		var loginFlag=false;

		for(var i=0;i<gCommentSaveCookieNames.length;i++){
			var name=gCommentSaveCookieNames[i];
			var input=document.getElementsByName(name);
			var cookie=gCommentInCookie[name];

			if(!input.length||'string'!=typeof cookie){continue;}

			var obj=document.createElement("span");
			obj.setAttribute('style','font-size:80%');
			obj.appendChild(document.createTextNode(cookie));

			input=input[input.length-1];
			input.value=cookie;

			input.parentNode.insertBefore(obj,input);
			input.style.display='none';
			loginFlag=true;
		}
	}
})();
// -->
</script>

新ブログ「Big Bang」で続きを読む