Communication)印刷屋から五反田のWeb屋に転職したCLのブログです。この広告は、90日以上更新していないブログに表示しています。電子工作github.com秋月電子通商、お盆で秋葉原の店舗がリニューアルしましたね。そんなことにはあまり関係ないが、秋月電子通商のオンライン販売ウェブサイト、まさに電子部品のデパートみたいで見ているとオラなんだかワクワクするのですが、「このイケてる商品のリンクをはてなブログに貼ろう」とすると、こんな感じでちょっと残念です。akizukidenshi.comせっかくの商品の魅力が台無しなので、見栄えがよくなるよう、具体的に言うとOGPのメタデータを埋め込むサイトを作りました。使い方(はてなブログ)秋月電子の個別商品ページのURLがhttp://akizukidenshi.com/catalog/g/gM-07385だとしまして、これをはてなブログに貼るとakizukidenshi.comとなります、これがはてなブログの「はてなブログカード」+秋月電子の商品ページのメタデータでの表現です。秋月電子の個別ページのURLの前に、今回用意しました「http://akizukidenshi-ogp-injector.dtpwiki.jp/」を付けまして、http://akizukidenshi-ogp-injector.dtpwiki.jp/http://akizukidenshi.com/catalog/g/gM-07385とすることで、OGPに対応したメタデータが埋め込まれたページができるので、それをそのままはてなブログに貼ると、akizukidenshi-ogp-injector.dtpwiki.jpこうなります。商品の写真が表示され、商品の詳細説明が読めるので、「どらどら、サイトに行ってみようかな?」となりそうな雰囲気だと私は思います。Card展開してくれて、商品画像が出てくれるのでうれしい。FacebookはむずかしいOGPといえばFacebookですが、FacebookのOGPパーサは割と厳格に解釈するので、今回のインジェクタのように本来のURLを指示したまま別のページを作るのはNGでした。og:urlのドメインを秋月電子通商からインジェクタのドメインに差し替えてしまえばいいのでしょうが、さすがにそれはいかんと思う。インジェクタのウェブサイトあまりユーザインタフェースいらない仕組みなんですが、とりあえず作ってあるので、ブックマークするならこちらをどうぞ。使用前・使用後の比較画像です。関係ないが印刷関連の一般社団法人JaGraっていうところが印刷関連の動画を配信する「ジャグラBB」っていうサイトを持っていまして、新着動画がわかりにくいのでRSSを生成するやつを8年前作ったわけだけれども、blog.dtpwiki.jpblog.dtpwiki.jp印刷展示会(IGAS)のときJaGraのブースがあったので名刺出して「せっかくの動画サイトなんで、RSSあったほうがいいですよ」とか言うたりしたが未だにジャグラBBにはRSSが付かないので、こういうのは外部の人間が便利だーとか言っても変化がないものである。今回の秋月電子のサイトにOGPメタデータが付いていたらいいのにな、でも付いていないから野良で付けるのです、というのもこのままになりそうだなあと思いました。(1)はてなブログをはじめよう!C_Lさんは、はてなブログを使っています。ブログを報告するスターをつけました引用をストックしましたストック一覧を見る閉じる引用するにはまずログインしてくださいログイン閉じる引用をストックできませんでした。再度お試しください閉じる限定公開記事のため引用できません。