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

メールアドレスが公開されることはありません。

関連記事

ブログのエントリーをGREE日記に自動投稿する「RSS2GREE」

最近、マザース上場が決まったからという訳ではないですが、GREEを結構使っています。 @see GREEはSNSから携帯ゲームサイトに方向転換してマザーズ上場!? で、GREEの日記はだいぶ前にこのブ …

第11回:引用(blockquote)を簡単にするブックマークレット

前に書いたリンクタグを生成するブックマークレットにも関連するんだけど、ブログを書く上で頻繁に行う引用の手順を簡単にしてくれるブックマークレットを作ってみようと思う。 通常は、引用するサイトの「URL」 …

動画を楽しもう!(Youtube のHD動画を色/サイズをカスタマイズした上でembedできるブックマークレット)

少し前にdrikinさんが作られたYoutubeのHD動画をembedするブックマークレットを紹介しました。 で、モダシンさんからHD動画がなかったらSD動画のembed出してほしいとか、いしたにさん …

動画を楽しもう!(Youtubeでダウンロード可能なファイル形式が一目瞭然になるGreasemonkey)

[2009/05/26:追記] YouTube Downloader を 高画質FLV(fmt=35)に対応した最新版にupdateしています。 インストールはこのエントリーで紹介しているURLと同じ …

表と裏、2回撮影して1枚の写真にするiPhoneアプリ「Frontback」とEmbed用ブックマークレット自作

いつもよく見ているブロガーさんたちの間で昨年末あたりから流行の兆しがあったものの、フロントカメラを使うということで自撮り(海外ではセルフィー selfie)に抵抗のある自分としてはスルーかなと思ってた …

スポンサードリンク

スポンサードリンク