はてなダイアリーガイド「はてなフォトライフと合わせて使う」
はてなフォトライフ
携帯で撮った写真など、画像を登録してアルバムのように一覧できる『はてなフォトライフ』。300MBまで無料で、有料オプションで容量を拡大できます。くわしくははてなフォトライフのヘルプをご覧ください。
これもトップページのFlashでいろんな写真を見たり、色別写真一覧を眺めたりと、ついつい長見してしまうサイトです。はてなの近藤社長が元プロカメラマンということもあってか、機種別写真一覧などこだわりのある多彩な機能も写真好きには魅力。他のユーザーの写真にお気に入り投票(vote)すると、自分のお気に入りページで一覧できたりもします。
日記にはてなフォトライフの写真を表示する
『f:id:ユーザー名:画像のID:image』という書き方で、日記にフォトライフの画像を表示できます。例えば
f:id:hatenadiary:20041007101545j:image
と書くと(自分のフォトライフの設定で『画像情報を表示』をチェックしていれば、この『f:id:〜〜』というコードがフォトライフの画像ページに表示されています)、
のようになります。画像はリンクになっています。さらに後ろに『:w〜〜』と書くことで表示する画像の横幅を決められます。例えば
f:id:hatenadiary:20041007101545j:image:w100
と書くと
のように画像の横幅が100ピクセルになります。ただし読み込んだ画像ファイルをブラウザが小さく表示しているだけなので、画像のサイズ(重さ)は変わりません。
『:w』のところを『:h』と書けば、縦のサイズを指定できます。
また、
f:id:hatenadiary:20041007101545j:image:small
と書くと
のように、サムネール用の小さなGIF画像になります。
編集画面の『Fotolife』ボタン
日記の編集画面の『Fotolife』ボタンをクリックすると(WebブラウザでJavaScriptがオンのときのみ作動)、別ウィンドウが立ち上がります。
- 『タイトル』欄は、フォトライフ画面上で表示されるその画像のタイトルです。後からフォトライフの編集画面でも編集できます。入力しなくてもかまいません。
- 『画像サイズ』欄は、画像をあるサイズに縮小して登録したい時に使います（元の画像サイズより大きなピクセル数で指定しても拡大されません。また小さく登録された画像を大きく戻すことは出来ません）。入力しなくてもかまいません。
- 『参照』ボタンを押し、出て来た画面であなたのパソコン上の画像ファイルを指定します。JPEG・PNG・GIFファイルをアップロードできます。
- 『フォルダ』は自分のフォトライフの中で写真を分類する機能です。特に変更しなくてもかまいません。
参照するファイルを選んだあと、『アップロード』ボタンを押すと、あなたのフォトライフに画像ファイルが登録されます。
さらに先ほどのフォトライフの画像を表示するコード（f:id:~~:image）が、日記の編集画面に挿入されます。これによって、１日に複数の画像を登録することができます。
- 【補足】『参照』ボタンを押さず入力欄にウェブ上にある画像ファイルのURLを直接指定することもできます。ただし他人の作った画像ファイルをアップロードしてしまうと著作権侵害行為となり、はてなの利用規約違反になります。
- 【参考ページ】キーワード「はてなフォトライフ」にはてなフォトライフ画像の枠線・下線をスタイルシートで消す方法があります。
サイドバーにフォトライフの写真を表示する
かんたんデザイン設定の「モジュールを選択」から「フォトライフ」を選ぶと、自分のフォトライフの写真を表示することができます。
ヘッダ・フッタをカスタマイズしている方は、かんたんデザイン設定を利用するとヘッダ・フッタの内容が上書きされ、消えてしまいます。詳細デザイン設定のほうでhatenaタグによるモジュールの設置をしてください。
<hatena name="rss" template="hatena-photo" url="http://f.hatena.ne.jp/ユーザーID/rss" listlimit="5">
のように記入してrssモジュールを設置することで、はてなフォトライフの更新情報を取得し、写真を表示することができます。この方法では自分以外のユーザーも指定できます。
- 【関連ガイド：CSSによる見栄え変更】このtemplate="hatena-photo"を指定したrssモジュールは「template="hatena-module"」を指定したphotoモジュールとほぼ同じHTML構造で、キーワード「photoモジュール」の「写真を横に並べたい」「縦一列に並べたい」等の指定方法が効きます。CSSカスタマイズの際は応用編CSSセレクタ - photoモジュールをご参考にどうぞ。
フォトライフにリンク・トラックバック
『f:id:ユーザー名:画像のID』という書き方で、日記にフォトライフの画像ページにリンクできます。例えば
f:id:mitsuki:20030320153245j
と書くと、
のようになります。リンクをすると、その画像ページに自動トラックバックが送られます。
- 【補足】画像のIDは、その画像のページのアドレスになっている14ケタの数字です。アップロードした画像に画像情報（EXIF情報）がある場合は、撮影時刻（DateTime）が画像ページのアドレスになります(年月日時分秒)。ない場合は、はてなフォトライフにアップロードしたときの時刻情報がアドレスになります。数字の後にJPEGかGIFかPNG画像であることを示す「j」「g」「p」いずれかの文字がつきます。
はてなアンテナと合わせて使うに戻る← | →はてなブックマークと合わせて使うに進む
d.hatena.ne.jp