ダイアリーの最近のブログ記事

つい昨日MT4.2がリリースされてましたね。Movable Type 4.2 を発表しました | MovableType.jp。早速自サーバ（UbuntuServerEdition)に入れてみました。テンプレート画面の見通しが良くなって、管理しやすくなったと思います（正直、そんなに触っていないので詳しくその良さがわかっていませんｗ。）

最近MTのタグなどを勉強するのにこちらのサイトmtde.infoを利用しています。

とてもきれいに情報が整理されていて、尚且つ手に届きやすいリンク配置、サンプルコードによるテンプレートタグの解説といった感じでとても参考になります。

テンプレートタグリファレンス | MovableType.jpと併せて頻繁に行ったり来たりしています。firefoxを使っている方は、Movable Type 4 に対応したタグリファレンスを活用する | MovableType.jpでも紹介されているように、検索にテンプレートタグ検索を追加することで、mtdeinfoを読みながら、タグリファレンスを読みたい時に、キーワードを選択して、右クリックでコンテキストメニューを表示し、[MT テンプレートタグ検索]を選択実行することで別タブでバックグランド（設定いるような・・）で開くことができます。

あとは、サイトで開設されているサンプルコードを自サーバ（MTOS）にこのブログのバックアップを流し込んで、その上でサンプルコードをwidgetにして、テンプレートに入れてどんな動きができるのかを試してみたりしています。

変数の動きだけのサンプルコードは、新しいブログを開設して軽い状態で確認表示したりしています。

そんな感じで勉強しています。とても難しいです。サイトに限らず、設計できてないとたぶん使いこなせないかも。なんて感じてます。エンジニア向けだなって。

サイト運営者の方の個人ブログでmtde.info の、できる経緯も合わせて読まれるといいですよ。

簡単に引用マークアップ(blockquote要素)を生成できる-javascriptで紹介している引用マークアップを生成 - 徒書のカスタマイズしたものを少し変更しました。

引用表示を簡単にするjavascript ブックマークレット

以前は引用元が表示されませんでしたが、今度は引用元も生成されます。

blockquote bookmarklet

Grid表示できるjavascript ブックマーク

最近みつけたjavascript bookmarkletは、表示しているサイトにGridを表示できるようにするものです。マウスでグリッドの位置も移動できます。

Grid bookmarklet

すべてのブックマークにキーワードを指定しておけば、[Alt]+[d]でURLを選択し、[キーワード入力]+[enter]でブックマークが簡単に使えます。

Firefoxでちょっと使えるショートカットとブックマークでも紹介しています。

vimperatorをお使いの方は、[o]を押して（:open)の、キーワード入力で簡単にブックマークを呼び出せます。

Firefox検索ショートカット

他にも、firefoxでは、さまざまなサイトの検索にもキーワードしていできるのでそちらにもキーワードをあてています。

例えば、はてなブックマークのタグ検索にカーソル移動して、右クリックでコンテキストメニューの中から、[この検索にキーワードを設定]を選択。キーワードをhbtagで指定して保存。

あとは、[Alt]+[d]でURLを選択し、hbtag+[スペース空ける]+[探したい情報のタグ入力]+[enter]ではてなタグ検索結果を表示できたりします。
vimperatorだと、[t]での:tabopenで使うと別タブで検索結果を表示できます。そんな感じで、さまざまなサイトの検索窓での検索を使ったりもできます。

Tumblrにアカウント作って、楽しんでいる方多いですよね。reblogが面白いのもあるし、気に入った写真などがあったときに、簡単にクリップできたりするのに魅力を感じます。Firefoxを使っている方は、brazilさんがリリースされているアドオンでTomblooUsage - tombloo - Google Codeを入れておくととても簡単にtumblrへポストできるようになります。

さて、今回は、tumblrを使って自分のfavorite Galleryを作ってみることについて紹介します。実際に作ってみたのがこちら→web gallery

所要時間はトータルで2時間ぐらいです。（90サイト近くのキャプチャを取得してポストする時間も入れて）ほとんど、目的のデザインばかりを探すのに時間がかかったぐらいでｗ。今回は、BK+Grayでtypography、Gridデザインを意識したWEBサイトばかりを集めてみました。

（※1日にtumblrにアップできるイメージファイルの容量制限があるので真面目にアップしても1時間もかからないです。）

ゆるい感じでつながることができるTwitter、ネット上のカフェって感じですかね。早いもので参加して１年経ちます。Twitter ブログパーツ（Badgesカスタマイズ）と素材のエントリーリリースも昨年の４月３０日。およそ１年経ってTwitterブログパーツ（iPhone仕様）-iTwitter（iTwitter (β): a twitter feeder which looks like iPhone）が完成しました。

jQueryを使って、とてもシンプルなスクリプトとして出来上がっています。1.2からjsonの読み込みも簡単になったみたいでコードの理解もしやすいです。

ボタンをクリックすると各タイムライン切り替え表示、friendsリスト（１００人まで※今回バージョンアップ）が表示されるようになります。

追記：6月1日　Twitter APIの仕様が変わったようですね。毎回ページをリロードする度にtwitterへのログインを求める表示がでます。サイト訪問者にも表示されるようなので、しばらくの間止めておきます。もし、お使いの方がみえましたらその旨、ご了承願います。

• Get the public timeline
  ユーザー全員のタイムライン表示
• Get the user's twitter
  自分のタイムライン表示
• Get the user's twitter and friends'
  自分を含め友達のタイムライン表示
• Get the user's friends list

friendsリスト表示（１００人まで）

Firefox,Safari,IE7はもちろんIE6でもちゃんと表示機能されます。

Twitterでやり取りをするようになったTwitter / yungsangにすべてスクリプトを作って頂きました。感謝です。
※yungsang/IE 上で透過 PNG を正しく透過させるためのライブラリIEPNGFIX.js を作成した方です。今現在は、名称PNG-TRに変更
About PNG-TR（PNG-TR について） - PNG-TR | Google グループ

デザインを私が担当し、スクリプトをTwitter / yungsangに。つい最近わがままを言って以前からリスト表示したい旨を伝えたら、あっさりと対応するように作っていただけました。

使っている画像は、すべてpngです。IEでの透過png処理（PNG-TRにて）して、その要素でのマウスイベントについても対応してあります。

1分毎に最新のタイムラインをリクエストするようにも作られていますので、リロードすることなく、最新ポストを見ることができるようになっています。

ブログパーツの設置・フラッシュ版・AIR版について紹介しておきます。

大抵はlivedoor Readerからはてぶ人気エントリーのフィードを読むのですが、最近朝出かける前に簡単に人気記事をはてなブックマークからチェックして、それをココあとで を使ってライフハック - 時間を有効に使って情報を読む方法で紹介している方法で気になるエントリーの本文を携帯メールに送り、携帯で記事を読むようにしています。

はてなブックマークページを閲覧をするときは、キーボードショートカットを使っています。livedoor Readerと同じようなショートカットなので意外と便利でサクサク読みたい記事にピンをつけて、元記事を一気に開いて、全文選択して内容を携帯のメールに送っています。

キーボードショートカット機能

はてなブックマークの利用に慣れて来たら、ショートカットキーを使ってみましょう。ショートカットキーを使うと、はてなブックマークの各ページ、例えば人気エントリーページで公開されているエントリーをすばやく読んでいくことができます。

基本的な使い方は、j キー と k キーでエントリーを移動、気になるエントリーに x でピンでマーキングし、o でまとめて開く...という流れです。

はてなブックマークのキーボードショートカットで今日新しい発見をしました。[j][k]で記事を順に選択できるようになっています。ピンをつけても付けなくても、記事が選択されている状態なら[o]で別ウインドウ（新しいタブ）で元記事が開きます。

Shift＋[o]でブックマークコメントページも開くことがわかりました。同時に二つのページが開くということです。

はてなブックマークのページ閲覧でキーボードショートカットを使っている方がいましたら、試してみてください。