twitter cards

ブログ記事をツイートしたときに概要を表示できるTwitter Cardsに対応する方法

2013.5.29 (更新日:2016.03.02)
twitter cards

たぶんTwitter経由だった思うのですが、こちらのブログでTwitter Cardsなるものを知りました。

【ツイートした時にブログの概要などを表示させよう】自分のサイトをTwitterCards(ツイッターカード)に対応する方法

そういえばちょっと前に話題になってたなぁという気もしますが、あまり気にしてはいませんでした。ただ、今回あらためてちゃんと調べたら、設定しておいて損はないというかメリットしかないという気がするので設定してみることにしましたよ。

Twitter Cardsが何者かというと、自サイトに設置したTweetボタンなどからURL付きのTweetをした場合に下図のように「概要を表示」というリンクが表示されるようになります。

twitter cards

これをクリックするとトップの画像のようにそのURLの記事の要約が表示されます。FacebookやGoogle+へシェアした場合と同じような表示です。

いちいちURL先を確認しなくても内容が確認できるため、RTやクリック率の増加が見込めそうですね。

プラグイン「Twitter Cards」のインストール

設定方法は先のリンクに書いてあるとおりなのですが、Wordpressの場合はプラグインでもっと簡単に設定が可能です。

WordPressのプラグイン「Twitter Cards」をインストールします。

このプラグイン自体に設定画面はなく、特になにもすることなく動作します(表示形式を変えたい場合はfunction.phpで設定にコードを追加して設定します(後述))。

Twitter Cardsの利用を申請する

https://dev.twitter.com/docs/cards/validation/validator」から申請を行います。

twitter cards

「Validate & Apply」のタブを選び、自サイトの適当な記事のURLを入れて「Go!」を押すと上記のような表示になります。

右側にTwitter Cardsのプレビューが表示されます。ちなみに、Cardの種類にはデフォルトの「Summary」の他にもいくつかあります。

twitter cards

ブログで使用するなら「Summary」か「Summary_Large_Image」でしょうかね。デフォルトの「Summary」以外にしたい場合はWordpressテーマのfunction.phpに以下のコードを追加します。

function twitter_custom( $twitter_card ) {
    if ( is_array( $twitter_card ) ) {
        $twitter_card['card'] = 'summary';
    }
    return $twitter_card;
}

add_filter( 'twitter_cards_properties', 'twitter_custom' );

この中の「summary」の部分を設定したい名前に書き換えて下さい(名称は先程の申請画面の「Try Card」タブで「Choose card」ボタンを押して選ぶとわかります)。設定後、再度上記のリンクでプレビューさせれば、ちゃんとできていれば表示が変わるはずです。

twitter cards

Summary Large Imageを設定するとこんな感じになります。

問題なければ、左上「Request Approval」を押して申請画面に移ります。

twitter cards

必要な項目は大体自動入力されています。手動で入れなければいけないのは、

  • Website Description:サイトの説明
  • Website Twitter Username:Twitterのユーザー名

の2つですね。うちの場合は、

  • Website Description:This site treats a mobile gadget mainly.
  • Website Twitter Username:@dreamseed

としました。

最後に「Request Approval」を押せば終了です。以前は承認されるまで数日待つ必要があったようですが、今はすぐに承認した旨のメールが返ってきます。

実際にどの程度の効果が見込めるのかは不明ですが、Wordpressの場合は簡単に設定ができるので利用しない手はないでしょう。これで多少なりともフォロワーの増加やブログへの流入が増えると嬉しいのだけれど……。

タグ: , , , , ,

この記事が気に入ったら
いいね!しよう

最新情報をお届けします

Stealth

体感トレーニング「プランク」を楽しみながらできるトレーニングアイテム「Stealth」がKickstarterでキャンペーン中

効果があると話題の体感トレーニング「プランク」をもっと楽しみながら効果的に行えるアイテム「Stealth」がKickstarterでキャンペーン中です。 プランクは床に肘をつき体を床と平行にして20秒

C-89 iron man Speaker

かっこいいBluetoothスピーカー「C-89 Iron Man Bluetooth Speaker」をレビュー 性能も意外と悪くない

GearBestで黒いアイアンマン風のBluetoothスピーカー「C-89 Iron Man Portable Bluetooth Music Speaker」を購入してみました。 風というか、直球

Amazon

Cyber MondayセールでKindleやFire TV Stickが大幅割引中!

Amazonの今年最後のビッグセール、Cyber Mondayセールが開始されました。 いろいろと安くなっていますが、Amazonの電子書籍リーダーKindle、Kindle Paperwhite、そ

Amazon Go

米Amazon、レジがないリアル店舗「Amazon Go」をオープン

米Amazonが噂になっていたリアル店舗「Amazon Go」をシアトルにオープンさせました。 このAmazon Go、1800平方フィート(約167㎡)ほどのコンビニで、最大の特徴はレジがないという

amazon

Amazonギフト券10,000円分が当たる「Prime Musicを聞いてAmazonギフト券を当てよう」キャンペーン開催中

Amazonで、「Prime Musicを聞いてAmazonギフト券を当てよう」というキャンペーンが開始されました。 1000名にAmazonギフト券10,000円分が当たります。 「Prime Mu

HUAWEI Mate 9の詳細レビュー 5.9インチだけど片手で楽に持てるサイズ感

HUAWEI Mate 9の詳細レビュー 5.9インチだけど片手で楽に持てるサイズ感

HUAWEIの最新モデル、HUAWEI Mate 9を購入したので早速レビューです。 まだ1ShopmobileやExpansys、GearBestなどのECサイトには入荷していなかったので、今回...

スマホの画面をテレビに出力できるMiracast(ミラキャスト)の使い方

スマホの画面をテレビに出力できるMiracast(ミラキャスト)の使い方

名前だけは聞いたことはあるものの、使っている、活用しているという話をあまり聞かないMiracast(ミラキャスト)、どんなものかと思って実際に使ってみました。 ...

honor 8の詳細レビュー HUAWEI P9やZenfone 3と比較してみました

honor 8の詳細レビュー HUAWEI P9やZenfone 3と比較してみました

上位機種のHUAWEI P9と同等のスペックを持つhonor 8の詳細レビュー。HUAWEI P9やASUS ZenFone 3と比較しながら紹介します。...

Amazonの日本版Cyber Mondayセールは12月6日0時から開催

Amazonの日本版Cyber Mondayセールは12月6日0時から開催

世界的にはCyber Mondayは先週でしたが、日本では12月第2週がCyber Monday。 ということで、12月6日0時からAmazonでCyber Mondayセールが始まります。 A...

「HUAWEI P9」と「HUAWEI P9 lite」どちらを買うか悩んでいる人のためスペックを比較

「HUAWEI P9」と「HUAWEI P9 lite」どちらを買うか悩んでいる人のためスペックを比較

HUAWEI P9とP9 lite、どちらを購入するか悩んでいる人のために、スペック比較と選ぶためのポイントになりそうな箇所をピックアップしてみました。...

MENU

back to top