はてなブロガー用ブックマークレットを作った

スポンサードリンク

はてなブロガー用に簡単なブックマークレットを作ってみました。
と言っても自分が使うものが中心なんですが、お役に立てば幸いです。

ブックマークレット登録仕方

chromeであればURLバーの☆マークをクリックして「編集」で名前とURLに下記ソースをコピペすれば使えます。
あとは実行したいタイミングで登録したブックマークをクリックすれば実行されます。

詳しいやり方はこちら
www.frontendmemo.xyz

文字数カウンター

javascript:var%20s%20=%20'<div%20id="result"></div>';document.getElementById('promotion').insertAdjacentHTML('afterend',s);var%20result%20=%20document.getElementById('result');var%20n%20=%20document.getElementById('body');var%20text%20=%20n.value;n.addEventListener('keyup',%20function(e){%20text%20=%20document.getElementById('body').value;%20result.textContent%20=%20text.replace(/\s/g,"").length + '\u6587\u5b57';},%20false);

これ作ってから思ったんですけど、デフォルトで文字数カウンターありますね笑
ただデフォルトは改行も含まれていますが、こちらのものは改行含まないのでより文字数を正確に数えられるかなと思います。

html

以下は、コードを表記するためのブックマークレットです。
ソースコードを埋め込む際、
>○|○html○|
この中にhtmlをいれる。使用時は○を消す。
○|○|○<
と入力するとソース表示が可能になりますが、
こちらのブックマークレットでクリックと同時にカーソル位置で表示されるというものです。

javascript:void((function(){var%20s%20=%20">|html|\n||<";var%20t%20=%20document.getElementById('body').value;var%20u%20=%20document.getElementById('body').selectionStart;var%20l%20=%20t.substr(0,%20u);var%20r%20=%20t.substr(u,%20t.length);document.getElementById('body').value%20=%20l%20+%20s%20+%20r;})());

css

javascript:void((function(){var%20s%20=%20">|css|\n||<";var%20t%20=%20document.getElementById('body').value;var%20u%20=%20document.getElementById('body').selectionStart;var%20l%20=%20t.substr(0,%20u);var%20r%20=%20t.substr(u,%20t.length);document.getElementById('body').value%20=%20l%20+%20s%20+%20r;})());

JS

javascript:void((function(){var%20s%20=%20">|javascript|\n||<";var%20t%20=%20document.getElementById('body').value;var%20u%20=%20document.getElementById('body').selectionStart;var%20l%20=%20t.substr(0,%20u);var%20r%20=%20t.substr(u,%20t.length);document.getElementById('body').value%20=%20l%20+%20s%20+%20r;})());

テーブル

javascript:void((function(){var%20s%20=%20"|* ||\n|* ||";var%20t%20=%20document.getElementById('body').value;var%20u%20=%20document.getElementById('body').selectionStart;var%20l%20=%20t.substr(0,%20u);var%20r%20=%20t.substr(u,%20t.length);document.getElementById('body').value%20=%20l%20+%20s%20+%20r;})());

googleadsense広告

記事中に広告を入れる時などいつもgoogleadsenseサイトからソースをもってくるのは面倒という時に。
ここに広告のソースを入れてください というコメントにソースを張り付けて使用ください。

javascript:void((function(){var%20s%20=%20'
<!-- ここに広告のソースを入れてください -->
var%20t%20=%20document.getElementById('body').value;var%20u%20=%20document.getElementById('body').selectionStart;var%20l%20=%20t.substr(0,%20u);var%20r%20=%20t.substr(u,%20t.length);%20document.getElementById('body').value%20=%20l%20+%20s%20+%20r;})());

不必要な空白を消して必要な空白は%20に置換する必要があります。

ちなみに文字数カウンター以外はほぼコードが一緒です。
カーソル位置に指定した文字を呼び出すというものなので他に呼び出したい文字があれば、アレンジ可能です。

ちなみに現状は、管理画面から記事を書くで書いた時のみ使用できます。