web拍手

最近訪れていただくお客さんの数も多いので、生意気にもweb拍手など設置してみました。
よろしければご活用ください。
記事の最後にある「拍手ボタン」を押していただくと拍手がひとつ送られます。そのあとメッセージ記入欄が現れますので、なにかコメントありましたら書いていただき、もう一度ボタン(「感謝ボタン」に変化しています)を押していただくと、メッセージ(と追加の拍手)が送信されます。

以下導入メモ。

■スクリプト:web拍手ツール【ＧＪ！】（グッジョブ！) (「Minor Problem～【ダウナー系プログラマの日常】～」様より借用。)

使っているwordpressテーマのheader.phpの最後に以下の記述を追加(urlは適宜変更)。
<script type=”text/javascript” src=”http://hogehoge.com/gj/gj.js”></script><script type=”text/javascript” src=”http://hogehoge.com/gj/prototype.js”></script>
※追記:動作を軽くするために、Ajaxフレームワークをprototype.jsからpt.ajax.jsへ変更。
参考サイト:WordPress には最適かもしれない拍手ツール 【GJ!】(MOMENTS)

使っているwordpressテーマのindex.php、single.php、archive.php、category.php、search.php、tag.phpの以下の記述
<div class=”textBody”><?php the_content(__(‘Continue reading’, ‘vicuan’)); ?></div>
に続いて以下の記述を挿入(「Continue reading」の下に追加される)。
<input id = “<?php the_permalink(); ?>” type = “image” src = “” alt=”拍手” style=”vertical-align:middle;” onClick=”goodjob(‘<?php the_permalink(); ?>’,'<?php the_title(); ?>’) “><br /> <script>showbutton(‘<?php the_permalink(); ?>’,'<?php the_title(); ?>’);</script><br /> <input type = “text” id =”<?php the_permalink(); ?>_gj_message” style=”visibility:hidden;vertical-align:middle;”> <span id=”<?php the_permalink(); ?>_gj_mark”></span>

■拍手画像:「ポケットサイズ」様より借用。(png形式)
拍手用画像リンク

■画像形式変換:ドラッグ&ドロップ画像変換
【ＧＪ！】ではpng形式の画像が拍手画像に使えないみたいなので、png→gif変換。透過色も指定可能。

■【ＧＪ！】のgj.php内の画像ファイル指定のファイル名を変更。拍手カウント数字の色指定を(128,128,128)に。拍手カウント数字の表示位置を(16,13)に。

■サーバーへアップロード。