プログラマー

今見ているページへのリンクタグを自動生成するBookmarkletを作成してみた

読了時間: 約3
PageLinker

こんにちは、夢実現サポーターの鈴木俊吾(@suzushin7)です。

プログラミングに関心がある私。
今日は、ちょっとした簡単なプログラムでも組んでみようと思いまして…。
JavaScriptで、今見ているページへのリンクタグ自動生成するブックマークレットを作成してみました。
このブックマークレットは『PageLinker』と名付けましたよ。

ブログ記事を書いていて、リンクを張りたい場面というのは結構ありますよね?
そんな時にぜひ『PageLinker』をお使いください。
ブロガーにとって、非常に重宝するブックマークレットになると思います。

この記事では、ブックマークレット『PageLinker』の導入方法と使い方について解説していきます。
誰でも簡単お手軽に使えますので、ぜひ導入をご検討くださいね。

ブックマークレット『PageLinker』とは何?

~とは何?

『PageLinker』というのは、私が自作したブックマークレットの一つです。

今見ているページへリンクを張るためのタグを自動生成して、リンクタグのHTMLコードをプロンプトに表示します。

あなたがすることは、リンクを張りたいページを表示しておいてから、PageLinkerをワンクリック。
それだけで、リンクに必要なHTMLコードが取得できるのです!
あとは、記事中にコピペするだけ。
すごく簡単ですよね。

私もブログを運営していますが…。
いちいちリンクタグを自分で作成するのが少々面倒でした。
できることなら楽をしたい。
そんな理由で、手間を省くことができる、このブックマークレットを作ることにしたのです。

PageLinkerの導入方法

手順

PageLinkerの導入方法は簡単です。

新規ブックマークを作成し、タイトルを『PageLinker』として、URLには以下のコードを貼り付け、保存しておきます。

この時、自分にとって分かりやすい場所にPageLinkerを置いておくと良いですね。
おすすめとしては、ブックマークバー上に『ブックマークレット』というフォルダを作成して、その中にPageLinkerを配置する方法。
そうすると、すぐに探しやすいですし、使いやすいです。

javascript:(function(href,title){var tag='<a href="'+href+'" title="'+title+'" target="_blank">'+title+'</a>';prompt('PageLinker',tag);})(location.href,document.title);void(0);

PageLinkerの使い方

使い方

PageLinkerの使い方も、実はとても簡単。

まず、リンクを張りたいページを画面に表示(アクティブ化)しておきます。
その後、さきほどブックマークしておいたPageLinkerをクリックします。
すると、プロンプトが表示されますので、そこにあるHTMLコードをコピーします。
最後に、記事中の任意の場所に貼り付けるだけ。

PageLinker

PageLinkerのソースコード

ソースコード

ちなみに、PageLinkerのソースコードは以下のようになっています。

簡単に動作を説明すると…。
hrefにはページのURL、titleにはページのタイトルが代入されます。
それぞれの変数を使って、リンクタグのHTMLコードを表す文字列を作ります。
最後に、それをプロンプトに表示するだけです。

JavaScriptに関する基本的な知識があれば、誰でも作れそうな非常に簡単なプログラムとなっていますね。
コードの行数はわずか4行。
やっていることは非常に地味なのですが…。
実際、使ってみると、これが意外と便利です。

javascript: (function (href, title) {
  var tag = '<a href="' + href + '" title="' + title + '" target="_blank">' + title + '</a>';
  prompt('PageLinker', tag);
})(location.href, document.title); void (0);

まとめ

まとめの一言

今日は、JavaScriptのプログラミングをしまして…。
今見ているページへのリンクタグを自動生成するブックマークレット『PageLinker』を作成してみました。

ブログ記事を書いている時に、リンクを張りたい場面というのは意外と多いものです。
そんな時に、PageLinkerを使えば、あっという間にHTMLコードが取得できます。
記事執筆の時短に大きく貢献してくれるでしょうね。

とてもシンプル。
だけどパワフル。
そんなPageLinkerをぜひお試しくださいね。
きっとあなたを満足させてくれるはずですよ。

この記事のタイトルとURLをコピーする
著者情報
読了時間: 約1

鈴木俊吾(すずしん)

【名前】
鈴木俊吾(すずしん)

【肩書き】
夢実現サポーター

【自己紹介】
座右の銘は『一度きりの人生、楽しむべきだよね絶対!』。夢実現サポーター。あなたの夢を叶える手伝いをします。ブログで情報発信中。顧客のニーズに応えるため、様々な分野の資格取得を目指しています。趣味は、読書・音楽鑑賞・カラオケ・プログラミング・将棋・MTGなど。年間50冊以上の本を読みます。

【スポンサー募集】
当ブログでは、現在スポンサーを募集しています。詳細はPatreonにて。活動を続けるためには、あなたの力が必要です!

【保有資格】
珠算検定2級/実用英語技能検定準2級/普通自動車運転免許/実用マナー検定準3級/安全運転能力検定3級/カラアゲニスト/ミュージックマスター・オンライン5級/DJ検定5級/相続総合コンサルタント補/姿勢診断士5級/タイピング技能検定イータイピング・マスター4級/Googleデジタルワークショップ デジタルマーケティングの基礎/ICTプロフィシエンシー検定試験5級/インターネットにおけるルール&マナー検定ビジネス版/EFSET 59 (B2 Upper Intermediate)/色彩士検定4級/ビジネス実務与信管理検定試験3級/YouTube Music 認定資格/日本化粧品検定3級/将棋29級/フライドポテト・アンバサダー検定(ブロンズ)/.com Master BASIC

この記事のタイトルとURLをコピーする

コメントを残す