スポンサーリンク

引用タグ作成Bookmarklet「QuoteLinker」を作ってみた

QuoteLinker

こんにちは、鈴木俊吾です。

ブログで記事を書いている時に、他のブログ記事からコンテンツの一部を引用したい時ってありますよね?
その場合、引用を表すblockquoteタグで記述する必要があります。
ただ、実際やったことがある方は分かると思いますが…。
厳密なルールに沿ってHTMLを書こうとすると少々面倒。

そこで、私は「QuoteLinker」というブックマークレットを作成してみました。
これを使えば、引用タグの作成にかける時間を大幅に短縮することが可能です。

今回の記事では、その「QuoteLinker」の使い方について簡単に解説します。
引用する時に備えて、あらかじめ準備しておくと良いと思いますよ。

スポンサーリンク

QuoteLinkerとは?

「QuoteLinker」というのは、私が自作したブックマークレットとなります。
引用タグblockquoteを含んだHTMLコードをサクッと作成するためのツールです。

通常、引用をする際にはblockquoteタグで引用部分と引用元を明記します。
厳密にやろうとすると、blockquoteタグのcite属性に引用元のURL、pタグの中に引用文、citeタグの中に引用元のリンク、を書く必要があります。

そのため、何度もコピペの作業を繰り返す必要が出てきます。
所要時間としても、それなりにかかってしまうのではないでしょうか?
ただ一部を引用したいだけなのに、時間が取られるというのは非常にもったいないですよね。

今回の「QuoteLinker」を使うと…。
引用タグの取得がなんとたったの2ステップとなります!
必要な時間は数秒程度。
ものすごい時短になりますよ。

このブックマークレットがやっていることは単純ですが…。
その働きっぷりは十分です。
あなたもぜひ試してみて、この「QuoteLinker」の威力に驚いてください。

QuoteLinkerのブックマーク登録

「QuoteLinker」を使うためには、まずブックマークに登録しておく必要があります。
お使いのウェブブラウザのブックマークバー上の任意の場所で、新規ブックマークを作成してください。
そして、そのブックマークのURL欄の中身を以下のようにしてください。

javascript:(function(){var s=window.getSelection().toString();var t=document.title;var u=location.href;var a='<a href="'+u+'" title="'+t+'" target="_blank">'+t+'</a>';var q='<blockquote cite="'+u+'"><p>'+s+'</p><cite>'+a+'</cite></blockquote>';prompt('QuoteLinker',q)})();

QuoteLinkerの使い方

「QuoteLinker」の使い方は非常に簡単。

ブログやホームページで引用したい部分をマウスドラッグして選択状態にしておきます。
そして、さきほど登録した「QuoteLinker」をクリックします。
あとは、プロンプトが表示されますので、その中に表示されているHTMLコードをコピペするだけ。
ねっ、簡単でしょ?

QuoteLinker
QuoteLinker

「深愛」は、私が水樹奈々さんのファンになるきっかけとなった思い出の曲。 YouTubeで何気なく聴いてみた時に一発で気に入りまして…。 それからずっとファンになっていますよ。

思わず感動で涙腺崩壊!水樹奈々のおすすめバラード曲7選 | スズシンラボ

QuoteLinkerのソースコード

「QuoteLinker」のソースコードは以下のようになっています。
ちょっとJavaScriptが分かる方なら、すぐに内容を理解できると思います。

簡単に動作を解説すると…。
まず、変数sに選択文字列、変数tにページタイトル、変数uにページURLを代入します。
それを元にして、変数aにaタグのHTML文字列、変数qにblockquoteタグのHTML文字列を代入します。
あとは変数qの内容をプロンプトに表示するだけです。

javascript:(function(){
var s = window.getSelection().toString();
var t = document.title;
var u = location.href;
var a = '<a href="'+u+'" title="'+t+'" target="_blank">'+t+'</a>';
var q = '<blockquote cite="'+u+'"><p>'+s+'</p><cite>'+a+'</cite></blockquote>';
prompt('QuoteLinker', q);
})();

ひとこと

今回の記事では、引用タグ作成ブックマークレット「QuoteLinker」について紹介と解説をしてみました。
この「QuoteLinker」を使えば、引用タグの取得までがなんとたったの2ステップ!
とても簡単、お手軽になりますね。

引用をする機会というのは、それほど多くは無いかもしれませんが…。
その時のために、このブックマークレットを登録してみてはいかがでしょうか?

スポンサーリンク

鈴木俊吾
鈴木俊吾

『一度きりの人生、楽しむべきだよね絶対!』をモットーに、人生大逆転を目指して活動をしているフリーライター。
自分がやりたいと思ったことは、何でもやってみるスタイル。

ブログでは、ライフログを中心に、仕事・趣味・思ったことなどについてまとめていきます。
いくつか記事を読んでいくうちに、私の人となりが何となくつかめるかと思います。

Twitterをフォローしていただくと、ブログからの更新通知を手軽に受け取ることができます。
読者の皆さんとも積極的に交流をしていきたいと思っていますので…。
あなたからのフォローを楽しみにしています!