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

スポンサーリンク

  関連記事

no image
ExpressWebを使い始めて3ヶ月経ったので使用感をレビュー

ExpressWebを使い始めて3ヶ月ほど経ったのでレビューしようと思ったけど、 …

no image
ドメインとは、取得前の基礎知識

ドメインは一般的にURLと言われるものでネット上の住所と例えられることもあります …

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

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

screenshot_02
画像編集ソフト「Screenpresso」はSkitchのようなカッコいい矢印が書ける

ブロガー御用達のカッコいい矢印を画像に書くことができるScreenpressoを …

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

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

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

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

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

エックスドメインで使える無料レンタルサーバーには独自ドメインの設定が出来ます。「 …

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

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

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

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

Server
ExpressWebの障害でMySQLのデーターが消えるの巻き

ExpressWebがやらかしやがった。 MySQL接続障害のお知らせ というこ …