2011年2月 Archive

movabletypedemo.orgにてMovable Typeのヴァージョンごとの管理ページのデモページが提供されています

だいぶ前に見つけたのですが、Movable Typeの1.xとか過去の版などを体験できるサイトがありました。

• Movable Type Demo

例えば、3.xですとこちら

• v3.x - Movable Type Demo

のJust login to: のリンク先から管理画面にログインできます。入るときのアカウントとパスもそのページに記載されています。※Rulesページは目を通してください

ログイン後はこんな感じです。英語だけど

Open Melodyのデモページもありました。

• v1x - Open Melody Demo

今月（2011年2月）ブログのカスタマイズしたところをまとめた記事です

最初の月のカスタマイズは以下のとおりです。

• 新しいほうのはてなブックマークボタンをアーカイブページにつけてみた
• インクルードしてるjQuery（本体）のヴァージョンをあげてみた
• はてなブックマークのエントリページ用のRDFを追加

ブックマークボタンの記事は以下です。

• カテゴリー、月別アーカイブに新はてなブックマークボタンをつけてみました

jQueryですが特にヴァージョンあげてなくても問題はなかったようなんですが、なんとなく。Google Ajax APIからのものをcode.jquery.comのCDNにしてみました。

詳細は以下に掲載されているRDFのコードです。

• エントリー情報更新ボタンの利用範囲を拡大しました - はてなブックマーク日記 - 機能変更、お知らせなど

これをブログ記事のページとかウェブページ内に埋め込んでおきました。rdf:aboutには、MTEntryPermalinkとかMTPagePermalinkを、foaf:accountNameには「自分のはてなのID」をいれておけばいいわけです。あとこのRDFのコードはhead内におくとき、<!-- -->でラッピングしておかないとヴァリデーションサーヴィスなどで指摘されるみたいです。

これをファンクションタグ化してみようとしていたのですが、エントリページごとに出力するところまではできたんですが、アーカイブテンプレート毎での制御のしかたがいまいちわからなくて頓挫中（？）

今月のカスタマイズは以上です。以下に過去のカスタマイズ記録リストがあります

• 当ブログのカスタマイズ記録

AdobeがFlash Player10.2をリリースしましたが、これまでのヴァージョンからのアップデートで失敗しておりました。

そのようななわけで、新しくインストールしなおしすることにしました。なおここでは自分のケースでの覚え書きのつもりです。（将来的にAdobeの仕様変更などでこのエントリ内容があてはまらないことがあります）OSはWindows XP、ブラウザがFirefox(3.6.13)とInternet Explorer 8です。

この記事は、Flashバージョン10.2系に関する内容です。

症状

Flash Playerの自動更新でインストールに失敗。（10.1->10.2）

OS起動時にインストーラが稼動するのですが、インストール実行してみたところ失敗して終了。その後の自動アップデートは今のところなし。

Flash Playerを削除してインストールする

既存のPlayerをアンインストールして新たにインストールしなおすことにしました。Adobeによる情報は以下のページから。（なお、説明ページにある「スクリーンショット」が実際のページのものと違っているかもしれません）

• Flash Player レスキュー！ - インストールができない(Windows)（kb2.adobe.com/jp）

説明に従い、アンインストーラをダウンロード。保存場所はデスクトップに。その後ブラウザを閉じて、落としてきたアンインストーラを実行しました。

Flash Playerが完全に削除されたらOSを再起動します。その後、新たにFlash Player（10.2）をダウンロードしました。先ほどの説明のページでは、Adobe Download Manager のインストールが記載されているのですが、自分の場合Firefoxですが、いれてなくて「その他のブラウザでの再インストール」に記載されている方法のように、Flash Player のインストーラーをデスクトップに保存しました。

その後、インストーラを実行していちおう、OS再起動して終了しました。

...とここまではよかったものの

Firefoxのほうはインストールできていたのですが、Internet ExplorerでAdobeのページをみるとFlashのところがimageになっていて要するにIE用のがインストールされていない状態でした。

IEを開いて、AdobeのFlash Playerダウンロードのページにいきます。

「オペレーティングシステムまたはブラウザの変更」のところで、「オペレーティングシステム」にWindows、「バージョン」のところでInternet Explorerを選択します。

ダウンロード後にセキュリティ警告のバーが上に表示されるのでインストールの許可をしておきます。その後ActiveXコントロールをインストールです。これがいわゆる（？）Adobe Download Managerですなんか表現が違う気がします。詳しい方解説おねがいします

そのあとAdobe DLMからのインストールとなり、インストール作業中は他の操作を行わず終わるまで待ちます。途中インストーラがでてくるので、指示どおりにボタン等操作してインストールを完了となります。ブラウザとか閉じて再起動後にIEからAdobeのページ（Adobe -- 日本とか）見にいきFlashが表示されていればとりあえず成功ということです。

Flash Player 10のインストール方法は以下のページにありました。

• Adobe - Flash Player 10：インストール手順

GoogleのFifrfox用Page Speed ExtentionでOptimized versionとして示されたファイルの保存の場所についてのメモです

まったく別な用だったのですが、テンポラリファイルを見ていたときにpage-speedというフォルダを見つけたのでちょっと調べてみることにしました。

Page SpeedはGoogle提供のウェブページ最適化のツールです。Analyze Performanceを実行すると、CSSファイル、JavaScriptファイル、画像ファイルで最適化されたファイルが提示されることがあります。

この最適化ファイルは特定の保存場所に保存されていまして、デフォルトだとユーザのテンポラリファイルにpage-speedフォルダが作られ、そこに格納されているようです。

試しに、ウェブページをツールでAnalyzeしたあとでコマンドプロンプトからみてみるといくつかファイルがあることが分かります。

C:\>cd %USERPROFILE%\Local Settings\Temp\page-speed
C:\Documents and Settings\User\Local Settings\Temp\page-speed\>dir

このファイルの保存場所の変更はオプションのポップアップメニューを表示して行います（ちなみに「Page Speed」は「YSlow」と同じくFire bugと連動しているので、Fife bugを開けばPage Speedのタブがでています）。

以下のようにPage Speedのタブ横の下向きの三角矢印をクリックでポップアップメニューが表示されます

まずは「Choose a custom Path」をセレクトします。

デスクトップに任意のフォルダを作成して指定してみました。

設定したパスが保存場所として選択されています。このフォルダ内をみれば最適化ファイルが保存されていることが分かります。

保存場所をTempに戻すと先ほどのメニューからcustom pathが消えます。またcustom settingで指定したフォルダが削除してある場合はその箇所に指定したフォルダが作成されて保存されています。（Page Speed Tempというフォルダをフォルダごとごみ箱に移動した場合、新たにデスクトップにPage Speed Tempが作られその配下にpage-speedフォルダが作成されている）

自分の場合だと、テンポラリフォルダのファイル(Temp/page-speed/*)をコマンドプロンプトで削除するようにしています。まあ、テンポラリファイルを定期的に削除してるかたにはどうってことない話だったりするのですが。

バッチファイルはcmd.exeで実行してたものをこんなかんじで。/qとかつけるとECHO OFFいらなそうだけど（よくわかってない）。

@ECHO OFF
cd C:\DOCUME˜1\ユーザー\LOCALS˜1\Temp\page-speed
del *.*

環境はWindows、Page Speedのヴァージョンは、1.10.1で確認したものです。ヴァージョン違い等で挙動に変化が起こった場合はご容赦ください。

参考ページ等

• Page Speed Extension Overview
• Using Page Speed

カテゴリ一覧のページに新はてなブックマークボタンを仕込んでおきました。

• 使いやすくなりました! はてなブックマークボタン

上のページでフォーム内でリンクを入力すると、なんか新しいはてなブックマークボタン作成のコードが作成されるらしいです。

あ、というか本題とはあまり関係ないですね。とかいってそのまま続けますが、このようなブックマークレットをブラウザに登録して使っています（←使っているといっている割にはブログ記事で活用してません）。

javascript:(function(){
var%20h='http://b.hatena.ne.jp/guide/bbutton?url=';
var%20u=encodeURIComponent(location.href)+'&title=';
var%20t=encodeURIComponent(document.title);
window.location.href=h+u+t;
})();

新はてなブックマークボタンのMovable Typeでのつけ方（というよりはコードのvalid指南？）は、小粋空間さんのページにまとめられているので参考になると思います。

• 新しいはてなブックマークボタンを(X)HTML validにする方法: 小粋空間

簡単に要点だけ拾っていくと（勝手に当方で解釈して付け足してる部分があります）以下のようです（「動く」という表現はスクリプトだかが動作するという意味です。いちおう）。

• 属性のdata-*はつけてなくても動く
• data-hatena-bookmark-layoutがないとブックマークボタンのスタイルがスタンダード（ブックマークボタン「B!」とブックマーク数の表示、通常サイズ）になる
• data-hatena-bookmark-titleがなくてもタイトルを自動で読んでくれる（たいていdocument.titleぽいですが、登録済みのエントリはそのブックマークエントリのタイトルなのか？？）
• async属性を外しても動く
• 複数のはてなブックマークボタン設置でもbookmark_button.jsは一回だけロードしておけばよい
• a要素のhref、ブクマエントリのページのリンク(http://b.hatena.ne.jp/entry/)＋MTEntryPermalink

どうでもいいことですが、ワタくシの場合はcreateElement()でスクリプト読み込むようにしてますです。アーカイブリストページにボタンを使う理由は――ええと、何だっけ。以上です