«« こんにちはアン〜アンと連続する死亡事件(ネタバレ) | マクロスフロンティア劇場版(上)を見ました(※ネタバレあり) »»

今見ているホームページのサムネイルをブログに貼付けるのに役立つブックマークレットを作ってみた

2009年11月15日

このエントリーをはてなブックマークに追加
サイトのサムネイルやブックマークを作成するwebサービスHeartRails Captureを利用するブックマークレットを作成してみました。これでブログでのサイト紹介でホームページのキャプチャー画面を素早く掲載できますぞ!!


ブログ等で、どこかのサイトを紹介するのは良くある話。

その際にサイトの紹介文だけでなくサムネイル(=キャプチャー)画面も一緒に添えていると説得力がグッと増します。

とはいえ、いちいち自力でPrintScreenを毎回するのも面倒なので外部のWebサービスを利用してちょちょいと作りましょう!

個人的に大体数秒でサイトサムネイルが画像を作成してくれるHeartRails Captureがお気に入り(サービス提供者様ありがとうございます!)。

http://capture.heartrails.com/

ただ最近いちいちフォーム欄へ毎回URLを打ち込むのも面倒になってきたので、URL入力が省略できるブックマークレットを作ってみました。


javascript:( function() { var code = document.body.innerHTML; var act = document.createElement('form'); act.action = 'http://capture.heartrails.com/help/make_thumbnail'; act.method = 'post'; act.name = 'bookmarklet'; act.id = 'bookmarklet'; var hid1 = document.createElement('input'); hid1.type = 'hidden'; hid1.name = 'enter[url]'; hid1.value = location.href; act.appendChild(hid1); document.body.appendChild(act); document.getElementById('bookmarklet').submit(); } )();

※SafariとFirefoxにIE6で動作確認をしました。

なおブックマークレットについて補足説明します。
ブラウザのお気に入りから何らかのサイトを選択しますと、普通はそのサイトに移動します。
しかし、お気に入りのURLが記載されているところにJavaScriptを記入し、場合によっては外部Webアプリと連携させる事で色々ちょっと便利な事をさせる事が出来る!というのがブックマークレットです。

今回の場合、

1.適当なお気に入り(=ブックマーク)を作成し、名前を「サイトキャプチャー取得」とか何かつけます

2.先ほど作成したお気に入りのURLへ先ほどのソースコードを代入します

3.次回以降、サムネイル作成したいサイトで先ほどのお気に入りを実行させると、HeartRails Captureへ転送し、サムネイルをゲットする事が出来るかもしれません。

というように使って下さい。

ちなみにHeartRails Captureでは、サムネイルを作成する他にPDFを作成する事が出来るらしいのですが、このブックマークレットにはそのような機能はありません。
先ほどのソースコードをもう少し見やすくした物を置いてみますので、よろしければ改造のご参考にしてください(著作権は主張しませんので、承諾なく自由に利用してくださって構いません)。


javascript:(
	function() {
		var code = document.body.innerHTML;
		var act = document.createElement('form');
		act.action = 'http://capture.heartrails.com/help/make_thumbnail';
		act.method = 'post';
		act.name = 'bookmarklet';
		act.id = 'bookmarklet';
		
		var hid1 = document.createElement('input');
		hid1.type = 'hidden';
		hid1.name = 'enter[url]';
		hid1.value = location.href;
		act.appendChild(hid1);
		document.body.appendChild(act);
		
		document.getElementById('').submit();
		
	}
)();


このコード作成には、『ブックマークレットに関する質問です 「ブラウザで現在表示しているページのソースを、特定のCGIにPostするブックマークレット」 上記は可能でしょうか? また、もし可能で.. - 人力検索はてな』を参考にしました。
ありがとうございます。

ブックストッパー
ブックストッパー
posted with amazlet at 09.11.15

トモエ算盤
売り上げランキング: 462
おすすめ度の平均: 4.0
4 なかなかよい
5 ダイエットのお供?
4 ナイスな商品。だが強力な本には1個では力不足
4 なかなかアイデア商品である
5 良くできています


投稿者 kuze : 2009年11月15日 11:01


■このエントリーに関連した記事

■「実用ソフト&サイト」カテゴリの最新記事

«« こんにちはアン〜アンと連続する死亡事件(ネタバレ) | マクロスフロンティア劇場版(上)を見ました(※ネタバレあり) »»


自己紹介
PHPやVBによるコーディングやシステムエンジニアを仕事にしています。
主にiPhoneアプリの紹介やWeb開発などのPC系の話題と、アニメやゲームなどのサブカルな話題を取り扱っています。

[PR]

instagram

カテゴリ

最近のエントリー

最近掲載した画像
  • 『閉鎖病棟~それぞれの朝~』見たけどセキュリティ緩すぎ(ネタバレ)
  • RSSリーダーInoreaderで知りたいニュースを効率的にチェック
  • RSSリーダーInoreaderで知りたいニュースを効率的にチェック
  • 任天堂の新フィットネスゲーム『リングフィットアドベンチャー』は今回も筋肉に効きます!
  • 任天堂の新フィットネスゲーム『リングフィットアドベンチャー』は今回も筋肉に効きます!
  • 映画JOKER見てきたけど気持ち悪い・出来いいけど(ネタバレ)
  • 「ウィンドウ位置記憶プログラム」で、ブラウザを付箋のように並べてサーバー監視環境を改善してみた
  • ラーメンを食べきるには(天下一品祭り編)
  • ラーメンを食べきるには(天下一品祭り編)
  • ラーメンを食べきるには(天下一品祭り編)
  • 仕様図作成にMarkdownやAdobe XDなどを活用してみる

RSS
更新情報はRSSをご利用下さい