過去に当ブログのURLをツイッターに投稿するとツイートにプレビューが表示されるように設定した手順を書きました。
Blogger.com(blogspot)のブログにツイッターカード(リンク先のプレビュー)を設定する
あとで分かった次の2点について追記します。
投稿ごとのサムネイル画像の表示
投稿ごとの説明文(description)の表示
環境
・Blogger.com (blogspot)最低限必要なmetaタグの設定
マイブログの左メニューからテンプレートを開き、HTMLの編集をクリックします。
<head>タグのすぐ下または、</head>タグのすぐ上に次の4行をコピーして貼り付けます。
投稿ごとにサムネイル画像を表示する
テンプレートを開き、HTMLの編集に<b:includable id='mobile-post' var='post'>
という行が2カ所あるので
2カ所ともその下に次のタグを入力します。
これで投稿の1枚目の画像がサムネイル表示されます。
画像が投稿されていなければサムネイルには何も表示されません。
投稿ごとに説明文(description)を表示する
ツイッターカードの説明文(description)は長い文字は途中で省略されてしまうので100文字程度の文章を考えて設定するといいと思います。投稿ごとに説明文を次のHTMLタグで入力します。
課題
Blogger.comのレイアウトデータタグはヘルプに載っていないものが多く、投稿毎に<head>～</head>の内側にmetaタグを追加する方法が不明です。今回追加したmetaタグは<head>～</head>の外側に記述しているのでHTMLの文法エラーですが、ツイッターカードが文法エラーを無視して認識してくれるのでよしとしています。
ただしスマートフォン用ツイッター公式アプリではこの設定では期待通りに表示されませんでした。
関連ブログ
[セキュリティ] Twitterの「このリンクは安全ではない」「このリクエストを保留しています」の対策2015年版ツイッターのツイート履歴CSVを文字化けしないようにExcelに取り込む方法
[Android] アプリからツイートするとハッシュタグが消える(URLエンコード漏れ)
ツイッターAPIの検索で複数の画像URLが取得できない対策方法
以上、参考になれば幸いです。
0 件のコメント:
コメントを投稿
注: コメントを投稿できるのは、このブログのメンバーだけです。