eye_tw_cards

Twitter Cards とアナリティクスの設定・1

2014年1月からスタートした、Twitter Cards アナリティクス を利用するために Twitter Cards を設定してみました。

Twitter Cards とは? Twitter Cards を設定するとツイート内にURLが含まれている場合、左下の[開く / 詳細]が[概要を表示]に変わり、そのページのタイトルや概要、アイコン写真などが表示されるため、ツイートの内容もより充実したものになります。

1. Developer(開発者)ページから、Twitter Cards を選択

https://dev.twitter.com/

Developer(開発者)ページ にアクセスし、左端の Twitter Cards をクリックします。

2. Twitter Cards から Card Catalog を選択

https://dev.twitter.com/cards

Twitter Cards ページ内 Four simple steps の① から、Try them をクリックすると、Card Catalog が開きます。

tw_cards_02

Summary=一般向き, Product=ショップ, Photo,Gallery=ギャラリー系, Player=ムービー…など、配信内容に適したカードのレイアウトを選びましょう。

3. Card Validator – カード情報の検証・1

tw_cards_03

Twitter Cards の Try Cards に必要な内容を入力し、生成した Sample Embed Code を 〈head〉 に追記します。必須項目は titledescription ですが、Facebook の OGP を先に設定している場合は cardsite のみ 〈head〉 内に追記すれば完了です。

<meta name="twitter:card" content="summary">
<meta name="twitter:site" content="@ユーザー名">

4. Card Validator – カード情報の検証・2

tw_cards_04

〈head〉 に追記できたら Validate & Apply タブに切り替えてプレビューを確認し、エラーがなければ Request Approval ボタンをクリックします。

5. Request Domain Approval – Twitter Cards の承認

tw_cards_05

登録する Twitterアカウントと連結するウェブサイト情報の入力画面が表示されるので、必須項目*を入力後、Request Approval ボタンをクリックすると Twitter への申請は完了です。

6. 承認メールと Twitter の表示

tw_cards_06

申請後、数時間で承認メールが届きます。承認後のツイートから Twitter Cards が反映されるようになりました。

【承認前のツイート】

tw_cards_07

「開く」の表示が…

【承認後のツイート】

tw_cards_08-1

「概要を表示」に変化。

tw_cards_08-2

「概要を表示」のクリックで、リンク先ページの概要や画像が表示されます。

tw_cards_08-3

スマートフォンの表示はこちら。

Twitter Cards が設定できたら、次に Twitter Cards アナリティクス を設定します。
※ ツイートがコンテンツにリンクされ、24時間後にレポートが利用できるようになるため、続きは明日以降の公開予定です。

【追記】
・24時間経ちましたが、未だに Twitter Cards アナリティクス は使えません…(4/18 P.M.6:00)
・問題解決して Twitter Cards アナリティクス にアクセスできるようになりました…(4/19 P.M.8:00)

このエントリーをはてなブックマークに追加
LINEで送る

コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です

次のHTML タグと属性が使えます: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>