ブログのコメント部分をゴニョゴニョしてみた

ここ数日間でブログのコメント部分をいろいろといじってみました

まずは念願だったクッキー対応化。これで名前・メールアドレス・URLをブラウザに記憶させて、次回からの入力を省くことが出来ます。

自作のテンプレートにMovableTypeのデフォルトテンプレートから必要と思われる部分をコピーしたり修正してみましたが、うまくクッキーが保存されず。逆にデフォルトテンプレートのコメントフォーム部分を一旦丸ごとコピーして、そこから従来の自作用に修正していったところうまく動作しました 調べてみると、FORMタグに割り当てられたNAME属性とID属性を書き換えていたことが原因でした。

クッキーに対応するためJavaScriptを使うのですが、NAME属性で「comments_form」、ID属性で「comments-form」を指定しておかないとちゃんと動作しないようです。しかしこの状態でHTMLのチェックをすると「NAMEとIDの中身が一致してないよ」と怒られちゃいますね。特に害は無いようなのでとりあえずは放置ということで

2件目はID表示。

以前アダルトサイトへのリンク目的のコメントが投稿されたことがあったのですが、その投稿者名が私の名前である「STR」だったのです すぐに消しちゃいましたが。

その対策として、投稿者のIPアドレスから8桁の適当な文字列を生成しIDとして表示するようにしました。なりすまし対策としてはなんとなく効果があるかな

ブログの絵文字挿入フォームを改善

これまで当ブログのコメントでの絵文字の使用はThe blog of H.Fujimoto::InsertIconプラグイン別ウィンドウでリンクを開きますを利用し、コメント入力欄下にある絵文字の一覧から好きなものを選んで挿入できるようにしていました。

最近のブログサービスでは、コメント欄付近にあるアイコンをクリックすると絵文字の一覧が表示される仕組みのものが多くなり、自分のブログでも同じことができないかと考えました。

そこで見つけたのがCSS HappyLife::emoddyプラグイン別ウィンドウでリンクを開きますで、自分の希望する動作をしてくれそうです。

しかしこちらのプラグイン、実際にコメント欄で絵文字を使用するとその画像までのURLをIMGタグで貼り付けてしまいます。InsetIconは同じ作者のConvertIconMacroプラグインを併用し「:emoji+xxxx.gif:」というマクロ形式で画像のファイル名のみ表示、コメント書き込み時にIMGタグに変換して表示するようにしていました。IMGタグを長々と表示するのは嫌だし、システムでコメントでのタグ使用を許可する必要がありセキュリティの不安もあります。

考えた結果、emoddyプラグインに同梱のJavaScriptファイルを改良し、同じようなマクロ形式で出力するようにしました。さらにファイル名に含まれる拡張子「.gif」も表示しないように、ConvertIconMacroプラグインも併せて改良してみました。

使えそうなアイコンがあれば、今後も増やしていく予定です。

MovableType5でPing送信不可

先日MovableTypeを最新のVer5にアップグレードしましたが、いくつかの記事を投稿したところ「500 Wide character in syswrite」というエラーが出力され、設定してあるPing送信先に更新通知が送られていませんでした。

調べてみたところ私を含め一部のユーザーで発生しているようですが、下記プラグインをインストールすることで正常に送信することができました。

http://tec.toi-planning.net/FixPingUpdate.zip別ウィンドウでリンクを開きます

Technology on Information
http://tec.toi-planning.net/別ウィンドウでリンクを開きます

MT側の不具合かな?とりえあずは次の最新版が出るまで様子を見ることに。

MT5をインストールして気づいたのですが、コメント投稿者がURLを入力していると、そのアドレスへのリンクが
http://ブログアドレス/mt-comments.cgi?__mode=red;id=xxx(コメントID)
というアドレスに書き換えられ、そのリンクをクリックすると一度リダイレクトのページが表示され、そこから投稿者のURLへと移動するようになっていました。MT4の時は特にタグの設定を変えずに直接リンクされていたと思うのですが。

おそらくスパム対策のためなのでしょうが、困るような事態が発生しているわけではないので、MTCommentAuthorLink タグに no_redirect モディファイアを付して直接リンクするようにしました。

アップグレードすることで便利になることがあれば設定が変わったり不便になる点も出てきてちょっと迷惑。

MovableTypeをVer5にアップグレード

サイトを構築しているブログウェアMovableTypeを最新のVer5にアップグレードしました。

今回のバージョンはアップグレードする際に、ファイルを上書きしただけでは正常に処理が終了しないという報告があるようです。公式アナウンスとして、違うディレクトリにインストール、または、Ver4のアプリケーションディレクトリを削除して新規インストールするようにと指示があります。

当ブログではデータベースのバックアップを行いVer4のファイルを全て削除、Ver5を同じ場所へアップロードすることで正常にアップグレードすることができました。

動作を確認したところ、トラックバック元のファビコンを取得するFaviconプラグインだけが機能していないようなので、ファビコンを表示しないように対処しました。

以前にアップグレードして文字化けを起こしたことがあるだけに、今回は無事完了して一安心。

ブログのタイトルバナー部分をいじってみた

他の方のブログを拝見していると、最初に目に入るタイトルバナーの部分に自分で撮影したであろう写真を使用していることが多いですね。

私の場合は水曜どうでしょう風のテロップをそのまま使用していただけですが、今回過去に撮影した写真をバナーとして表示するようにしてみました。

この記事を書いている時点ではブルーインパルスやヘリコプターなど9点の画像を用意。PHPを利用してページを読み込むごとにそれらの画像をランダムに表示するようにしました。

今後も使えそうな画像があれば追加していく予定です。

ブログにTinyLPOプラグインを導入

Open MagicVox.net別ウィンドウでリンクを開きます::検索エンジンの検索ワードから関連リンクを提示するMovableTypeプラグイン:TinyLPO別ウィンドウでリンクを開きますを参考に、当ブログで利用しているMovableTypeに、TinyLPOプラグインを導入しました。

LPOとは・・・上記サイトより引用させていただきます。

LPO は Landing Page Optimization の接頭語で,検索エンジン経由でサイトを訪問したユーザが最初に見るページを,検索に用いられた検索ワードなどを元にして最適化を行い,ページビューやコンバージョンを向上させるテクニックのことです。同じページでも検索に用いられた検索ワードによって表示する内容を変化させたりするのが一般的です。

今回のカスタマイズでは、検索エンジンから訪れていただいた場合、使用された検索ワードでブログ内を検索し、その結果を各アーカイブページの冒頭に表示するようにしました。

導入方法は、まずプラグインを入手しプラグインディレクトリにアップロード。検索用のテンプレートを新たに作成し、結果を表示させたいアーカイブページに表示用のタグを埋め込ませれば完成です。

グーグルで「150.70.84」を検索すると、現在のところ検索結果の2番目に当ブログのIPアドレス 150.70.84.xx からのアクセスがヒットします。そのリンクから訪れていただくと、ブログ内で「150.70.84」を自動で検索し、そのワードが含まれる記事の一覧が表示されます。

効果があるのかどうか、しばらく様子を見てみようと思います。

ブログのエントリーページを少しカスタマイズしてみた

ブログの各エントリーページを何点かカスタマイズしてみました。

1点目
エントリーの属するカテゴリーの最近の記事5件と、カテゴリーを表すアイコンまたは画像を一緒に表示しました。ただし、まだ全てのカテゴリーの画像は準備できていないので、それについては代替画像を表示させています。

2点目
トラックバックの一覧に、各トラックバック元サイトのスクリーンショットを掲載しました。SimpleAPI別ウィンドウでリンクを開きますのサービスを利用しました。

3点目
各トラックバックに対しブログパーツWebスカウター別ウィンドウでリンクを開きますを利用し、それぞれのサイトの戦闘力を表示しました。

4点目
各トラックバック元サイトのファビコンを取得し、サイト名の横に表示するようにしました。ファビコンが設定されていない場合は、こちらで用意したアイコンを表示します。

5点目
コメント欄を2チャンネル風にし、">>xx (xxはコメントの番号)"を入力することで返信先へのアンカーを設置できるようにしました。また、各コメント欄のコメント番号の横に「返信する」ボタンを設置。これをクリックすると、その記事へのアンカー付きで簡単にコメントできるようにしました。

仕事が3連休、暇なのでイロイロと弄ってみました。