はてなブログのブログカードがOGPに対応! はてなブログ以外もブログカードスタイルになるぞ
ふおおお、マジか。
昨日の今日でアレなんですが、はてなブログがブログカードを拡張し、はてなブログ以外のサイトもブログカード形式で表示できるようにしてきましたよ!
自前で似たスタイルのキャプ付きリンク作る必要がなくなる･･･!
昨日、こんな記事を公開しました。
そこそこ反応を頂けまして、Twitterでもはてなブログ公式(hatenablog)に紹介してもらったりしたわけです。
先日公開した「ブログカード」をWordPressで利用されている方がいました。ありがとうございます！
[M] はてなブログの「ブログカード」をWordPressに対応する方法 | mbdb (モバデビ)http://t.co/Aub88yGdqQ— はてなブログ (@hatenablog) September 4, 2014
いやーありがたいなーはてなブログ以外のサイトは似せたスタイルでリンクを見せられるようにしたしゴリゴリ記事書こー、とか思ってたら、その日のうちにはてなブログ以外のサイトもOGPで取得できるようにしちゃうぜうわはははははー! な対応をしてきました。
アレですかね、まさかうちがキャプ付きリンクをブログカードに似せたスタイルにしたというのを見て、「だったら外部のサイトも対応したろうやないかい」っていうことなんでしょうかね? いやまさかそんなわけ･･･。
･･････。
ま･･･まぁ、そういうことはないとは思いますけど、とりあえずOGP対応しているサイトであれば、そのOGP情報を取得してブログカードで表示できるようになったというわけです。
で、気になるのが、これって昨日書いたoEmbed APIで使えるのか? ということです。試しにOGPに対応している当ブログのURLをコピペしてみたんですけど、残念ながらブログカードに展開されず、単純に文字列として表示されてしまいました。
WordPressのwp_oembed_add_provider()関数の記述方法を変えないといけないのか、それともはてなブログ側の公開APIが対応していないのかわからんのですが、公開APIを導入していても、現時点でははてなブログ以外のサイトのURLでは通らないようです。
あれ? でもiframeなら行けるんじゃね?
そうなんですよ。すっかりAPIだの何だのに目が行き過ぎててすっかり忘れてたんですけど、単純にiframeタグで記述したら普通に表示されるんですよね。
これなら別にoEmbed APIを導入していなくても、決まった記述さえしておけばブログカードが表示されるんですよ。
というわけで実際にiframeでリンクを埋め込んでみた結果が上。
見事にブログカードで表示されました。
記述するソースは以下のとおりです。
要はiframeのsrcではてなブログのエンドポイントURLにパラメータで、取得したいサイトのURLを加えるだけです。
あとは取得したいサイトがOGPに対応さえしていれば、タイトル、概要、OGPイメージ、URLが引っ張られて、整形されたHTMLに埋め込まれます。
これならChromeの「Create Link」やFirefoxの「Make Link」を使うことで、毎回iframeを手動で記述しなくても、サクリとコピペで利用できますね。
ただ、はてな側でこういう使われ方を良しとするかどうかはまた別問題。
はてなブログ以外のWebサイトやブログが、この方法でブログカードを表示させても良いのかどうかは、公式見解をお願いしたいところです。
これはこれで便利なんだけど、自分で作ったスタイルも結構愛着があるので、公式的にこういう使い方アリとなっても、どっちでリンクを見せるかという点に関しては悩むところだなぁ。
Create Linkとかで使う場合のテンプレート
Google Chromeの拡張機能「Create Link」やFirefoxのアドオン「Make Link」を使うのが多分いちばん便利なのではないかと思います。
基本、変数は同じなので、以下のテンプレートを登録すればいいだけです。
これで、サクッとリンクをブログカード形式で挿入できますよ。
http://hatenablog.com/となり、リンク先ブログのアクセス解析からは自分が発リンクしたことが伝わりません。
WordPressのピンバックはもちろん、Google Analyticsのトラックバックからもログを参照できないので、「それは嫌だなぁ」という人は普通にリンクを挿入したほうが良いと思います。