今まで気付かなかったのですが、トップページの左サイドバーのコメントは日付昇順に並んでます。ところが、エントリーページ（パーマリンク、コメント入力ページとも言う）のサイドバーは降順になってました。

　MTの「設定」-「コメント」の表示オプションにあるコメントの表示順は昇順になっているのに何故こんな事が起きたのか不思議。原因はよく分かりません。

　対策としては、サイドバーのテンプレートにある「MTComments」タグに付加属性で「sort_order="ascend"」を付け加えます。これで日付昇順になります。MTの設定側は無視されます。「ascend」を「descend」に変更すれば降順に変わります。

　ＭＳＦ－ＮＥＴ Mobile Ver.「http://msf-net.com」の方にもカウンターを設けました。
　表示は必要ないかな。と思ったので、隠して裏でカウントだけ取る方法になってます。ブログ側と同様に、最初の訪問時に+1され、その後、同一IPからのアクセスはカウントされません。
　また、アクセスログを常に取っています。携帯からは「SoftBank/1.0/921SH/SHJ002/SN3580400******** Browser/NetFront/3.4 Profile/MIDP-2.0（僕の携帯です）」などと、機種名やシリアルナンバー、ブラウザ情報が分かってしまう事をご了承下さい。滅多にログは見ないですけどねｗ

　携帯だとそこまで分かっちゃうんだよ～！
　って事を言いたかっただけ。

　mixiがらみでいろいろと弄っているうちに、「最新の日記」の一覧が更新されなくなりました。今までちゃんと動いていたのに。何でだろ。

　mixiの設定変更で「Movable Type系」を指定しなおした所から更新されなくなったので、mixiの仕様が変わったのかと疑った。また「その他」を選択するとRSSの直アドを指定出来るのですが、1日経っても更新されなかったので、調べてみると、RSS1.0ならば反映されるかも。と言う事らしいので、Movable Type4.2にRSS1.0を追加してみました。

　Movable Type4.2でRSS1.0のインデックステンプレートを作ります。

<?xml version="1.0" encoding="<$MTPublishCharset$>"?>
<rdf:RDF xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#" xmlns:dc="http://purl.org/dc/elements/1.1/" xmlns:sy="http://purl.org/rss/1.0/modules/syndication/" xmlns:admin="http://webns.net/mvcb/" xmlns:cc="http://web.resource.org/cc/" xmlns="http://purl.org/rss/1.0/">
<channel rdf:about="<$MTBlogURL$>">
<title><$MTBlogName encode_xml="1"$></title>
<link><$MTBlogURL$></link>
<description><$MTBlogDescription encode_xml="1"$></description>
<dc:language><$MTDefaultLanguage$></dc:language>
<dc:creator></dc:creator>
<dc:date><MTEntries lastn="1"><$MTEntryDate format="%Y-%m-%dT%H:%M:%S" language="en"$><$MTBlogTimezone$></MTEntries></dc:date>
<admin:generatorAgent rdf:resource="http://www.movabletype.org/?v=<$MTVersion$>" />
<MTBlogIfCCLicense>
<cc:license rdf:resource="<$MTBlogCCLicenseURL$>" />
</MTBlogIfCCLicense>
<items>
<rdf:Seq><MTEntries lastn="15">
<rdf:li rdf:resource="<$MTEntryPermalink encode_xml="1"$>" />
</MTEntries></rdf:Seq>
</items>
</channel>
<MTEntries lastn="15">
<item rdf:about="<$MTEntryPermalink encode_xml="1"$>">
<title><$MTEntryTitle encode_xml="1"$></title>
<link><$MTEntryPermalink encode_xml="1"$></link>
<description><$MTEntryExcerpt encode_xml="1"$></description>
<dc:subject><$MTEntryCategory encode_xml="1"$></dc:subject>
<dc:creator><$MTEntryAuthor encode_xml="1"$></dc:creator>
<dc:date><$MTEntryDate format="%Y-%m-%dT%H:%M:%S" language="en"$><$MTBlogTimezone$></dc:date>
</item>
</MTEntries>
</rdf:RDF>

　トップページのヘッダーテンプレートのRSS記述があるあたりに

<link rel="alternate" type="application/rss+xml" title="RSS 1.0" href="<$MTBlogURL$>index.rdf" />

　これでRSS1.0(index.rdf)が追加されました。mixiの方の設定を変更しなおすと即座に更新が反映されたのを確認しました。ヽ(´―｀)ノ

　この状態で、ちゃんと更新されるかを確認しなきゃいけないので一日放置してみます。

　携帯からmixiモバイルで、日記やメッセージなどを閲覧している人は多いと思います。

　今まで気付かなかったのですが、mixiモバイルから外部ブログを設定している人は、更新履歴にある日記リンクをクリックすると、一番上に「mixiが携帯用に変換しています」と表示され、外部ブログの「文字のみを抜き取って表示」する仕組みになってます。

　つまり、外部ブログへジャンプするのではなく、mixiが内部処理で勝手に細工を施した物を表示、その表示されたページからは、リンクもコメントも何にも出来ません。全てはmixiの内部に取り込まれ、一応外部リンクは見れるようにしたけど、そこからは何にも出来ませんよ。飛びたければトップページにでもリンク先を張ってお知らせをしましょう。と言う事です。確かにこれならSNSの閉鎖的空間を保てます。

　以前から、「携帯からmixiの日記読もうとしても、変な文字がばぁぁって出るんだけど？」との指摘があったのでいろいろ調べました。実際に確認してみると、うちのブログの左サイドバーから順番に表示しているのが分かります。

　さあて、この解決方法をどうするか。

　一つは、スタイルシートで表示の順番を入れ替える。今は「ヘッダー→左サイドバー→本文内容→右サイドバー→フッター」の順番に表示させているので、「ヘッダー→本文内容→左サイドバー→右サイドバー→フッター」にすれば、すぐに本文が読めるようになる。これだと、ブログのシステム全体を再考しなくてはならないので、すごく面倒。

　で、考えた挙げ句の解決策。（ほんの少し妥協あり）

　「mixiのサーバーから日記データを拾いに来てるのならば、ユーザーエイジェントで判断して分岐させ、mixiモバイル専用に用意した本文のみを表示するテンプレートを返す。」です。

　まず、mobile専用サイト開設の時に使った、携帯からのアクセス分岐PHPスクリプトに手を加えます。

<?php
$user_agent = $_SERVER["HTTP_USER_AGENT"];
if(ereg("(mixi-mobile-converter)",$user_agent)){
header("Location: http://msf-net.com/mixi.html");
}
if(ereg("(DoCoMo|J-PHONE|MOT|Vodafone|SoftBank|UP\.Browser|KDDI|
DDIPOCKET|WILLCOM|ASTEL|PDXGW)",$user_agent)){
header("Location: http://msf-net.com/mobile/index.cgi");
exit;
}
?>

　あとはMovable Typeのカスタムインデックステンプレートで「mixi.html」を作ります。基本的には「ヘッダー・ブログ記事の概要・コメント詳細・フッター」だけあればいいと思います。

→ mixiモバイル用の表示ページ （参考用）

　mixiモバイルからは日記リンクのどれをクリックしても最新日記から表示されてしまいます（ここが妥協した所。）が、外部ブログを利用している場合、mixiモバイルの更新履歴は3件しか表示されない（「もっと見る」のリンクをクリックすると、「これ以上はPCで見ろ」って言われる。）ので、最新からの日記3件分を表示出来れば十分だし、元々コメントすら出来ない仕様なので、直リンじゃなくてもいいかなと思いました。これ以上mixi側の傲慢に付き合う程お人好しじゃないしね。

　つか、こんな仕様に怒りを覚えるくらいです。だって、mixiモバイルからの外部ブログ閲覧て、カウント（PV）されないんですよ。 (;´д⊂)

　調べてみると、同じ事で悩んでる人いっぱい居たんだなぁと思った。
　そんなワケで、とりあえず読めるようにはしておきました。

　QRコードを左サイドバーに付けましたので、
　携帯ブラウザから読みに来て下さい。 (´Д｀;)

　Flashを利用している部分の上にJavaScriptが重なる場合、Flashの方が優先的に前面に表示されてしまいます。これはどのブラウザでも共通なようです。
　うちのサイトの例で言うと、一昨日の日記の「クシコス・ポスト」はFlashプレーヤーを利用しました。そこへ画像を拡大表示してくれる「Highslide JS」を使うと、Flashプレーヤーが前面に残ったままの状態になってしう事になります。スタイルシートのz-indexでは制御出来ない為、Flashが背面へ来るように、Flashの表示に使う「object」と「embed」タグにパラメーターを付け加えます。

　Objectタグには

<param name="wmode" value="transparent">

wmode="transparent"

　これで、FlashがJavaScriptよりも背面になります。

　Movable Type4.21を入れ直した所、システムテンプレートが復活しました。ヨカッタと思っていたら、カレンダーが表示されなくなりました・・・。
　カレンダーの生成するフォルダのパーミッションが勝手に777になってるのが原因ぽい。755にしたら表示されたんだけど・・・。
　デフォルトパーミッションは755にしてあるのに、何故このフォルダだけが777になるんだろう・・・。うーん、分からない。

　初期設定のままだと、記事のファイル名がpost_01.htmlやタイトルを英文から始めるとその文字のファイル名になってしまいます。これだとデータと記事の関連性が見つけづらくなるので、ブログ記事のアーカイブマッピングを変更しました。基本的にはブログ記事のアーカイブマッピングをカスタムで「%y/%m/%d/%h%n%x」（年/月/日/時分+拡張子）と入力します。記事の日付と関連性を持たせることで管理しやすくなります。見た目もいいですしね。

　また、greyboxがダイナミック・パブリッシングで動かなくなったので、全てHighslide JSへ1本化しました。単純化される所あれば、どんどん複雑になっていく部分もあったりと、ブログの管理は面倒なものです・・・。

　投稿ボタンを押した後の確認画面で、何故かタイトルの左に2ドットの白い線が出る事に気付きました。ほんの些細な事ですが・・・。
　この現象、FireFoxで起きます。IE7で確認すると出ませんでした。始めはブログ全体幅の設定がどこかでおかしくなっているものだと思って、スタイルシートやテンプレートとにらめっこしていたのですが、一つ気付いた点がありました。

　FireFoxは画面全域内に内容が収まった場合、縦のスクロールバーが消えます。こうなると常にセンター揃えになっているブログ全体がズレてしまいます。この時にだけ白い線が出ると言う事がわかりました。（気付くまでにかなり時間かかったｗ）

　と言うわけで、常に縦のスクロールバーの領域を確保してあげます。

html {
overflow-y:scroll;
}

html{
height:100%;
margin-bottom:1px;
}

　これで謎の白い線が出なくなりました。しかし、何故ズレが発生するのかはよくわかりません。widthに%を使っている箇所があるから？憶測だけど、そんな感じなのかな。

　ちなみに、bodyタグに付けるとIEの場合、2重にスクロールバーが表示されると言う現象が起こるので、htmlタグに属性付加させましょう。

　以上、小技でした。

　以前は掲示板などへの書き込みで、メールアドレスを書いて投稿すると、スパムメールがたくさん届くようになったりしました。これは巡回しているボットがHTML上にあるメールアドレスを見分けて登録されてしまうからです。最近ではメールアドレスは表に出さないようにする人が多いみたいですが、記入欄がある以上、対策は必要です。

　そもそもうちのサイトでは投稿時に記入しても、表示はされません。管理画面上でのみ見ることが出来るようになってます。ブログの設定では「表示させるようにしてもリンクをしない」や「リンクを張っても実際のHTMLソースには「@」や「.」を含まない」ような設定にも出来ます。

　ま、表示されないなら意味ないかもしれないけど、メルアドを伝える手段としてはこれが一番いい形なのかなと思ったりします。

　最近ではあまり見かけなくなっちゃったような気がしますが、サイト表示の外側にドロップシャドウを付けました。簡単に付けられるので後回しにしてきた物の一つです。
　サイト全体はDIVタグ要素の固まりになっています。なので、一番外側にDIVタグを追加して、直接背景画像を埋め込んでしまえばOKです。まあ、相変わらず小粋空間さんにお世話になってます。ブラウザ毎によるズレの不具合もありますが、ちゃんと修正方法も載ってます。

　うちの場合は更にページ全体に背景画像が敷き詰められているので、影の部分をPhotoshopなどで合成して完成です。簡単に出来る小技がまだまだあるので、暇を見つけては追加して行きたいです。

　サイトを閲覧する上でブラウザでの表示確認は当たり前なのですが、バージョンが違えばレイアウトが崩れたりします。うちのサイトはInternet Explorer7、Internet Explorer6、Fire Fox2.0（Win、Mac）、Safari2.0（Mac）、Opera9で確認しています。それ以外の古いブラウザだと、表示が崩れたり、文字化けしたりしているコトを確認しています。
　確認している各ブラウザ毎でも微妙なズレが生じているのですが、ブラウザ毎にスタイルシートを作る程の面倒なコトはやりたくないので、ごまかしで他のブラウザに影響しないようなタグ記述が埋め込まれていたりもします。
　こういう所で結構悩んだりしてますけど、今ではずいぶん落ち着いた感じになりました。

　そんな所へMovableType4.0β版のお知らせが…ｗ

　一から再構築なんて無理ｗ

　相変わらず些細な部分ですけどブログの変更。

　画像を貼り付けた時、大抵の場合は文字を回り込みさせます。その場合、画像と文字の隙間が無くなってしまうので、imgタグにhspaceやvspace属性で画像の回りに空白スペースを確保していました。FireFoxではhspaceやvspace属性が使えないので隙間は常に0pxでしたが。
　この方法だと、右端に画像を置いた場合（imgタグのalign=left属性を使用）、厳密には右端からhspace分、左にズレてしまうことになります。
　そこで、スタイルシートにクラス属性（highslide使用時にはid属性を使用）で画像の位置が左なら、テキストの回り込みと隙間の確保、画像の位置を左へ8pxズラすなどの設定を追加して、画像の位置をコントロール出来るようにしました。FireFoxでの表示も思い通りになってくれました。ここが気になってた所なんです。

　ここまではよかったんだけど、この画像の位置をズラしたおかげで不具合が。
　IEが持つブラウザ上の機能で、リンクをクリック（onfocus）した時に、そのリンクの回りに点線が出るのですが、この点線が画像をズラす前の本来の位置に表示されます。つまり、8px分のズレが発生するんです。
　こればかりは悩みました。この点線そのものは、障害者などへの配慮で使用されるているものです。しかし、他のブラウザでは使われてなかったりします・・・。

　だったら、「ページ内の全てのリンクに対して、この点線を消す裏技である【onfocus="this.blur()"】を適用してしまえ！」という発想に。とは言う物の、全てのリンクタグを変更するのは無理なので、「ページを読み込んでから、リンクタグの記述に対して【onfocus="this.blur()"】を追記する」ようにしてみましょう。
　あらゆるサイトを探したものの、そんな方法は載っていません！

　で、たどり着いたのが、unbland.net blogさんの「HighSlide JS での手間を省く」エントリーにあるjQueryを使う方法に手を加える事でした。お世話になりました。本当にありがとうございます！

　と言うわけで、リンク選択時の点線が、IEでは表示されなくなっています。

　なかなか苦労しただけあって、思い通りにいきました！

　昨日の帰りに、ドリエルとグッスミン買ってきたんだけど、気づいたら寝てたんで、必要なかったみたいｗ

　リンクもかなり放置していたので、そろそろ作っておくかってコトに。

　ブログのシステムは「Movable Type」を使っているのですが、エントリー数も416コもあり、再構築に20分もかかってしまいます。テンプレートが4種類あって、すべてに同じようなタグを記述しなくちゃなりません。リンクを中に埋め込むとすべてのエントリー内にリンクが構築され、1つのエントリーの容量が膨れあがり、総合的に考えるとサーバーの空き容量を食い尽くしてしまいます。さらに再構築の時間も延びることになります。

　一般的にはFrameタグなどで別ページを埋め込んだり、JavaScript等で外部から読み込む方法が理想ですが、芸がないとか思っちゃうので、「LightBox JS」のような動作をする「GrayBox」と言うJavaScriptを使ってみました。前者のは画像だけを表示するのですが、後者は画像だけでなくHTMLを表示させることもできます。ポップアップウィンドウ禁止時代にこのような動きをするスクリプトはありがたいです。「GrayBox」のみの利用でもOKなんですが、過去のエントリーを全部再設定するのが面倒だったり。しかし、「LightBox JS」のいいところは画像へのリンクを張るだけで自動で画像であることを認識してスクリプトが起動してくれる点です。なので、使い分けたほうが便利だってコトです。便利なのは僕だけですがｗ

　まず、折りたたみ機能部分を直接「GrayBox」にリンクさせたいのですが、面倒なので後回しにして、本体部分を埋め込みました。「旧MSF-NET ［リンク］」を押すとGrayBoxが起動します。旧MSF-NETのデータをそのまま利用しているだけなので、いずれちゃんとしたものを作る予定です。とりあえず動くことが必要で、見た目は後で・・・　なんでも後回し！

　「GrayBox」の動作について。各OSの最新ブラウザでの動作確認はしましたが、ページ全体が表示されても、スクリプトの起動に時間がかかるのか、しばらくしないと動作しないみたいで、すぐにクリックするとブランクでリンクページが表示されちゃいます。回線速度とPCの性能によるものかと思われますが。

　さて、肝心のリンクページの中身は、順次の～んびりと作っていきます・・・。

※2007/5/22追記　現時点で画像表示には「Highslide JS」を使用しています。ここでLightboxJSは起動しません。

「Lightbox JS で画像を表示する」の導入です～。

Lightbox は画面を切り替えずにレイヤーで重ねて同じページに画像を表示させるスクリプトです。左の旧サイトタイトルロゴをマウスクリックするとわかります。「Lightbox JS の Movable Type での不具合を修正する」これと「Lightbox JS の rel 属性を自動付与する」これも導入済みです。
やり方はこの通りなのですが、うちのサイトには「Float Layer」がOnLoadでBODYタグに読み込ませていたので、競合してしまうのと、スクリプトの中で同じ関数を使っている為、不具合が発生します。

なので、まず、BODYタグの中から OnLoad="start();"を削除し、
floatLayerのdivタグの前に

<script type="text/javascript">
<!--
addLoadEvent(start);
//-->
</script>

そして、スクリプトの関数が競合しています。「pageWidth」「pageHeight」がそれそれに使われているので、Lightboxが起動するとこの数値が置き換わってfloatLayerの矢印マークが画面の下へめり込んでしまう不具合が発生。まあ、どちらかのスクリプト中にある関数をエディタで適当な名前（関数）に置換するだけでOKです。

あと、floatLayerの矢印マークのレイヤーの重なり順序を変更します。
「z-index」がレイヤーの重なりを決めているのですが、floatLayerのテンプレートに追記する1行目の

<div id="floatLayer" style="position:absolute;height:0px;width:0px;left:0px;top:0px;z-index:100">

Lightbox plusと言う拡張版もあるのですが、左のメニューに使われているセレクトボックスがどうしても隠れないのであきらめましたｗ

「SCode プラグインでコメントスパムを制限する（その1：基本設定）」
毎度お世話になっておりまする！ってコトで、S-Codeを導入させていただきました。
まあ、画像になって描かれている数字や文字コードを入力してもらわないと、投稿できませんよ～ってことです。
無差別に書き込みをさせるロボット的なプログラムなどからはスパムカキコがなくなると言うことですな。

もともとこういうセキュリティーが無かった時代があったので、ブログへの変更を敬遠してたものの一つだったりしますが。

----------------------

「コメントにHTMLタグ挿入ボタンをつける（改）」も同時につけました。
マウスで範囲選択した状態でボタンを押すとそれぞれのタグを挿入できます。

リンク用のボタンにはtarget属性がなかったのでBlankを追加で入れてあります。
小粋空間さんの説明の「３．JavaScriptファイルの作成」のところ、commentButton.jsの記述の下から4行目あたりの

setSelection(e, '<a href="' + my_link + '">' + str + '</a>');

setSelection(e, '<a href="' + my_link + '" target="_blank">' + str + '</a>');

ずいぶんとサイトに小技が増えてきました。少しずつ変化していくのを見てるだけで楽しいものです。そんなワケで、今日の小技は「最近のコメントのツールチップにコメント内容を表示する」「カレンダーのリンクにツールチップを設定する」「CSSでエントリータイトルに画像を表示する」と、さらにこの画像を表示するの応用で、エントリーリストにも●を付けました。

まだまだエラーページや検索結果ページ、リンクリストなど変更箇所は山盛りですが…

---------

複数カテゴリーのテストをしてなかったので、日記ついでにやっておこうかと。
仕事で車で打ち合わせとかに出掛けるコトが多くなってきて、ラジオをよくききます。とゆーか、使っている車には今時AMラジオしかついておりません。なので東海ラジオかCBCラジオを聞くことに。
いつもCBCラジオをつけています。最近CBCラジオの面白さに気付きました。

「つボイノリオの聞けば聞くほど」朝から最高ですｗ　（←ブログもあるぜよ）

まあ、話しのネタはいろいろあるが、そのままブログネタにするのもど～かなぁと思うんで、みなさぁ～ん！是非聞いてくださいｗ

今日は何をしようかな～と思ってたんですが～、「新着コメントに New マークをつける」これと、「プルダウンメニューに表示されたアーカイブリンクの選択状態を保持する」、「サブカテゴリーの折りたたみ」、「トラックバックURLを1クリックで選択」。こんだけやってみました～。
新着コメントにはNEWと付きます。これもやったコトあるので簡単でした。
プルダウンメニューは月別アーカイブのメニューのみに適応させました。過去データを移転させる場合に長くなるのがわかってるから。状態はウィンドウを閉じるまで維持するコトを意味します。
あとはサブカテゴリーの折りたたみ（CategoryListの中の▲クリックすればわかるにょ！）。ここの状態保持は、次回訪れた時まで維持されるものです。
トラックバックのURLをマウス1クリックだけで選択できるようになってます。

お久しぶりのサイト変更でございます。

最近はなんでもかんでもブログになってますね。
波に乗り遅れて今更と言う感じもするけど。
誰でも簡単にできるブログと言われてますが、
このシステムを自分でサーバーに構築するコトは、
そう簡単にはいかないワケで...。

それにしても、さすがにCGIやPearlを１から書くほどの気力はないので、
Movable Type 3.2と言うブログ制作ツールのお世話になりますた。

インストール方法などの初期設定はあちこちのサイトを参考にしたけど、
MySQLとかCGIとかPearlとか、イマイチ仕組みを理解してなかったりするけど、
そのうちなんとかなるかねぇ...ｗ
日記のCGIを改良すればそれなりのブログ風な感じには出来るんだけど、
データが大量になればなるほどMySQL 【データベースサーバー】の方が
処理能力には強いらしいです。
ブログのシステム自体がセキュリティの面で強化されてきたり、
CGIで作るには限界もあったり、そもそもシステム全体の把握に
時間がかかったコトもあるのでやっと公開です。

まあ、なんだ。「何語だ？」と思う人は、「大変なんだな～」くらいに
思って下さい。っちゅ～コトですｗ

てコトで、いろいろレイアウト変更していきますんで、
末永く、暖かく見守ってくださいなヽ（´ー｀）ノ

とりあえず、今現在の状態↓