Markdownで記事執筆する人は活用すべき便利なbookmarklet

Markdown でのリンク作成には独特なフォーマットを利用します。慣れれば大したことはないですが、正確に情報を組み込もうと思うと地味に面倒くさいので、無駄な時間を削減するためには必須な小技だと思っています。

(1) インライン型:

これは[サンプル](http://example.jp/ "Title")リンクです。

(2) リファレンス(参照)型:

これは[サンプル][reference-id]リンクです。

    [reference-id]: http://example.jp/ "Title"

*1) reference-id の部分は任意の文字列でOK
*2) リンクの一覧はどこに書いてもよいが本文末尾に固めておくと綺麗

いずれも「example」という文字に対してリンクを張りたい場合の記述であり、結果的には同じ挙動をします。好みの問題ですが、個人的な使い分けとして以下のケースに該当する場合はリファレンス型を、それ以外の場合はインライン型を利用しています。

  • 本文で同じ宛先のリンクを何度も使う場合
  • URLが長すぎてMarkdown本文中に含めると可読性が落ちる場合(気持ち悪い・汚い場合)

Markdown形式のリンクを作成するBookmarklet

  1. インライン型 (Md-link)
  2. 参照型 (Md-Reflink)

それぞれ括弧()内のリンク部分をブラウザのURLバー等へドラッグして保存してください。

[参考]参照型のコード:

javascript:(function() {
  prompt('Copy to clipboard - Reference style',
    '[' +location.hostname.split(".")[0]+ ']: ' + location.href + ' "'+document.title.replace(/([\[\]])/g,'\\$1')+'"');
})();

[実行例]本ページでの実行結果:

[exlair]: https://exlair.net/2014/markdown-link-bookmarklet.html "Markdown用リンクを作る2種類のbookmarklet"

Bookmarkletのベースには下記URLを参考にしています。インライン型はそのまま使わせて頂いております。

JavaScript – Markdown用のリンクを作るブックマークレット – Qiita

参照型は、reference-id部分にホスト名を初期値として入力するようしました。重複の対処はしていませんので、同じドメインのサイトから何度もリンクを作成する場合はご注意ください。

動作確認端末

  • Safari
  • Chrome