記事紹介に便利な、今見ているページのテキストリンクを作るブックマークレット

ブログ技術

まだまだ春遠い雪景色を見ながらぼちぼち花見の記事などを読んでうらやんでいるゴロドクです、どうも。

ブログ書いていると「これ面白い」と思って紹介したいウェブページのリンクをチョイチョイつくんなきゃならないんですが、いちいちaタグにリンクURLとタイトルをそれぞれ記入・コピペするのは結構骨です。

そんなときに今見ているページへのリンクタグを自動生成して一発でコピペできるブックマークレットをご紹介します。

javaスクリプトソースコード

参考にしたのは

テキストリンク作成ブックマークレット | gerenuk.crazyphoto.org/

という記事です。

このページで紹介されているコードそのままで十分使い物になるのですが、aタグのtitle属性はあまり必要なさそうなのでそれを削除し、ターゲットウィンドウを指定しないものと新規ウィンドウを開くもので2通り用意しました。ソースは以下の通りです。

ターゲット指定なし版


javascript:
var url=location.href;
var title=document.title;
var linkTag ='<a href="'+url+'">'+title+'</a>';
var x = prompt('',linkTag);

新規ウィンドウを開く版


javascript:
var url=location.href;
var title=document.title;
var linkTag ='<a href="'+url+'" target="_blank">'+title+'</a>';var x = prompt('',linkTag);

必要に応じて使い分けいただければいいと思います。本当はトグルボタンやチェックボックスで指定できるほうが便利なんでしょうけど…その辺の改良版できたらまた報告したいと思います。

使い方

使用前の準備

使用しているブラウザで新規にブックマーク(お気に入り)をつくって、上のソースをそれぞれURL欄にコピペすればOKです。名前は自分に分かりやすいように適当につけてかまいません。

面倒くさい方は以下のリンクをそのままブックマークに追加していただいても結構です。

text-link【same Window】:ターゲット指定なし版

text-link【New Window】:新規ウィンドウを開く版

でブックマークが出来たら、ブックマークバーなど常に表示しているところに置いておくといいと思います。

リンクタグの取得

リンクタグを作成したいページを閲覧中にそのまま上記のブックマークを開いていただければOKです。

ダイアログが開き、そのページのURLとtitleタグの内容をテキストとして取得しあらかじめaタグ内に挿入された状態で表示されますので、それをコピペしてください。

試しに今見ているこの記事のリンクタグを発行してみましょう。

<a href=”https://blog.56doc.net/Entry/216/”>記事紹介に便利な、今見ているページのテキストリンクを作るブックマークレット | 56docブログ</a>

<a href=”https://blog.56doc.net/Entry/216/” target=”_blank”>記事紹介に便利な、今見ているページのテキストリンクを作るブックマークレット | 56docブログ</a>

ターゲット指定なし版、新規ウィンドウ版それぞれダイアログが表示されて上のようなタグが発行されれば成功です。

ブックマークレットとは?

私もイマイチ定義を分かってないので解説など。

Bookmarklet。ウェブブラウザで作動するJavaScriptプログラムの一種。

通常ウェブブラウザでブックマーク(お気に入り)を選ぶと、登録しておいたURLに遷移するが、URLの代わりにJavaScriptのプログラムコードをブックマークしておくことで、それを選んだ時にプログラムが実行されてちょっとした機能が実現できる。そのようなものをブックマークレットと言う。

インストールはそのコードをブックマークするだけで行える。

ブックマークレットとは – はてなキーワード」より引用。

今まであんまり利用したことなかったですけど、さすがに毎日あれこれ記事書いてると半ルーティーンワーク的な作業もあるのでうまいこと利用して作業効率改善に繋がればと思います。やっぱりコンテンツ作成に専念できるほうがいいですもんね。

他にも便利そうなもの見つけたり、ちょろちょろとソース作ったときにはまた紹介して行きたいと思います。

コメント

タイトルとURLをコピーしました