ココログをTwitterカードに対応させてみる
ココログをTwitterカードに対応させる方法を調べてみた。
この設定をすると、ココログの記事のURLを Twitter に貼り付けた際に、。
ココログ(ブログ)を Twitterカードに対応させる試み。https://t.co/jbmYQq5tkD
— 風柳 (@furyutei) 2016年11月22日
これで表示されるかな…?
のような形で表示される。
ただ、画像については記事毎に手動で指定しないといけないのが難点。■前準備
- ブログの「設定」→「基本情報」の「ブログのサブタイトル(キャッチフレーズ)」欄に
<meta name="twitter:card" content="summary" /> <meta name="twitter:site" content="@(自分のTwitterユーザー名)" /> <meta name="twitter:image" content="(Twitterカードにデフォルトで表示させたい画像のURL)" />
※例
<meta name="twitter:card" content="summary" /> <meta name="twitter:site" content="@furyutei" /> <meta name="twitter:image" content="https://furyu.tea-nifty.com/image/kaze2_120x120.png" />
のような記述を追加し、[変更を保存]→[サイトに反映] - Card validatorで、適当な既存ブログ記事の URL を指定して、[Preview card]ボタンをクリック。 のような感じで表示されれば OK。
■記事投稿時
- 通常通りブログの記事を書く。
このとき、記事中に Twitter カード上にサムネイル表示させたい画像がある場合には、本文の一番最初に、<meta name="twitter:image" content="(記事中の画像のURL)" />
のように追記して、記事を保存する。 - Twitterに当該ブログ記事の URL を貼り付けてツイートすれば、Twitterカードが表示されるようになる。
■注意書きなど
- 上記では、metaタグには"twitter:card"、"twitter:site"、"twitter:image" のみを指定し、Summary Card — Twitter Developersで指定されている"twitter:title"、"twitter:description"(共に Required = YES)を指定していない。
これは、これらのタグが設置されていない場合には、Twitter 側で代わりに meta[property="og:*"] を参照してくれるため。ココログでは、もともと"og:title"、"og:description" 等があらかじめ設定されている。 - meta[name="twitter.image"]を複数設置した場合には、Twitterは一番最後に設置されたものを参照する模様。
これを利用して、「ブログのサブタイトル(キャッチフレーズ)」欄ではデフォルト画像を指定しておき、記事によって変更したい場合には、記事本文に meta[name="twitter.image"]を別に指定することで、記事毎に異なる画像を指定することが可能になる。ただし、うまくいかない場合もある模様。
« 神使の兎 ~宇治神社にて~ | トップページ | 鍛高譚 ~ カレイにまつわる物語 »
「ウェブログ・ココログ関連」カテゴリの記事
- 久しぶりの投稿がココログへの苦言というのもなんなのですが……(2019.03.20)
- ココログをTwitterカードに対応させてみる(2016.11.23)
- 【覚書】風柳亭(ココログプロ)をレスポンシブWebデザイン化(Bootstrap3使用)(2015.10.09)
- ココログ用全文検索 - ココログ最強検索を jQuery を使って作り直してみた(既知の不具合の幾つかに対応)(2015.09.01)
- 現在に生きるということ。(2013.01.05)
「おもいつき」カテゴリの記事
- ココログをTwitterカードに対応させてみる(2016.11.23)
- 神使の兎 ~宇治神社にて~(2016.07.10)
- Twitter 原寸びゅー:PC版ブラウザ用・Twitterの画像閲覧と保存がはかどる拡張機能の紹介(2016.02.12)
- スマートフォンをPC上の音楽を再生するためのリモコンとして使いたい(2016.01.10)
- 【覚書】風柳亭(ココログプロ)をレスポンシブWebデザイン化(Bootstrap3使用)(2015.10.09)
「覚書」カテゴリの記事
- 鍛高譚 ~ カレイにまつわる物語(2018.05.25)
- ココログをTwitterカードに対応させてみる(2016.11.23)
- 神使の兎 ~宇治神社にて~(2016.07.10)
- Twitter 原寸びゅー:PC版ブラウザ用・Twitterの画像閲覧と保存がはかどる拡張機能の紹介(2016.02.12)
- スマートフォンをPC上の音楽を再生するためのリモコンとして使いたい(2016.01.10)
ココログさんが漸く公式にカード表示対応したようですね。
→ 「ココログがTwitterカードに対応しました」
投稿: 通りすがりの元ココログユーザー | 2017/06/02 16:06