おしブロ from STONEWEB

おしい県でWebに携わって働く人のブログ from ストーンウェブ。IT&Web界隈に関する役に立ちそうなことをまとめていきます。2013年1月運営開始。

移転しました。

約3秒後に自動的にリダイレクトします。

”TwitterCards”をはてなブログに設定した。(そして現在申請中)

f:id:lord_cashew:20130223100048p:plain

昨日のセミナーの中で登場した”TwitterCards”というものを、このブログ(はてなブログ)に設定してたのでメモしておきます。

 

Twitter Cardsとは

”Twitter Cards”とは、ツイート内にURLが含まれていた場合に詳細表示にしてみるとサイト(ページ)のタイトルや概要やアイコン写真を表示する、というものです。

 

Twitter Cardsをはてなブログに設定する方法

1.まず最初に当然のごとくTwitterアカウントが必要です。

 

2.サイト(ブログ)のHEAD内に下記タグを設置します。

しかしながら、はてなブログはHEADのカスタマイズ ができないので、「デザイン>カスタマイズ>ヘッダ」の欄にタグを記述します。(少し強引ですが)

<meta name="twitter:card" content="summary" />

<meta name="twitter:site" content="lord_cashew" />

<meta name="twitter:site:id" content="238524502" />

<meta name="twitter:creator" content="lord_cashew" />

<meta name="twitter:creator:id" content="238524502" />

"card"には"summary"と記述します。(ブログの場合)

"site"には"Twitterのアカウント(@は不要)"を記述します。

"site:id"には"TwitterのID"を記述します。IDがわからない場合は便利ツールで確認できます。

f:id:lord_cashew:20130223095624p:plain

"creator"には"Twitterのアカウント"を記述します。(siteと同じでOK)

"creator:id"には"TwitterのID"を記述します。(site:idと同じでOK) 

 

3.公式プレビューツールで設置できたかを確認します。 

f:id:lord_cashew:20130223095644p:plain

 

こーんな感じで表示されたらOKです。

下の方にTwitterのアイコン・名前・アカウント名が表示されているかどうがポイントです。

f:id:lord_cashew:20130223095654p:plain

 

4."Twitter Cards"の利用申請をします。

f:id:lord_cashew:20130223095705p:plain

f:id:lord_cashew:20130223095716p:plain

Name:  自分の名前

Email: メールアドレス

Twitter UserName: Twitterのアカウント

Website domain:  ブログのURL

Website description:  ブログの概要

Twitter Username associated with that domain: Twitterのアカウント

Example Summary Card URL: ブログのURL/summary.html

 

これで"Twitter Cards"の設定は終了です。

ちなみに審査結果は1〜2週間後にメールが届くみたいです。

 

追記:

このブログを上記の内容で利用申請したのが数時間前のことなので、現在このブログは”審査結果待ち”の状態です。

故に、上記内容で確実に審査OKになるかどうかは(今のところ)”まだわからない”のが正直なところですので、参考程度に見て頂ければと思います。

 

参考サイト(感謝)

あなたのサイトをTwitterで目立たせる!Twitter Cards設定方法

はてなダイアリーにTwitter Cardsを設定する方法

 

© STONEWEB