Twitterにログイン
Twitterへようこそ。ログインして通知をチェックしたり、会話に参加したり、フォローしているユーザーの最近のツイートを見てみましょう。
で動作チェックしてみたけど、エラーは出ない。しかし、画像が表示されない。
そんなあなたへ!
原因は色々あると思いますが、私の例での解決策をシェアします。
失敗例と成功例
失敗例
<meta name="twitter:image" content="img/twitter.png">
成功例
<meta name="twitter:image" content="https://doko-tabi.com/img/twitter.png">
解説
普段できているTwitterカードの設定が問題なくできているこのWordPressで出力されたコードを参考に解決しました。
Twitterが外部のwebサイトとして読み込むので、httpから始まるURLで記述するのが正しいようです。
サンプル
小さいカードタイプでの例です。
画像のサイズは144×144です。
大きいカードにするには1行目の「summary」という部分を「summary_large_image」に変更してください。
その場合の画像サイズは600×314がいいでしょう。
<meta name="twitter:card" content="summary"> <meta name="twitter:title" content="どこ旅"> <meta name="twitter:description" content="気温や飛行時間から海外旅行先を探すことができます。「暖かい国に行きたい!」や「涼しい国に行きたい!」から海外旅行の行き先を絞り込むことが可能!"> <meta name="twitter:image" content="https://doko-tabi.com/img/twitter.png">
コメント