ente‐will

ネットの話題を中心に気になったことや調べたことを書いています

タイトル、サムネイル、概要が入ったカード型のリンクははてなブログカードで設置できる

      2015/03/12

最近、利用している人を良く見かけカード型でタイトル、サムネイル、概要が書いてあるリンクですが、これは はてなブログが提供しているブログカードで表示させることができます。

hatenacarddemo
※これは画像

はてなブログカードは元々はてなブログでのみ使うことができる機能でURLを貼り付けるだけでリンクを表示されるものでしたが、機能拡張してoEmbed APIというのに対応したことでWordPressは勿論のことFC2やライブドアブログなどでも利用することが出来る様になりました。

しかし、そのような外部のブログで表示させるためには今のところ「iframe」を使う方法しかないようです。iframe内は独立したページとして扱われるのでコンテンツの一部として見られることが無くなります。

また、はてなカードの仕様でリンクのリファラーというのがはてなブログのURLになってしまうようです。例えば自分のサイトにリンクしてくれた人がいたとしてもURLがはてなからなので特定できない事が起こりえるわけですね。

WordPressではiframeを使わない方法もあるので、そのうち紹介しようと思います。

色々と不満な点もありますが、見た目が良く魅力的なはてなカードを設置する方法には以下のコードを挿入するだけで可能となります。

【】←これで囲われている所を消して該当内容に置き換えます。(【】も消します)

FirefoxのMake Linkで使う時はこちら、「HTMLエンティティを使用する」にチェックを入れる。

概要やサムネイルの部分はOGPという自サイトから発信されるブログ情報が使われているので、この機能を有していないまたは設定していないブログではタイトルとURLだけの寂しい表示になってしまいます。

 - サイト運用

Adsense

スポンサーリンク

Adsense

スポンサーリンク

  関連記事

mu1
ムームードメインでドメインを取得・申し込み方法を解説(画像あり)

ムームードメインでドメインを取得する方法を解説したいと思います。 まずは以下のU …

no image
Seesaaブログで無料で独自ドメインを使う方法(ムームードメイン編)

独自ドメインをブログで使うにはレンタルサーバーが必要だと思っている人も多いと思い …

no image
サイトの移転(引っ越し)には404ではなく410がいいらしい

サイトの移転(引っ越し)をするときには404ではなく410を使ったほうがいいこと …

WebmastertoolMessage
Googleウェブマスターツールに登録したらImprove the search presence of…というメッセージが来た

新しく作ったサイトをGoogleウェブマスターツールに登録したら「Improve …

analytics
ExpressWeb 30GB/月の転送量はアクセス数でどれくらい?

これを書いている時点ではこのブログはレンタルサーバーのExpressWebですを …

no image
複数のブログにログインするのが面倒でストレスになるならブログエディタという選択肢も

サイトを何個か持っていると毎回ログインすることが面倒で、ストレスが溜まるので何か …

no image
ドメインの有効期限が切れたら再取得は出来る?

「ドメインとは、取得前の基礎知識」でも触れましたがドメインはレンタルです。その為 …

エックスドメインの無料レンタルサーバーでWWWありで正規化したい

エックスドメインの無料レンタルサーバーで独自ドメインを設定し、WordPress …

no image
レンタルサーバーと無料ブログどっちがいい?独自ドメインは必要?

FC2ブログやライブドアブログの様なブログでは予め用意されているドメインをサブド …

no image
Seesaaブログでトップページの「続きを読む」や特定ページだけに表示する方法など覚えておくと役立つカスタマイズ方

Seesaaブログで記事ページだけに表示されるように広告タグや文言を設置したつも …