【2015年版】無いと困る愛しきブックマークレット集Part2
2015年10月17日（約9年経過）
ブラウザを使って作業することが何かと増えましたよね。クラウドが発展し色んな便利なSaaSが登場したこともあって、ChromebookなどのブラウザベースのOSを搭載したPCすら登場しています。
ブラウザを使う時間が圧倒的に増えたことでブックマークレット等の便利なプチプログラムも増えましたよね。ブックマークレットを上手く活用することでより効率的なブラウザ使用が出来ます。
今回は沢山あるブックマークレットの中から、とりわけ私がよく使用している無くてはならない愛しの種類をご紹介します。主にブラウザでブログを運営している方向けです。
§1 記事紹介系ブックマークレット
ブログを更新しているとあのサイト紹介したいとか、参照先のサイトリンクを貼る事がよくあります。ただ単にURLを貼ればいいんですが、折角ならサムネイル付きでリッチに表示したいものです。ブックマークレットを使えばそんな事も簡単に出来てしまいます。
①ShareHtml
ちょっと前に流行った記事紹介ブックマークレットです。色々とカスタマイズが出来るため出力コードも自由に編集できちゃいます。ポイントはサムネイルの取得方法がキャプチャリングという点です。そのためOGP設定をしていないサイトでもほぼ100%の確率でサムネイルを取得できます。取り敢えず持っておいて損なしでしょう。カスタマイズする方は公式サイトからどうぞ：ShareHtml
javascript:(function()%7Bvar%20d=document,e=d.createElement('script'),url='http://dl.dropbox.com/u/2271551/javascript/sharehtml.js'%3Bif(%21url.match(/%5C%3F/))url%2B='%3Ft='%2B(new%20Date()).getTime()%3Burl%2B='&out='%2B'popup'%2B'&cnt='%2B'100'%2B'&sts='%2B'%3Cbr%3E%3Cspan%20style=%22color:%20%23808080%3Bfont-size:%2080%25%3B%22%3E'%2B'&ste='%2B'%3C/span%3E'%2B'&cts='%2B'%3Cbr%3E%3Cstrong%3E'%2B'&cte='%2B'%3C/strong%3E'%2B'&fmt='%2B'%3Ca%20href=%22$%7Bposturl%7D%22%20target=%22_blank%22%3E%3Cimg%20class=%22alignleft%22%20align=%22left%22%20border=%220%22%20src=%22http://capture.heartrails.com/150x130/shadow%3F$%7Bposturl%7D%22%20alt=%22%22%20width=%22150%22%20height=%22130%22%20/%3E%3C/a%3E%3Ca%20style=%22color:%230070C5%3B%22%20href=%22$%7Bposturl%7D%22%20target=%22_blank%22%3E$%7Bposttitle%7D%3C/a%3E%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%3B%22%20/%3E%3Cbr%3E'%3Be.charset='utf-8'%3Be.src=url%3Be.id='bmlt'%3Bd.body.appendChild(e)%3B%7D)()%3B
◆ 表示した例（ShareHtmlは色々カスタマイズ出来るので私の場合はこんな感じで使っています）
②ブログカード
はてなブログでURLを貼った時に表示されるカード型のデザインをはてなブログ以外でも利用できるようにされたブックマークレットです。特別な事をせずに美しいデザインでサイトを紹介できるため便利です。ポイントははてなブ数が取得できる点ですね。
javascript:prompt(%22%E3%83%96%E3%83%AD%E3%82%B0%E3%82%AB%E3%83%BC%E3%83%89%E3%81%AE%E3%82%BF%E3%82%B0%22,'%3Ciframe%20style=%22width:100%25%3Bheight:155px%3Bmax-width:100%25%3Bmargin:0%200%201.7rem%3Bdisplay:block%3B%22title=%22'%2Bdocument.title%2B'%22src=%22http://hatenablog.com/embed%3Furl='%2Blocation.href%2B'%22width=%22300%22height=%22150%22frameborder=%220%22scrolling=%22no%22%3E%3C/iframe%3E')%3B
◆ 表示した例（ブログカードの場合は基本カスタマイズ無しです）
③ +Embed
記事紹介系ブックマークレットの中では恐らく１番新しいブックマークレットです。私も今はこちらを使用していますが、１番のポイントは事前に編集ができるという点です。紹介したいサイトで実行すると生成コードとプレビューが出来ますが、この段階で要らない要素を削除することが出来ます。例えばサイト名だけ表示したいならサムネイルや要約文を削除することで可能です。
javascript:!function(a)%7Bvar%20b%3D%22embedly-platform%22,c%3D%22script%22%3Bif(a.getElementById(b))embedly.modal()%3Belse%7Bvar%20d%3Da.createElement(c),e%3D!1,f%3Dfunction()%7Be%7C%7C(embedly.modal(),e%3D!0)%7D,g%3Dfunction()%7B%22complete%22%3D%3D%3Dd.readyState%26%26f()%7D%3Bd.onload%3Df,d.onreadystatechange%3Dg,d.id%3Db,d.src%3D(%22https:%22%3D%3D%3Ddocument.location.protocol%3F%22https%22:%22http%22)%2B%22://cdn.embedly.com/widgets/platform.js%22%3Bvar%20h%3Ddocument.getElementsByTagName(c)%5B0%5D%3Bh.parentNode.insertBefore(d,h)%7D%7D(document)%3B
◆ 表示した例（サムネ＋サイト名＋要約文ありVer）
【STINEGR5子テーマ】より洗練されたSIMPLESTER Ver5を近々公開します
§2 WEB系
WEB制作などで使えるブックマークレットは沢山有るんですが、結局使うのは2つや3つぐらいだったりします。とりあえずWEB系に属する色んな種類のブックマークレットを紹介します。
① Viewport resizer
スマートフォンなどのモバイルデバイスの画面をPCでも再現できるのがこちらのブックマークレットです。出来ることはモバイルデバイスの画面サイズで表示するだけのシンプルな機能ですが、結構使い勝手がいいです。ただChromeを始め最近のモダンブラウザはエミュレート出来る機能が付いているため、最近は出番が無くなってきています。一応持っていて損なしですね。
javascript:void((function(d)%7Bif(self%21=top%7C%7Cd.getElementById('toolbar'))return%20false%3Bd.write('%3C%21DOCTYPE%20HTML%3E%3Chtml%20style=%22opacity:0%3B%22%3E%3Chead%3E%3Cmeta%20charset=%22utf-8%22/%3E%3C/head%3E%3Cbody%3E%3Ca%20data-viewport=%22320x480%22%20data-icon=%22mobile%22%3EMobile%20(e.g.%20Apple%20iPhone)%3C/a%3E%3Ca%20data-viewport=%22320x568%22%20data-icon=%22mobile%22%20data-version=%225%22%3EApple%20iPhone%205%3C/a%3E%3Ca%20data-viewport=%22600x800%22%20data-icon=%22small-tablet%22%3ESmall%20Tablet%3C/a%3E%3Ca%20data-viewport=%22768x1024%22%20data-icon=%22tablet%22%3ETablet%20(e.g.%20Apple%20iPad%202-3rd,%20Mini)%3C/a%3E%3Ca%20data-viewport=%221280x800%22%20data-icon=%22notebook%22%3EWidescreen%3C/a%3E%3Cscript%20src=%22http://lab.maltewassermann.com/viewport-resizer/resizer.min.js%22%3E%3C/script%3E%3C/body%3E%3C/html%3E')%7D)(document))%3B
② HTMLタグチェッカー
名前の通りそのまんまですね。HTMLのタグ閉じ忘れ等をチェックすることが出来る機能が利用できます。チェックしたいページで実行するとチェック画面が表示され、タグ閉じ忘れのポイントを教えてくれます。グラフィカルに表示してくれるのでHTML初心者の方も使えます。あれっサイト崩れてるわという時に取り敢えずポチッと実行してみると良いですよ。
javascript:var%20w=window.open('','_blank','width=800,height=500,scrollbars=yes')%3Bvar%20s=document.createElement('script')%3Bs.charset='Shift_JIS'%3Bs.id='tagcheck-script'%3Bs.src='http://tkr-net.tk/tagcheck/tagcheck2.js%3F'%2BMath.random()%3Bdocument.body.appendChild(s)%3Bvoid(0)%3B
③ WhatFont
色んなWEBサイトを見ていると素敵なフォントだーと思う時があります。そんな時に使えるのがこちらのブックマークレットです。実行するとマウスで選択した部分のフォント名をチェックすることが出来ます。いちいちデベロッパツールを起動しなくて済むのもポイントですね。
javascript:(function()%7Bvar%20d=document,s=d.createElement('scr'%2B'ipt'),b=d.body,l=d.location%3Bs.setAttribute('src','http://chengyinliu.com/wf.js%3Fo='%2BencodeURIComponent(l.href)%2B'&t='%2B(new%20Date().getTime()))%3Bb.appendChild(s)%7D)()%3B
④ ページ表示のどこに時間がかかったかチェック
ブログを運営していると欲にかられて様々なカスタマイズを行います。初めからプロ並みのカスタマイズが出来るわけではないので、カスタマイズの結果ページパフォーマンスが落ちることもよくあることです。ページの表示速度が下がってしまうとユーザーエクスペリエンスも下がってしまうので、色んな手段を使って高速化を行いますが、そこで使えるのがこちらのブックマークレットです。実行するとページ表示に掛かった時間等を教えてくれます。しかもグラフィカルな画面で何処に問題があるのか簡単にチェックできます。
javascript:(function()%7B%20var%20d=document%3B%20var%20s=d.createElement('scr'%2B'ipt')%3B%20s.charset='UTF-8'%3B%20s.language='javascr'%2B'ipt'%3B%20s.type='text/javascr'%2B'ipt'%3B%20s.src='//web-tan.forum.impressrd.jp/tools/pagespeedtiming/pagesppedtiming.js%3Ft='%2B(new%20Date()).getTime()%3B%20d.getElementsByTagName('head')%5B0%5D.appendChild(s)%3B%20%7D)()%3B
⑤ SubtlePatterns Bookmarklet
サイトやブログの背景を変えたいなーと思う時に使えるのがこちらのブックマークレット。実行するとSubtlePatternsという背景画像を提供するサイトに登録されている画像を背景画像にセットしてくれます。300超えの背景画像から自由に選ぶことが出来るので意外と便利です。
javascript:(function()%7Bvar%20newscript=document.createElement('script')%3Bnewscript.type='text/javascript'%3Bnewscript.async=true%3Bnewscript.src='https://d2ueh8f0j2xol3.cloudfront.net/subtle-patterns-bookmarklet/static/js/all.js%3Fcb='%20%2B%20Math.random()%3B(document.getElementsByTagName('head')%5B0%5D%7C%7Cdocument.getElementsByTagName('body')%5B0%5D).appendChild(newscript)%3B%7D)()%3B
⑥ スクロールチェッカー
これは私が作ったブックマークレットですね。スクロールした量を測ることしか出来ませんが、スクロールで要素を固定するサイトを作る時には意外と使えます。
javascript:(function(){var dElm=document.documentElement,dBody=document.body;var scY=dElm.scrollTop||dBody.scrollTop;alert("%E7%B8%A6%E3%82%B9%E3%82%AF%E3%83%AD%E3%83%BC%E3%83%AB%E9%87%8F:"+scY);})()
§3 iTunes Store系
記事作成する時に使えるブックマークレットも沢山ありますが、中でもiPhoneアプリ等を紹介する時に使えるブックマークレットは持っている重宝します。iPhoneアプリの紹介とiTunes Musicの紹介で使っている2つの種類をご紹介。
① AppHtml
iPhoneアプリを紹介したいときはコチラのブックマークレットを使えば簡単にコードを取得することが出来ます。色々とカスタマイズをすることが出来るため、自由にカスタマイズすることが可能です。とりあえず持っていて損はありません。PHGアフェリエイトコードも追加出来ます。カスタマイズして使いたい方は公式サイトからどうぞ：AppHtml
javascript:(function()%7Bvar%20d=document,e=d.createElement('script'),url='http://connect1ngdots.github.io/AppHtml/apphtml.js'%3Bif(%21url.match(/%5C%3F/))url%2B='%3Ft='%2B(new%20Date()).getTime()%3Be.out='popup'%3Be.cnt='10'%3Be.knd='software'%3Be.phg='1l3v558'%3Be.scs='288'%3Be.ipd='1.5'%3Be.fmt='%3Cdiv%20class=%22iosapp%22%3E%3Cspan%20class=%22appIcon%22%3E%3Cimg%20class=%22appIconImg%22%20height=%22100%22%20src=%22$%7Bicon100url%7D%22%20style=%22float:left%3Bmargin:%200px%2015px%2015px%205px%3B%22%3E%3C/span%3E%3Cspan%20class=%22appName%22%3E%3Cstrong%3E%3Ca%20href=%22$%7Burl%7D%22%20target=%22itunes_store%22%3E$%7Bname%7D%3C/a%3E%3C/strong%3E%3C/span%3E%3Cbr%3E%3Cspan%20class=%22appCategory%22%3E%E3%82%AB%E3%83%86%E3%82%B4%E3%83%AA:%20$%7Bcategory%7D%3C/span%3E%3Cbr%3E%3Ca%20href=%22$%7Burl%7D%22%20target=%22itunes_store%22%3E%3Cdiv%20class=%22dlbtn%22%3EAppStore%E3%81%A7%E3%83%80%E3%82%A6%E3%83%B3%E3%83%AD%E3%83%BC%E3%83%89%3C/div%3E%3Cbr%20style=%22clear:both%3B%22%3E%3C/div%3E%3C/a%3E'%3Be.charset='utf-8'%3Be.src=url%3Be.id='bmlt'%3Bd.body.appendChild(e)%3B%7D)()%3B
② MusicHtml
iTunes Storeにある音楽を紹介したい時に使えるのがコチラのブックマークレット。単純に音楽を紹介したい時にも使えますし、コントローラーも提供されるためサンプル曲を再生することも出来ます。PHGアフィリエイトコードも追加可能です。カスタマイズして使いたい方は公式サイトからどうぞ：AppHtml
javascript:(function()%7Bvar d%3Ddocument,e%3Dd.createElement(%27script%27),url%3D%27http://connect1ngdots.github.io/AppHtml/apphtml.js%27%3Bif(!url.match(/0C%3F/))url%2B%3D%27%3Ft%3D%27%2B(new Date()).getTime()%3Be.out%3D%27popup%27%3Be.cnt%3D%2730%27%3Be.knd%3D%27song%27%3Be.phg%3D%271l3v30308%27%3Be.scs%3D%270%27%3Be.ipd%3D%270%27%3Be.fmt%3D%27<div class%3D"itunes-music"><span class%3D"appIcon"><img class%3D"appIconImg" height%3D"100" src%3D"%24%7Bicon100url%7D" style%3D"float:left%3Bmargin: 0px 15px 15px 5px%3B"></span><span class%3D"appName"><strong><a href%3D"%24%7Burl%7D" target%3D"itunes_store">%24%7Bname%7D</a></strong></span><span class%3D"badgeS" style%3D"display:inline-block%3B margin:0px 5px">%24%7BbadgeS%7D</span><br><span class%3D"artistName">%24%7Bartist%7D</span><br><span class%3D"appCategory"> %24%7Bcategory%7D</span><br><span class%3D"appPrice">%24%7Bprice%7D</span><br style%3D"clear:both%3B"><span class%3D"appPreview"><audio src%3D"%24%7Bpreview%7D" controls></span></div>%27%3Be.charset%3D%27utf-8%27%3Be.src%3Durl%3Be.id%3D%27bmlt%27%3Bd.body.appendChild(e)%3B%7D)()%3B
＊手動で追加して下さい。
§4 その他系
特別必要じゃないけれどあると使えるブックマークレットの紹介です。まさにブックマークレットというプチプログラムの醍醐味を味わうことが出来るものばかりです。
① amazon-calc.min.js
これはちょっと恐ろしいブックマークレットです。なんとAmazonでこれまで購入してきた合計金額が分かるというものです。中には数百万円使用していてショック死しそうという人もいたとか…使い方はAmazonの注文履歴ページで実行するだけです。年別で集計したり、また全ての年で集計したり可能です。ちなみに私は20万使っているようです（結構使っているのね）。
javascript:(function()%7Bfunction%20t(t)%7Bconsole.log(t);t.date.match(e);var%20n=RegExp.$1;var%20r=RegExp.$2;if(r.length%3C=1)r=%220%22+r;var%20i=RegExp.$3;if(i.length%3C=1)i=%220%22+i;var%20s=%22%22+n+%22/%22+r+%22/%22+i;var%20o=%5Bs,t.name,t.author,t.url%5D;return%20o.join(%22%5Ct%22)+%22%5Cn%22%7Dfunction%20n(e)%7Bvar%20t=window.open(%22%22,%22name%22,%22height=250,width=700%22);t.document.write(%22%3Chtml%3E%3Chead%3E%3Ctitle%3EAmazon%20to%20TSV%3C/title%3E%22);t.document.write(%22%3C/head%3E%3Cbody%3E%22);t.document.write(%22%3Cpre%3E%22);t.document.write(e);t.document.write(%22%3C/pre%3E%22);t.document.write(%22%3C/body%3E%3C/html%3E%22);t.document.close();return%20t%7Dfunction%20u(e)%7Bif(typeof%20e!==%22number%22)%7Bvar%20e=0;$(%22%3Cdiv/%3E%22).css(%7Bposition:%22fixed%22,left:0,top:0,width:%22100%25%22,height:%22100%25%22,zIndex:1e3,backgroundColor:%22rgba(0,0,0,.7)%22,color:%22%23fff%22,fontSize:30,textAlign:%22center%22,paddingTop:%2215em%22%7D).attr(%22id%22,%22___overlay%22).text(%22Amazon%E3%81%84%E3%81%8F%E3%82%89%E4%BD%BF%E3%81%A3%E3%81%9F%EF%BC%9F%22).appendTo(%22body%22);s=window.prompt(%22%E4%BD%95%E5%B9%B4%E5%88%86%E3%81%AE%E6%B3%A8%E6%96%87%E3%82%92%E9%9B%86%E8%A8%88%E3%81%97%E3%81%BE%E3%81%99%E3%81%8B%EF%BC%9F%5Cn%20-%20%E5%8D%8A%E8%A7%92%E6%95%B0%E5%AD%974%E6%A1%81%E3%81%A7%E5%85%A5%E5%8A%9B%E3%81%97%E3%81%A6%E3%81%8F%E3%81%A0%E3%81%95%E3%81%84%5Cn%20-%20%E5%85%A8%E6%9C%9F%E9%96%93%E3%82%92%E9%9B%86%E8%A8%88%E3%81%99%E3%82%8B%E5%A0%B4%E5%90%88%E3%81%AF%E3%80%8Call%E3%80%8D%E3%81%A8%E5%85%A5%E5%8A%9B%E3%81%97%E3%81%BE%E3%81%99%22,s);if(s===%22all%22)%7Bo=true;s=jQuery(%22div.top-controls%20select%20option:last%22).val().match(/%5B0-9%5D/g).join(%22%22)%7Delse%20if(!/%5E%5B0-9%5D%7B4%7D$/.test(s))%7Balert(%22%E6%AD%A3%E3%81%97%E3%81%84%E6%95%B0%E5%80%A4%E3%82%92%E5%85%A5%E5%8A%9B%E3%81%97%E3%81%A6%E3%81%8F%E3%81%A0%E3%81%95%E3%81%84%22);$(%22%23___overlay%22).remove();return%20false%7Ds=Number(s)%7Dvar%20r=a(e,false);$(%22%23___overlay%22).text(s+%22%E5%B9%B4%E3%81%AE%E9%9B%86%E8%A8%88%E4%B8%AD%E2%80%A6%20%20/%20%22+(e+1)+%22%E3%83%9A%E3%83%BC%E3%82%B8%E7%9B%AE%22);r.done(function(t)%7Bif(typeof%20i%5Bs%5D===%22undefined%22)%7Bi%5Bs%5D=t%7Delse%7Bi%5Bs%5D=i%5Bs%5D.concat(t)%7Du(e+1)%7D).fail(function()%7Bif(o&&(new%20Date).getFullYear()%3Es)%7Bs++;u(0)%7Delse%7Bvar%20e=0;var%20r=%22%22;jQuery.each(i,function(n,i)%7Bvar%20s=0;jQuery.each(i,function()%7Bs+=this.price;$.each(this.items,function(e,n)%7Br+=t(n)%7D)%7D);e+=s%7D);$(%22%23___overlay%22).remove();alert(%22%E5%90%88%E8%A8%88%20%22+e+%22%20%E5%86%86%22);n(r);console.log(%22%E5%90%88%E8%A8%88%20%22+e+%22%20%E5%86%86%22)%7D%7D)%7Dfunction%20a(e,t)%7Bvar%20n=jQuery.Deferred();var%20r=f(e,t);r.done(function(e)%7Bvar%20r=jQuery.parseHTML(e);var%20i=%5B%5D;jQuery(r).find(%22div.order%22).each(function()%7Bvar%20e=jQuery(this);var%20n=jQuery(e.find(%22div.order-info%20span.value%22)%5B0%5D).text().trim();var%20r=%5B%5D;var%20s=e.find(%22div.a-row%20%3E%20span.a-size-small%22);e.find(%22div.a-row%20%3E%20a.a-link-normal%22).each(function(e)%7Bvar%20t=%7B%7D;t.name=$(this).text().trim();t.path=$(this).attr(%22href%22).trim();t.url=%22https://www.amazon.co.jp%22+t.path;t.date=n;t.author=$(s%5Be*2%5D).text().trim().replace(/(%5Cn)/g,%22%22);r.push(t)%7D);var%20o=jQuery(e.find(%22div.order-info%20span.value%22)%5B1%5D).text();var%20u=Number(o.match(/%5B0-9%5D/g).join(%22%22));if(t)console.log(item,u);i.push(%7Bdate:n,items:r,price:u%7D)%7D);if(i.length%3C=0)n.reject();else%20n.resolve(i)%7D);return%20n.promise()%7Dfunction%20f(e)%7Bvar%20t=jQuery.Deferred();jQuery.ajax(%7Burl:%22https://www.amazon.co.jp/gp/css/order-history?digitalOrders=1&unifiedOrders=1&orderFilter=year-%22+s+%22&startIndex=%22+e*10,beforeSend:function(e)%7Be.setRequestHeader(%22X-Requested-With%22,%7BtoString:function()%7Breturn%22%22%7D%7D)%7D%7D).success(function(e)%7Bt.resolve(e)%7D).fail(function(e,t)%7Bif(verbose)console.log(%22fail%22,t)%7D);return%20t.promise()%7Dvar%20e=new%20RegExp(%22(%5C%5Cd%7B4%7D)%E5%B9%B4(%5C%5Cd%7B1,2%7D)%E6%9C%88(%5C%5Cd%7B1,2%7D)%E6%97%A5%22);var%20r=%22%20/%20%22;var%20i=%7B%7D;var%20s=%222014%22;var%20o=false;if(typeof%20jQuery!==%22function%22)%7Bvar%20l=document;var%20c=l.createElement(%22script%22);c.src=%22//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js%22;c.onload=u;l.body.appendChild(c)%7Delse%7Bu()%7D%7D)()
＊手動で追加して下さい。
② Amazonほしい物リスト合計金額チェッカー
こちらもAmazonに関係するブックマークレットです。名前の通りほしい物リストに登録している商品の合計金額を知ることが出来ます。ただ複数ページある場合はページごとで実行する必要があるようです。
javascript:total=0;r=document.getElementsByClassName("a-fixed-left-grid a-spacing-large");for(var i=0;i<r.length;i++){total+=parseInt(r[0].getElementsByClassName("a-size-base a-color-price a-text-bold")[0].innerText.match(/\d{1,3}(,\d{3})*/)[0].split(",").join(""));}alert("合計"+total+"円");
＊手動で追加して下さい。
③ OGPチェックブックマークレット
SNSでシェアを行う時に適切なメタ情報を提供する概念にOGPがありますが、OGPのチェックを行うことが出来るのがこちらのブックマークレット。通常WEBサービス等を用いてチェックを行いますが、こちらのブックマークレットを持っていればページで実行するだけで分かります。
javascript:(function()%7Bvar%20b%20%3D%20document.getElementsByTagName(%27body%27)%3Bvar%20metas%20%3D%20document.getElementsByTagName%20(%27meta%27)%3Bfor%20(var%20i%20%3D%200,%20I%20%3D%20metas.length%3B%20i%20%3C%20I%3B%20i%2B%2B)%20%7Bif(%20metas%5Bi%5D.getAttribute(%22property%22)%20!%3D%20null)%7Bswitch(metas%5Bi%5D.getAttribute(%22property%22))%7Bcase%20%27og:type%27:var%20og_type%20%3D%20metas%5Bi%5D.content%3Bbreak%3Bcase%20%27og:title%27:var%20og_title%20%3D%20metas%5Bi%5D.content%3Bbreak%3Bcase%20%27og:site_name%27:var%20og_sitename%20%3D%20metas%5Bi%5D.content%3Bbreak%3Bcase%20%27fb:admins%27:var%20og_admin%20%3D%20metas%5Bi%5D.content%3Bbreak%3Bcase%20%27og:locale%27:var%20og_locale%20%3D%20metas%5Bi%5D.content%3Bbreak%3Bcase%20%27og:image%27:var%20og_image%20%3D%20metas%5Bi%5D.content%3Bbreak%3Bcase%20%27og:url%27:var%20og_url%20%3D%20metas%5Bi%5D.content%3Bbreak%3Bcase%20%27og:description%27:var%20og_description%20%3D%20metas%5Bi%5D.content%3Bbreak%3B%7D%7Delse%20if(metas%5Bi%5D.name%20%3D%3D%20%22description%22)%7Bvar%20h_description%20%3D%20metas%5Bi%5D.content%3B%7D%7Dvar%20h_title%20%3D%20document.getElementsByTagName(%27title%27)%5B0%5D.innerHTML%3Bvar%20h_description%3Bvar%20h_url%20%3D%20document.URL%3Bvar%20addtext%20%3D%20%27%3Cdiv%20onClick%3D%22close()%3B%22%20class%3D%22ogp-check%22%20id%3D%22ogp-wrapper%22%3E%27%2B%27%3Cstyle%3E%27%2B%27div.sinap_ogp_chk_wrapper%7B%27%2B%27width:100%25%3B%27%2B%27height:2000px%3B%27%2B%27position:absolute%3B%27%2B%27background-color:rgba(0,%200,%200,%200.5)%3B%27%2B%27z-index:2000%3B%27%2B%27font-size:12px%3B%27%2B%27color:%23000%3B%27%2B%27text-align:left%3B%27%2B%27top:0%3B%27%2B%27left:0%3B%27%2B%27%7D%27%2B%27%27%2B%27div.sinap_ogp_chk_wrapper%20div.check-content%7B%27%2B%27width:%20600px%3B%27%2B%27height:%20auto%3B%27%2B%27background-color:%20rgba(255,%20255,%20255,%20.9)%3B%27%2B%27margin:%2050px%20auto%3B%27%2B%27padding:%2020px%3B%27%2B%27%7D%27%2B%27%27%2B%27div.sinap_ogp_chk_wrapper%20div.check-content%20h2%7B%27%2B%27font-size:1em%3B%27%2B%27margin-bottom:15px%3B%27%2B%27width:100%25%3B%27%2B%27background-color:%23666666%3B%27%2B%27color:%23fff%3B%27%2B%27padding:3px%3B%27%2B%27text-align:left%3B%27%2B%27%7D%27%2B%27%27%2B%27div.sinap_ogp_chk_wrapper%20p.value-content%7B%27%2B%27margin-left:20px%3B%27%2B%27overflow:hidden%3B%27%2B%27border-bottom:%201px%20solid%20%23cccccc%3B%27%2B%27padding-bottom:2px%3B%27%2B%27margin-bottom:5px%3B%27%2B%27text-align:left%3B%27%2B%27%7D%27%2B%27%27%2B%27div.sinap_ogp_chk_wrapper%20p.value-content%20span%7B%27%2B%27float:left%3B%27%2B%27font-size:0.8em%3B%27%2B%27display:block%3B%27%2B%27padding:2px%3B%27%2B%27text-align:left%3B%27%2B%27%27%2B%27%7D%27%2B%27%27%2B%27div.sinap_ogp_chk_wrapper%20span.label%7B%27%2B%27width:200px%3B%27%2B%27font-weight:bold%3B%27%2B%27text-align:left%3B%27%2B%27%7D%27%2B%27%27%2B%27div.sinap_ogp_chk_wrapper%20p.note%7B%27%2B%27margin-top:10px%3B%27%2B%27margin-bottom:20px%3B%27%2B%27font-weight:%20bold%3B%27%2B%27color:blue%3B%27%2B%27text-align:left%3B%27%2B%27%7D%27%2B%27%27%2B%27div.sinap_ogp_chk_wrapper%20p.note.error%7B%27%2B%27color:red%3B%27%2B%27font-size:%201em%3B%27%2B%27text-align:left%3B%27%2B%27%7D%27%2B%27%27%2B%27%27%2B%27%27%2B%27%27%2B%27%3C/style%3E%27%2B%27%3Cdiv%20class%3D%22check-content%22%3E%27%2B%27%3Cdiv%20class%3D%22value-list%22%20id%3D%22image%22%3E%27%2B%27%3Ch2%3E%E3%82%A4%E3%83%A1%E3%83%BC%E3%82%B8%E3%82%BF%E3%82%B0%3C/h2%3E%27%2B%27%3Cp%20class%3D%22value-content%22%3E%3Cspan%20class%3D%22label%22%3E%E3%82%A4%E3%83%A1%E3%83%BC%E3%82%B8%E3%82%BF%E3%82%B0%3C/span%3E%3Cspan%20class%3D%22value%22%3E%3Cimg%20src%3D%22%27%2B%20og_image%20%2B%27%22%3E%3C/span%3E%3C/p%3E%27%3Bif(og_image%20%3D%3D%20undefined)%7Baddtext%20%2B%3D%27%3Cp%20class%3D%22note%20error%22%3E%C3%97%20og:image%E3%81%8C%E8%A8%AD%E5%AE%9A%E3%81%95%E3%82%8C%E3%81%A6%E3%81%84%E3%81%BE%E3%81%9B%E3%82%93%E3%80%82%3C/p%3E%27%7Delse%7Baddtext%20%2B%3D%27%3Cp%20class%3D%22value-content%22%3E%3Cspan%20class%3D%22label%22%3Eurl%3C/span%3E%3Cspan%20class%3D%22value%22%3E%3Cspan%20class%3D%22value%22%3E%27%2B%20og_image%20%2B%27%3C/span%3E%3C/p%3E%27%3Bif(og_image.match(/http:%5C/%5C/%5B%5E%5C/%5D*/)%20!%3D%20null)%7Bvar%20og_image_domain%20%3D%20og_image.match(/http:%5C/%5C/%5B%5E%5C/%5D*/)%5B0%5D.replace(%22http://%22,%22%22)%3B%7Dif(h_url.match(/http:%5C/%5C/%5B%5E%5C/%5D*/)%20!%3D%20null)%7Bvar%20site_domain%20%3D%20h_url.match(/http:%5C/%5C/%5B%5E%5C/%5D*/)%5B0%5D.replace(%22http://%22,%22%22)%3B%7Delse%7Bvar%20site_domain%20%3D%20h_url.match(/https:%5C/%5C/%5B%5E%5C/%5D*/)%5B0%5D.replace(%22https://%22,%22%22)%3B%7Dif(og_image_domain%20!%3D%20undefined%20%26%26%20og_image_domain%20!%3D%20site_domain)addtext%20%2B%3D%27%3Cp%20class%3D%22note%20error%22%3E%C3%97%20og:image%E3%82%92%E5%88%A5%E3%81%AE%E3%83%89%E3%83%A1%E3%82%A4%E3%83%B3%E3%81%8B%E3%82%89%E8%AA%AD%E3%81%BF%E8%BE%BC%E3%82%93%E3%81%A7%E3%81%84%E3%81%BE%E3%81%99%E3%80%82%3C/p%3E%27%3Belse%20addtext%20%2B%3D%27%3Cp%20class%3D%22note%22%3E%E2%97%8E%20og:image%E3%81%8C%E8%A8%AD%E5%AE%9A%E3%81%95%E3%82%8C%E3%81%A6%E3%81%84%E3%81%BE%E3%81%99%E3%80%82%3C/p%3E%27%3B%7Daddtext%20%2B%3D%27%3C/div%3E%27%2B%27%3Cdiv%20class%3D%22value-list%22%20id%3D%22url%22%3E%27%2B%27%3Ch2%3EURL%E5%80%A4%3C/h2%3E%27%2B%27%3Cp%20class%3D%22value-content%22%3E%3Cspan%20class%3D%22label%22%3Eog:url%3C/span%3E%3Cspan%20class%3D%22value%22%3E%27%2B%20og_url%20%2B%27%3C/span%3E%3C/p%3E%27%2B%27%3Cp%20class%3D%22value-content%22%3E%3Cspan%20class%3D%22label%22%3E%E3%82%A2%E3%83%89%E3%83%AC%E3%82%B9%E3%83%90%E3%83%BC%3C/span%3E%3Cspan%20class%3D%22value%22%3E%27%2B%20h_url%20%2B%27%3C/span%3E%3C/p%3E%27%3Bif(og_url%20%3D%3D%20undefined)%7Baddtext%20%2B%3D%27%3Cp%20class%3D%22note%20error%22%3E%C3%97%20og:url%E3%81%8C%E8%A8%AD%E5%AE%9A%E3%81%95%E3%82%8C%E3%81%A6%E3%81%84%E3%81%BE%E3%81%9B%E3%82%93%E3%80%82%3C/p%3E%27%7Delse%20if(og_url%20!%3D%20h_url)%20addtext%20%2B%3D%27%3Cp%20class%3D%22note%20error%22%3Ex%20og:url%E3%81%A8%E3%82%A2%E3%83%89%E3%83%AC%E3%82%B9%E3%83%90%E3%83%BC%E3%81%AE%E5%80%A4%E3%81%8C%E3%81%A1%E3%81%8C%E3%81%84%E3%81%BE%E3%81%99%E3%80%82%3C/p%3E%27%3Belse%20addtext%20%2B%3D%27%3Cp%20class%3D%22note%22%3E%E2%97%8E%20og:url%E3%81%A8%E3%82%A2%E3%83%89%E3%83%AC%E3%82%B9%E3%83%90%E3%83%BC%E3%81%AE%E5%80%A4%E3%81%AF%E5%90%8C%E4%B8%80%E3%81%AE%E3%82%82%E3%81%AE%E3%81%A7%E3%81%99%E3%80%82%3C/p%3E%27%3Baddtext%20%2B%3D%27%3C/div%3E%27%2B%27%3Cdiv%20class%3D%22value-list%22%20id%3D%22title%22%3E%27%2B%27%3Ch2%3E%E3%82%BF%E3%82%A4%E3%83%88%E3%83%AB%E5%80%A4%3C/h2%3E%27%2B%27%3Cp%20class%3D%22value-content%22%3E%3Cspan%20class%3D%22label%22%3Eog:title%3C/span%3E%3Cspan%20class%3D%22value%22%3E%27%2B%20og_title%20%2B%27%3C/span%3E%3C/p%3E%27%2B%27%3Cp%20class%3D%22value-content%22%3E%3Cspan%20class%3D%22label%22%3Etitle%E3%82%BF%E3%82%B0%3C/span%3E%3Cspan%20class%3D%22value%22%3E%27%2B%20h_title%20%2B%27%3C/span%3E%3C/p%3E%27%3Bif(og_title%20%3D%3D%20undefined)%7Baddtext%20%2B%3D%27%3Cp%20class%3D%22note%20error%22%3E%C3%97%20og:title%E3%81%8C%E8%A8%AD%E5%AE%9A%E3%81%95%E3%82%8C%E3%81%A6%E3%81%84%E3%81%BE%E3%81%9B%E3%82%93%E3%80%82%3C/p%3E%27%7Delse%20if(og_title%20!%3D%20h_title)%20addtext%20%2B%3D%27%3Cp%20class%3D%22note%20error%22%3Ex%20og:title%E3%81%A8%E3%82%BF%E3%82%A4%E3%83%88%E3%83%AB%E3%82%BF%E3%82%B0%E3%81%AE%E5%80%A4%E3%81%8C%E3%81%A1%E3%81%8C%E3%81%84%E3%81%BE%E3%81%99%E3%80%82%3C/p%3E%27%3Belse%20addtext%20%2B%3D%27%3Cp%20class%3D%22note%22%3E%E2%97%8Eog:title%E3%81%A8%E3%82%BF%E3%82%A4%E3%83%88%E3%83%AB%E3%82%BF%E3%82%B0%E3%81%AE%E5%80%A4%E3%81%AF%E5%90%8C%E4%B8%80%E3%81%AE%E3%82%82%E3%81%AE%E3%81%A7%E3%81%99%E3%80%82%3C/p%3E%27%3Baddtext%20%2B%3D%27%3C/div%3E%27%2B%27%3Cdiv%20class%3D%22value-list%22%20id%3D%22description%22%3E%27%2B%27%3Ch2%3E%E3%83%87%E3%82%B9%E3%82%AF%E3%83%AA%E3%83%97%E3%82%B7%E3%83%A7%E3%83%B3%E5%80%A4%3C/h2%3E%27%2B%27%3Cp%20class%3D%22value-content%22%3E%3Cspan%20class%3D%22label%22%3Eog:description%3C/span%3E%3Cspan%20class%3D%22value%22%3E%27%2B%20og_description%20%2B%27%3C/span%3E%3C/p%3E%27%2B%27%3Cp%20class%3D%22value-content%22%3E%3Cspan%20class%3D%22label%22%3Edescription%E3%82%BF%E3%82%B0%3C/span%3E%3Cspan%20class%3D%22value%22%3E%27%2B%20h_description%20%2B%27%3C/span%3E%3C/p%3E%27%3Bif(og_description%20%3D%3D%20undefined)%7Baddtext%20%2B%3D%27%3Cp%20class%3D%22note%20error%22%3E%C3%97%20og:description%E3%81%8C%E8%A8%AD%E5%AE%9A%E3%81%95%E3%82%8C%E3%81%A6%E3%81%84%E3%81%BE%E3%81%9B%E3%82%93%E3%80%82%3C/p%3E%27%7Delse%20if(og_description%20!%3D%20h_description)%20addtext%20%2B%3D%27%3Cp%20class%3D%22note%20error%22%3Ex%20og:description%E3%81%A8mata:description%E3%81%AE%E5%80%A4%E3%81%8C%E3%81%A1%E3%81%8C%E3%81%84%E3%81%BE%E3%81%99%E3%80%82%3C/p%3E%27%3Belse%20addtext%20%2B%3D%27%3Cp%20class%3D%22note%22%3E%E2%97%8E%20og:description%E3%81%A8mata:description%E3%81%AE%E5%80%A4%E3%81%AF%E5%90%8C%E4%B8%80%E3%81%AE%E3%82%82%E3%81%AE%E3%81%A7%E3%81%99%E3%80%82%3C/p%3E%27%3Baddtext%20%2B%3D%27%3C/div%3E%27%2B%27%3Cdiv%20class%3D%22value-list%22%20id%3D%22%22%3E%27%2B%27%3Ch2%3E%E3%81%9D%E3%81%AE%E4%BB%96%E5%9B%BA%E5%AE%9A%E5%80%A4%3C/h2%3E%27%2B%27%3Cp%20class%3D%22value-content%22%3E%3Cspan%20class%3D%22label%22%3Eog:site_name%3C/span%3E%3Cspan%20class%3D%22value%22%3E%27%2Bog_sitename%2B%27%3C/span%3E%3C/p%3E%27%2B%27%3Cp%20class%3D%22value-content%22%3E%3Cspan%20class%3D%22label%22%3Eog:type%3C/span%3E%3Cspan%20class%3D%22value%22%3E%27%2Bog_type%2B%27%3C/span%3E%3C/p%3E%27%2B%27%3Cp%20class%3D%22value-content%22%3E%3Cspan%20class%3D%22label%22%3Eog:locale%3C/span%3E%3Cspan%20class%3D%22value%22%3E%27%2Bog_locale%2B%27%3C/span%3E%3C/p%3E%27%2B%27%3Cp%20class%3D%22value-content%22%3E%3Cspan%20class%3D%22label%22%3Efb:admins%3C/span%3E%3Cspan%20class%3D%22value%22%3E%27%2Bog_admin%2B%27%3C/span%3E%3C/p%3E%27%3Bif(og_sitename%20!%3D%20undefined%20%26%26%20og_type%20!%3D%20undefined%20%26%26%20og_locale%20!%3D%20undefined%20%26%26%20og_admin%20!%3D%20undefined)%20addtext%20%2B%3D%27%3Cp%20class%3D%22note%22%3E%E2%97%8E%20%E3%81%9D%E3%81%AE%E4%BB%96%E3%81%AE%E9%A0%85%E7%9B%AE%E3%81%AF%E8%A8%AD%E5%AE%9A%E3%81%95%E3%82%8C%E3%81%A6%E3%81%84%E3%81%BE%E3%81%99%3C/p%3E%27%3Belse%7Bvar%20etext%20%3D%20%22%20%22%3Bif(og_sitename%20%3D%3D%20undefined)%20etext%20%2B%3D%20%27og:sitename,%27%3Bif(og_type%20%3D%3D%20undefined)%20etext%20%2B%3D%20%27og:type,%27%3Bif(og_locale%20%3D%3D%20undefined)%20etext%20%2B%3D%20%27og:locale,%27%3Bif(og_admin%20%3D%3D%20undefined)%20etext%20%2B%3D%20%27fb:admin,%27%3Baddtext%20%2B%3D%27%3Cp%20class%3D%22note%20error%22%3E%C3%97%20%27%2B%20etext%2B%27%20%E3%81%8C%E8%A8%AD%E5%AE%9A%E3%81%95%E3%82%8C%E3%81%A6%E3%81%84%E3%81%BE%E3%81%9B%E3%82%93%3C/p%3E%27%3B%7Daddtext%20%2B%3D%27%3C/div%3E%27%2B%27%3C/div%3E%27%3Bvar%20div_bef%20%3D%20document.getElementById(%27sinap_ogp_chk_div%27)%3Bif(div_bef%20!%3D%20undefined)%20b%5B0%5D.removeChild(div_bef)%3Bvar%20div_elem%20%3D%20document.createElement(%27div%27)%3Bdiv_elem.className%3D%22sinap_ogp_chk_wrapper%22%3Bdiv_elem.id%20%3D%20%22sinap_ogp_chk_div%22%3Bdiv_elem.innerHTML%20%3D%20addtext%3Bwindow.scroll(0,0)%3Bb%5B0%5D.appendChild(div_elem)%3Bdiv_elem.onclick%20%3D%20function()%7Bb%5B0%5D.removeChild(div_elem)%3B%7D%7D)()%3B
④ ソーシャルてんこ盛り
11月になるとTwitterのカウント機能が廃止され、おそらくですが色んなサイトがカウント無しのSNSボタンを使うようになるはずです。ちなみに私もカウント無しSNSボタンを作りましたが、こちらのブックマークレットを使えば色んなSNSのカウントを表示できます。（ただTwitterは廃止されると表示できなくなります。）
javascript:(function(d)%7Bvar%20s%3Dd.createElement(%27script%27)%3Bs.id%3D%27social-tenkomori%27%3Bs.charset%3D%27UTF-8%27%3Bs.src%3D%27http://actyway.com/bookmarklet/tenkomori.min.js%3Fcolor%3D00cfff%26%27%2B(new%20Date()).getTime()%3Bd.body.appendChild(s)%7D)(document)%3B
2015年10月17日（約9年経過）
