|
Flickr の写真をブログに貼り付けたいときに便利なブックマークレットを書きました。 通常は、最新の fr(2) または img2html をご利用ください。(2010/9/26更新) ・fl = そのウインドウで画像のみを表示する版 ・fH = HTML ソース生成版 ・fr = title/width/height 対応ソース生成版(5/5追記) ・fr(2) = Flickr 新インターフェース対応版(7/22追記) ・img2html = Flickrに限らず、Picasaなど汎用に使える版(9/26追記) ブックマークレットを書いてみた背景デジカメで撮影した写真をブログで使う際、まず flickr にアップロードして、 flickr が横幅500ピクセルに縮小してくれた画像ファイルを使っています。 (flickr へのアップロードは、flickr Uploadr か、iPhoto を使ってます) しかし、ドラッグで領域選択して Note や Person など写真の注釈を入れるモードが flickr に追加されてから、photo-drag-proxy のレイヤーが優先されてしまうみたい。 flickr にログインしているときだけ有効かな? でも、いちいちログアウトしたり、ブラウザ変えたりしたくないし。 これらのブックマークレットで、簡単に flickr 画像をダウンロードできるようになる。 fl = そのウインドウで画像のみを表示する版flickr の写真の詳細ページで、HTML 表示から、画像 JPEG のみの表示に切り替えて、 そこに表示されている写真のみを表示するためのブックマークレットです。 [fl] ↑のリンクをブックマークツールバーにドラッグ&ドロップしてください。 IE8 では、右クリックして「お気に入りに追加」で「お気に入りバー」に追加してください。 flickr の写真詳細ページ(例えばここ)で、このブックマークレットをクリックして使います。 fH = HTML ソース生成版あるいは、写真をダウンロードせずに、flickr 上の画像ファイルを直接参照させる場合は、 HTML ソースを生成した方が便利かも? と思って書いてみたのがこちら。 [fH] ↑のリンクをブックマークツールバーにドラッグ&ドロップしてください。 このブックマークレットは、以下のように a タグ+img タグを書いてくれます。 flickr の写真詳細ページへのリンク付きの画像表示の HTML です。 ![]() fr = title/width/height 対応ソース生成版(5/5追記)title 属性で写真の名前、画像サイズに合わせて width・height 属性もつけるバージョンです。 [fr] ↑のリンクをブックマークツールバーにドラッグ&ドロップしてください。 以下のように、img 要素に title・width・height 属性が付きます。 ![]() fr(2) = Flickr 新インターフェース対応版(7/22追記)Flickr で新しいインターフェースが使えるようになりました。 デフォルトで表示される画像(medium)が500ピクセルから640ピクセルに大きくなっています。 また、HTML が変わって、table 組みから div+css になっています。 新インターフェースでは、従来のブックマークレットでは対応しません。 新インターフェースに対応した新バージョンのブックマークレットはこちら: [fr] なお、このブックマークレットは、旧インターフェースでも使えます。(新旧どちらでも動作) *English translation of this post is here. |
| << 前記事(2010/05/04) | ブログのトップへ | 後記事(2010/05/09) >> |
| タイトル (本文) | ブログ名/日時 |
|---|
| 内 容 | ニックネーム/日時 |
|---|---|
はじめまして。ひとぅと申します。 |
ひとぅ 2010/09/14 05:31 |
こちらで提供されているブックマークレットをもとに改変・再配布されているものを当方にてさらに改変し、以下のブログ記事にて再配布致しましたので、ご連絡申しあげます。 |
asazuki 2011/08/08 15:51 |
| << 前記事(2010/05/04) | ブログのトップへ | 後記事(2010/05/09) >> |