PhotoPinの写真をDraftPadに書き込むブックマークレット PhotoPinTaker(暫定版)
【iPhone】DraftPadアイキャッチ画像取得の方法はこれで決まり!アシスト「Search Photo Pin(Puffin)」 | iPhoneとマヨテキメモみなさん、こういうことをしておられたのか。知らなかったです。
::Books have knowledge, knowledge is power, power corrupts, corruption is a crime,,,:: Photo by » Zi...
Photo Pin : Free Photos for Bloggers via Creative Commonsアイキャッチ画像が揃っている、ブログ向け写真検索のPhotoPin.com。カッコいいのが出てきます。ただiPadでは反応しない。これは淋しいじゃないですか。
Search millions of Creative Commons photos from Flickr and add them to your blog posts easily.© 2012...
そんなわけで、ブックマークレットを作ってみました。画像を抜き出しプレビューし、選んだ写真をimgタグでDraftPadに書き込むスクリプトです。以前作ったImageTakerを応用してみました。名前は「PhotoPinTaker」で。
javascript:b=document.getElementsByClassName('preview_img');a=new Array();for(i=0;i<b.length;i++)a[i]=b[i].href;for(i=0;i<a.length;i++){c=document.createElement('img');c.alt=a[i];c.src=c.alt.replace('.jpg','_m.jpg');c.width=180;c.addEventListener('click',function(d){location.href='draftpad:///insert?caret=<a href=\"'+d.target.alt+'\" target=\"_blank\"><img width=500 src=\"'+d.target.alt+'\"></a>'});document.body.appendChild(c);document.write('<b> </b>')}
DraftPadに画像タグを貼るブックマークレット ImageTaker
まずは普通にSafariで検索。
ブックマークレットを実行すると写真が並びます。Flickrにある元画像を抜き出すので、時間がかかるのがタマにキズ。WiFi回線じゃないと辛いかも。
Pomegranate | Flickr - Photo Sharing!
欲しい写真をタップするとDraftPadに切り替わり、タグが埋め込まれます。これをブログにアップすればアイキャッチの完成。ただし、画像をタップすると元画像を開く仕様。Flickrサイトに飛ばしたいけど、画像とサイトの関連が分からなかった(Googleで検索すれば出てくるのに)。今後の課題ということで。
widthで幅を500に固定してますが、その部分は必要に応じて書き換えてください。とりあえず、クレジットはリンク作成用ブックマークレットで対処。
javascript:link='<a href="'+location.href+'">'+document.title+'</a>';location.href='draftpad:///insert?caret='+encodeURIComponent('\n'+link+'\n');
Title: PhotoPinを検索 URL: http://photopin.com/search/<@>
(追記)なんとかクレジット表示に対応できました。
PhotoPinの写真をDraftPadに書き込むブックマークレット PhotoPinTaker(完成版)