ピンバックを送れる！はてな風ブログカードを作るブックマークレットを見つけたよ。ちょっと改造してみたよ。
/*--------------------------------------*/ /* ブログカード ここから */ /*--------------------------------------*/ .blogcard{ width:100%; max-width:500px !important; margin:0 0 20px 0; background:#fff; border:1px solid #ccc; border-radius:5px; box-sizing:border-box; padding:12px; } .blogcard-thumb{ width:100px; height:100px; float:right; margin:0 0 10px 10px; padding:0; position:relative; overflow:hidden; }
自分のサイト上で外部リンクをFacebookの画像つきリンクっぽく表示する方法
自分のサイトでもOGPを取得してリンクを格好よく表示させたい！ OGPの設定をしたので、ようやくSNSでリンクをシェアすると画像やサマリが表示されるようになった。しかし今度は自分の記事の中でも、外部のリンクを貼り付けた時に、fb上の表示のようになってくれると嬉しいと考えた。 調べてみると、どうもはてなブログでブログカードという機能で、外部のリンクを格好よく表示しているらしい。OGPにも対応しているそうだ。そうそう、こういう感じに表示したい！！ といっても、この機能ははてなブログの中で使える機能だ。Jekyll on Github Pagesの環境で実現する方法はないだろうか？ 「ブログカード」をOGPなどに対応しました。さまざまなWebページをコンパクトに整形して掲載できます - はてなブログ開発ブログ はてなブログでは、先日公開した「ブログカード」を拡張し、インターネットの一般的なWeb
はてなブログ ブログカードをブックマークレット化してみたよ – 林家次男
※2017年3月15日(水)、Dropbox のパブリックフォルダが廃止されたためブックマークレットが動かなくなりました。URL を差し替えたリンクに直しましたので、再登録お願いいたします。 先日でこにくというサイトで見かけてちょいちょい使っていたのですけども、このためだけに拡張機能を入れるのはなんか違うなぁと思ったのでブックマークレット化。 参考にしたというかきっかけになった記事 最初にでこにくを見たんですけれど、でこにくさんが参考にした、というところまで。 でこにく ↓ でこにくさんが参考にした記事 ↓ とまぁ、こういう感じでカード形式なリンクを作れる、というやつです。 ちょっと変えたところ mbdb さんの iframe ソースで作ると、HTML5バリデータで怒られるのでそこを変更。 バリデートしてみた mbdb さん追記で言及されている リファラーを見ていて気づいたんですが、ブログ
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
http://sakueji.com/blogcard-bookmarklet/
