• RSS
  • Twitter
  • Facebook
  • Google+
  • Tumblr
  • YouTube
なのかもブログはAppleやWeb関連情報を中心に、おもしろ動画や音楽に関することまで様々な話題をお伝えするブログです

ハンサムクロジ

左の画像、ひどく胡散臭いですね! 私がこのNANOKAMO BLOGの主であるハンサムクロジです。

MacやiPhone、音楽や面白い動画なんかにも興味津々な20代男性。普段はアップスというサイトでアプリのレビューやニュース記事を執筆している暇ライターでもあります。「ハンクロさん」と呼んでください!!

Facebookはこちら。本名は全く違いますが、慌てなくても大丈夫。よろしくどうぞ!

ブログ執筆を効率化! 各種ブックマークレットを登録できる便利な拡張機能『Chrome Keyconfig』を使いこなそう

photo credit: pj_vanf via photo pin cc

どうも@kuroji1987です。

ショートカットーキーでChromeを便利にする拡張機能『Chrome Keyconfig』。

今回は、僕がその『Chrome Keyconfig』に設定しているブックマークレットやショートカットを全てご紹介したいと思います。

ブログの執筆スピードを加速させましょう!

『Chrome Keyconfig』とは

Chrome Keyconfig』は、好きなショートカットキーに様々なアクションを振り分けることができるChromeエクステンション。

ブックマークレットを起動したり、リンクを作成したりと、ブログを書く上でのちょっとした手間を省いてくれます。

こちらからインストールして、拡張機能のオプションから各種ショートカットを設定します。

上の画像だと「Shift+AM」で「Amazon画像」という名前のURL(正確にはブックマークレット)を開く、というアクションが追加されたことになります。

利用できるアクションはこんなにたくさん! ブックマークレットを利用する場合は「go to #1」を登録すればOKです。

ここで追加したショートカットキーとアクションは、登録以後に開いたページで利用できます! 便利!

登録しているブックマークレットやアクション

ということでさっそく僕が登録しているアクションをご紹介いたします! かっこ内はショートカットキーです。

Amazon画像(Shift+AM)

拡大表示できるAmazonの画像を、大きいサイズで保存するブックマークレットです。詳しくはTools 4 Hackさんでどうぞ!

iTunesのジャケット写真用ですw

javascript:void(window.open('http://z-ecx.images-amazon.com/images/P/'+document.getElementById('ASIN').value+'.09.MAIN._FMpng_SCRMZZZZZZ_.png'));

AppHTML(Shift+AP)

アプリ紹介用のリンクを作成するブックマークレットです。NANOKAMOブログではAppStoreHelperを使っているのですが、AppStoreHelperはリンクシェアIDを1つしか登録できないので、アップス!!!用にこちらを使っています。

ブックマークレットは@hiro45jpさんが作成されたものです。いつもお世話になってます!

Facebook(Shift+F)

公式サイトで登録できる、Facebookにシェアするためのブックマークレットです。どんなページでもガンガンシェアできますよー!

javascript:var%20d=document,f='http://www.facebook.com/share',l=d.location,e=encodeURIComponent,p='.php?src=bm&v=4&i=1333126074&u='+e(l.href)+'&t='+e(d.title);1;try%7Bif%20(!/%5E(.*%5C.)?facebook%5C.%5B%5E.%5D*$/.test(l.host))throw(0);share_internal_bookmarklet(p)%7Dcatch(z)%20%7Ba=function()%20%7Bif%20(!window.open(f+'r'+p,'sharer','toolbar=0,status=0,resizable=1,width=626,height=436'))l.href=f+p%7D;if%20(/Firefox/.test(navigator.userAgent))setTimeout(a,0);else%7Ba()%7D%7Dvoid(0)

Google+

Google+にシェアするためのブックマークレットです。Google+で公式にリリースされていたものを使っています。

以下をアクションに登録するだけです。

javascript:void window.open('https://plus.google.com/share?url=' + encodeURIComponent(location.href), '_blank', 'width=500,height=500')

パーソナライズオフ

Googleのパーソナライズ検索をオフにするブックマークレットです。

Googleはそれぞれのアカウントに合わせた検索結果になるようにページをパーソナライズしているのですが、それをオフにして標準の検索結果にするというのがこのブックマークレットでございます!

以下を登録すれば利用できます。

javascript:(function(){location.href=location.href+'&pws=0'})();

カエレバ(Shift+K)

Amazonや楽天のアフィリエイトリンクを作成するサービス「カエレバ」を利用するためのブックマークレットです。

こんな感じのリンクをすぐに作れます!

以下を登録すればオッケー!

javascript:window.open('http://kaereba.com/blogparts/?&url='+encodeURI(document.location.href));undefined;

Link(Shift+L)

閲覧しているページへのリンクを簡単に作成するアクション。下のようなリンクを簡単に作れます。

NANOKAMO BLOG

こちらはブックマークレットではなく、『Chrome Keyconfig』自体のものなので、アクションリストから直接選びましょう。「copy url and title by custom tag #tag」を使えば好きな形式でリンクを作成できます。

僕は独自のフォーマットに設定しています。class指定しているので、iPhoneから見るとちょっとだけフォントが小さくなっています。

<p class="sansyo">[<a href="%URL%" target="_blank">%TITLE%</a>]</p>

Link 2(Shift+LL)

こちらはカスタマイズせずに、そのまんまのリンクを作成するアクションです。

わざわざ独自のフォーマットを設定する必要もないのですが、あとで改造したくなる可能性も考慮して下のような形式を使っています。

<a href="%URL%" target="_blank">%TITLE%</a>

サイト内検索(Shift+NS)

どんなサイトでもGoogleのサイト内検索を利用できてしまうというブックマークレットです。下のように検索ボックスが出現して、そのまま検索できてしまいます。

こちらで紹介されていました!

以下のように記述すればオッケーです。

javascript:(function%20()%7Bvar%20frm%20=%20document.createElement(%22form%22);frm.style.position=%22absolute%22;frm.style.top=%2210px%22;frm.style.left=%2210px%22;frm.style.zIndex=999999;frm.style.width%20=%20%22300px%22;frm.action%20=%20%22http://www.google.co.jp/search%22;var%20q%20=%20document.createElement(%22input%22);q.type%20=%20%22text%22;q.name%20=%20%22q%22;q.style.width%20=%20%22200px%22;q.ondblclick%20=%20function()%7Bfrm.parentNode.removeChild(frm);%7D;frm.appendChild(q);var%20hid%20=%20document.createElement(%22input%22);hid.type%20=%20%22hidden%22;hid.name%20=%20%22as_sitesearch%22;hid.value%20=%20window.location.hostname;frm.appendChild(hid);var%20sub%20=%20document.createElement(%22input%22);sub.type%20=%20%22submit%22;sub.value%20=%20%22%E6%A4%9C%E7%B4%A2%22;frm.appendChild(sub);document.body.appendChild(frm);q.focus();%7D)();

引用(Shift+Q)

引用したい部分を選択してこのブックマークレットを起動すれば、そのページのリンク付きのものを好きな形式で貼り付けることができます。こんなかんじ。

この良質のタンパク質というのは必須アミノ酸のこと。必須アミノ酸は、人間の体の中で合成することができず、かならず食事から摂らなければなりません。

via:NANOKAMO BLOG

これは以下のページで作成しました。便利すぎるツールです。お世話になってます! あざす!

僕と同じフォーマットは以下のブックマークレットになります。気に入らない場合は自作しちゃってください!

javascript:(function(){var ele=document.createElement('textarea');ele.style.width='100%';ele.value='<blockquote>'+window.getSelection()+'\n\n<p class="inyo" align="right">via:<a href="'+location.href+'" target=”_blank”>'+document.title+'</a></p></blockquote>';document.body.insertBefore(ele,document.body.firstChild);ele.focus();ele.select();ele.ondblclick=function(){ele.parentNode.removeChild(ele);};ele.oncopy=function(){setTimeout(function(){ele.parentNode.removeChild(ele);},1);return true;}})()

ShareHTML(Shift+S)

さっきから登場している画像付きのリンクを作成するブックマークレット。下のような感じのリンクを作ることができます。念のためまた貼っておきます。

こちらはAppHTMLと同じ@hiro45jpさんのブックマークレットメーカーを使っています。

ちなみに僕のフォーマットはこちら。CSSもいじんないと同じように表示されませんので参考程度にw

javascript:(function()%7Bvar%20d=document,e=d.createElement('script'),url='http://dl.dropbox.com/u/2271551/javascript/sharehtml.js';if(!url.match(/%5C?/))url+='?t='+(new%20Date()).getTime();url+='&out='+'preview'+'&cnt='+'100'+'&sts='+'%3Cbr%3E%3Cspan%20style=%22color:%20%23808080;font-size:%2080%25;%22%3E'+'&ste='+'%3C/span%3E'+'&cts='+'%3Cbr%3E%3Cstrong%3E'+'&cte='+'%3C/strong%3E'+'&fmt='+'%3Cp%20class=%22sharehtml%22%3E%3Ca%20href=%22$%7Bposturl%7D%22%20target=%22_blank%22%3E%3Cimg%20class=%22shareimg%22%20align=%22left%22%20border=%220%22%20src=%22http://capture.heartrails.com/130x100?$%7Bposturl%7D%22%20alt=%22%22%20width=%22130%22%20height=%22100%22%20/%3E%3C/a%3E%3Ca%20href=%22$%7Bposturl%7D%22%20target=%22_blank%22%3E$%7Bposttitle%7D%3C/a%3E%20%3Ca%20href=%22http://b.hatena.ne.jp/entry/$%7Bposturl%7D%22%20target=%22_blank%22%3E%3Cimg%20border=%220%22%20src=%22http://b.hatena.ne.jp/entry/image/$%7Bposturl%7D%22%20alt=%22%22%20/%3E%3C/a%3E$%7Bpostselect%7D$%7Bmemo%7D%3Cbr%20style=%22clear:both;%22%20/%3E%3C/p%3E';e.charset='utf-8';e.src=url;e.id='bmlt';d.body.appendChild(e);%7D)();

Taberareloo(Shift+TB)

tumblrやGoogle+など様々なソーシャルサービスにシェアできるChromeエクステンション「Taberareloo」を起動するためのショートカット。

これは同エクステンションをChromeにインストールすることで設定できるようになるというものです。

下のような感じのボックスが出て、画像や記事の内容を引用してシェアすることができます。

僕はGoogle+にシェアするために利用しています。詳しくは以下の記事をご覧ください!

Twitter(Shift+TW)

Twitterにシェアするためのブックマークレットです。Bufferのエクステンションを入れていると、このブックマークレット+ワンクリックで使えてしまうという便利さもあったりしますw

以下を登録すれば使えます。

javascript:(function(){window.twttr=window.twttr||{};var D=550,A=450,C=screen.height,B=screen.width,H=Math.round((B/2)-(D/2)),G=0,F=document,E;if(C>A){G=Math.round((C/2)-(A/2))}window.twttr.shareWin=window.open('http://twitter.com/share?url='+F.location.href+'&text='+encodeURI(F.title),'','left='+H+',top='+G+',width='+D+',height='+A+',personalbar=0,toolbar=0,scrollbars=1,resizable=1')}());

copy url(Shift+Y)

ページのURLをコピーするだけのアクションをしてくれます。下のアクションを選択すればオッケー!

URLだけで貼り付けられるYouTubeやVimeoなどを利用するときに使っています。便利。

以上僕なりの設定でした

参考になれば幸いです。

もし他にもこのエクステンションを利用しているかたが居られましたら、参考にしたいのでぜひ設定を教えていただきたいです。

ということで、ブログ執筆を効率化する『Chrome Keyconfig』の使いかたでしたー!

Toshiaki Takahashi & NANOKAMO BLOG © 2013 All Rights Reserved

Designed by WPSHOWER

Powered by WordPress