WordPressサイトの記事をX(旧Twitter)でシェアした時にカードを大きく表示する方法

WordPressサイトで作成した記事をX(旧Twitter)でシェアをする時に、サムネイル画像やTwitterカードが小さく表示されてしまう事は無いでしょうか？
実はこれ、「タイトル」「画像」「説明文」などの補足情報を表示するための仕組みであるOGP(Open Graph Protocol)の記述が原因になっているので、テーマファイルエディタでフルサイズのカードを表示するための文言変更についてご紹介していきます！

X(旧Twitter)でカードが小さく表示される症状とは？

WordPressサイトで作成した記事をX(旧Twitter)でシェアをした時に、「タイトル」「画像」「説明文」などが表示されるXカードが小さく表示されてしまう事があります。

あまりにもサイズが小さすぎて、誰にもクリックしてもらえなさそうな表示ですよね・・。
最初はX側の仕様の問題かと思っていましたが、実はWordPressのテーマファイルの中にある、OGP(Open Graph Protocol)向けのメタタグに記述されている内容が原因だったんですね。

Xカードのサイズを指定する設定項目があれば、この方法を使用する必要はありませんが、このサイトで使用しているTCD GENSENの場合は、PHPファイル内にあるコードの記述を直接変更をしなくてはいけない仕様になっているのです。

TCDに限らず、Xシェア時の設定変更が出来ないテーマであれば、同じやり方でカードのサイズを変更できると思うので、TCDテーマやXカードのサイズ指定が出来ない場合のサイズ変更の方法をご紹介していきます！

X(旧Twitter)でカードを大きく表示するためのコード

TCDテーマの場合は、テーマファイルエディタ→functions→ogp.phpの順番で開いていきます。
他メーカーのワードプレステーマの場合は、OGPやSNSシェアに関するコードが記述されたPHPファイルを探して下さいね。

Xのシェアボタンを押した後にポストに表示されるサムネイルのサイズは、<meta name=”twitter:card” content=”〇〇”>に記述されているコードの内容で決まります。

Xで記事をシェアしたときに小さいサイズで表示される場合は、<meta name=”twitter:card” content=”summary”>となっているはずですが、このsummaryのコードをsummary_large_imageに変更するだけで、大きなサイズのカードで表示されます。

<meta name=”twitter:card” content=”summary_large_image”>に変更をしたら、「ファイルを更新」をクリックして、記事をシェアしてみて下さいね。

このように大きなサイズで表示されるようになりましたが、何で最初から大サイズで表示する設定をしておかないの？と思ったけど、画像なのか記事なのか分からないサイズを嫌う層もいるらしい。
リダイレクトをして詐欺サイトに誘導をするURLリンクもありますから、誤クリックを嫌がる人がいるのも当然仕方が無い事かもしれませんね・・。

過去のポストについても、サーバーのキャッシュが更新された時に、大きなサイズのカードに更新されるようになりますので、そのまま何もせず待ってみるのが良いと思いますよ。