Creazy!

WEBエンジニア・ヤガーのテック・ガジェットブログ

Bookmarklet 開発実績

Tumblr複数アカウント対応:ログインするアカウントを指定できるtumblrブックマークレット

投稿日:


この頃、tumblrの有効な活用方法を見つけるべくゴニョゴニョしているわけだけど、複数のアカウントを持っていると、今どのアカウントでログインしているか分からないし、別のアカウントでreblogしてしまったりしていた。
そこで、特定のアカウントで tumblr. するための Bookmarklet を作ってみた。

Tumblr.ログインの仕組み

Tumblrはログイン系、ポスト系のAPIが見当たらないのでHTMLを見てみました。
ログインは(http://www.tumblr.com/login)にemailとpasswordを渡してやれば良いんだけど、HTTP_METHODがPOSTじゃないといけないので、リンクだけでは実現できない。以下のようなフォームをポストしないといけない。

<form name="f" action="http://www.tumblr.com/login" method="post">
<input type="hidden" name="email" value="YOUR_TUMBLR_ACCOUNT" />
<input type="hidden" name="password" value="YOUR_TUMBLR_PASSWORD" />
<input type="submit" value="login" />
</form>

ただ、ローカルにHTMLをいっぱい作っとくのも面倒なのでこの辺をBokmarkletで動的に作れれば良さそうだ。

ログインするアカウントを指定できるtumblrブックマークレット

上記ふまえて、ブックマークレットを作りました。
今回ブックマークレット中にemail、passwordを埋め込んでもらう必要があるので以下書き換えてからブックマークして下さい。

javascript:(function(){tid='YOUR_TUMBLR_ACCOUNT';tpw='YOUR_TUMBLR_PASSWORD';var d=document,w=window,e=w.getSelection,k=d.getSelection,x=d.selection,s=(e?e():(k)?k():(x?x.createRange().text:0));tbq=encodeURIComponent(s);var js=document.createElement('script');js.src='http://labs.creazy.net/bookmarklet/tumblr.js';document.body.appendChild(js);})();

YOUR_TUMBLR_ACCOUNTをログイン用のemailアドレスに、YOUR_TUMBLR_PASSWORDをログインパスワードにそれぞれ書き換えてからブックマークしてください。
たぶん、IE、Firefox、Safari、Operaでも動く。
ブックマークレットの内容としては、ID、PW、引用テキストを読み込んでから強制ログイン用のiframeやformを作っています。外部JSを取り込む形式にしているので、中身が怖い(w)という人は下記を除いてみて下さい。
http://labs.creazy.net/bookmarklet/tumblr.js
使い方は下記の通り。
1)いつも通り、引用部分を選択したりしてから、上記ブックマークレットを実行します
01
2)ログイン用のフレームが現れ、指定されたアカウントのログインが始まります
02
3)インラインフレームがログイン完了し、指定したアカウントになってたらOK
03
4)「Reblog」ボタンをクリックすると、いつものTumblrブックマークレットが開きます
ログインを挟む分、1 Step 多いですが格段に便利になりました。
これで、複数アカウントそれぞれのブックマークレットを設置しておけば、それぞれのアカウントでタンプレます。
今回使った手法はAjaxとかではなくて、iframeを使った割と古典的なハック方法。
でも、まだまだ使えるね。こりゃ。
あとあと、ブラウザによってURLencodeの動きが違ったので、分岐処理やらが入っていてコードが汚いけど、その辺はご愛嬌。
ツッコミ大歓迎でございます。
(2007/11/14 追記)
FIrefoxで「unterminated string literal」エラーがでてうまくいってませんでした。
JS中にHTMLをinnerHTMLで流し込むところがあるんだけど閉じタグとかを
“</span>” → “</sp”+”an>” みたいにしとくと良い。
Firefoxユーザのみなさんスミマセンでした。登録したブックマークレットはそのままでOKっす。

・「Photumblr」Tumblrの画像だけ抜き出してRSSにするPipes
・「Gyazo」と「Gyamblr」を更にブロガー最適化する方法
・ 優れたソーシャルメディアは多様な使われ方をするもの
・Twitter,Jaiku,Tumblr で RSS を無限ループさせてみた
・ミニブログ (Twitter,Tumblr,Jaiku)をRSSアグリゲータとして使い倒す
・twitter とか tumblr. とか Vox とかを試してみた

-Bookmarklet, 開発実績

執筆者:


comment

メールアドレスが公開されることはありません。 ※ が付いている欄は必須項目です

関連記事

「Photumblr」Tumblrの画像だけ抜き出してRSSにするPipes

Tumblrの転載問題とか、完全にスルーしてエントリーしますw Tumblrを介して画像集めを楽しんでいる人がたくさんいるようで、そんな画像をうまくみせてくれるビューワーがいくつかでていました。それぞ …

Mastodon(マストドン)にワクワク/ランキング並び替えブックマークレット

先週あたりからTwitterっぽいSNSとしてMastodonが話題となっています。Githubにオープンソースとして公開されており誰でも自分のサーバーにインスタンスを立ち上げられる「分散型プラットフ …

ドコモ携帯電話でTumblrのDashboardが見れる「mblr(モブラー)」をPHPで書いた

ボクは通勤時間が1時間ちょいはかかるので、もっぱらモバツイとかでTwitterを見てヒマをつぶすんですが、前からTumblrも見たいなーと思っていたんです。で、ガラパゴスケータイであるドコモユーザーと …

【更新】Flickr画像をすばやくブログにコピペするためのHTMLを表示する「FlickrQuickEmbed」

ボクもほぼ全ての写真を保存していて、ブログへも直接貼り付けているFlickrが新UIを試しているのですが、評判がかなり悪いようです。 Flickrの新しいデザイン(UI)に困っています – …

AmaQuickのChrome拡張機能版(v6.0.2)を復活公開しました

2017年3月に公開を停止していたAmaQuick Chrome拡張機能版を、v6.0.2として再公開いたしました。 Contents1 主な変更点1.1 API不要で動作するように改善1.2 レイア …

スポンサードリンク

スポンサードリンク