ブックマークレットでリンク先を綺麗に紹介

シェアする

ネットワークPING-BLOG

ブログで記事を書いているときに、他サイトの記事や自サイトの昔の記事に対してリンクを張って紹介する場合が多々あります。今まではchromeの拡張機能である「Cleate Link」を使って純粋なhtmlでのリンクを作成していました。こんな感じのリンクです。

WORDPRESSのプラグインを徹底的に整理して表示を高速化

ただ、あまりにもリンクがあっけなさ過ぎて、あまりリンク先の記事を読みたいという気持ちになれないので、何かもう少し装飾する方法がないか、ネットで情報を調べてみました。

すると、はてなブログカードというフォーマットがあることが判りました。WORDPRESSでこれを実現するためのプラグインやテンプレートのカスタマイズをする方法が見つかりました。ただ、プラグインを使うと少なからず遅くなってしまう懸念がありますし、またテンプレートに対して直接の修正をするとテンプレートをアップグレードしたときに変更を失ってしまうことになります。

また、記事の中に置換するための専用のタグを記載しますが、もしもプラグインやテンプレートの修正が失われると、リンクとして機能しなくなってしまうという懸念もあります。

そこでほかに良い方法がないか調べてみると、ブックマークレットで実現方法を紹介している記事を見つけました。こちらの記事です。

こちらのブックマークレットをchromeのブックマークバーに設定して、リンクしたいページを表示しているときに、そのブックマークレットを指定するとhtmlコードが取得できます。これをブログ記事に貼り付ければOKです。上記のリンクにはさっそく利用していました。

また、内部リンクでもテストをしてみます。こちらになります。

こちらのブックマークレットの中身を見ると、「hatenablog.com」のサービスを利用していることが判ります。このリンクを踏んで参照先ブログに飛ぶと、参照先サイトではhatenaから来たように見えてしまうことが欠点となります。また、hatenablog.comがこのサービスの提供をやめたときは、リンクが機能しなくなってしまうことにもなります。

ほかにも良い方法がないか、もう少し調べてみたいと思います。

【2015/05/06追記】

見つけました。こちらはリンクは自前、画像の取得にhatenaのサービスを利用しているようです。これならばリンク先からも直接、このブログから参照されたように見えるはずです。

【ブログカード風】シンプルに記事をシェアするブックマークレットを作りました

ブログを書くとき、記事へのリンクをどのように貼っていますか? べた書きですか? ShareHTMLですか? GetTabInfoなんて拡張機能を使っている人もいらっしゃるかもしれません。 最近よく見る

sakueji.com

ただ、hatenaがこのサービスの提供を停止したときは画像が表示出来なくなってしまいます。もう少し何か方法が無いか探してみます。

スポンサーリンク

スポンサーリンク

シェアする

フォローする

スポンサーリンク