WordPressのテーマは「JIN」を使ってるんだけど、「トップページのOGP画像」を設定してもTwitterの投稿に反映されない…。
画像があるかないかでツイートの印象がぜんぜん変わるから、画像が表示されるようにしたいなぁ…。
この記事では、JINでTwitterカードに画像が表示されないときの対処法をお伝えします。
備忘録として、ポイントだけ簡単に。
JIN公式ページをチェック!
まずは公式マニュアルの手順を試してみましょう。
ただし、Jetpackプラグインのバージョンが新しいと、マニュアル通りにやっても解決されない可能性が高いです。
その場合は次へ。
トップページのソースを確認!
ブログのトップページを開いて、どこか適当なところを右クリック。
※クリックするのはリンクが貼られていない箇所です。
表示される右クリックメニューから「ページのソースを表示」をクリック。
すると↓こんな感じの、アルファベットがたくさん書かれた画面が表示されます。
※画像はあえてぼかしています。
この画面で、ctrl+Fを押して、検索窓が表示されたら「og:」と入力してEnter。
すると、↓のような「ここからOGP〜ここまでOGP」に囲まれたコードが見つかるかと思います。
1 2 3 4 5 6 7 8 9 10 11 |
<!-- ここからOGP --> <meta property="og:type" content="blog"> <meta property="og:title" content=""> <meta property="og:url" content=""> <meta property="og:description" content=""> <meta property="og:image" content=""> <meta property="og:site_name" content=""> <meta property="fb:admins" content=""> <meta name="twitter:card" content="summary_large_image"> <meta name="twitter:site" content=""> <!-- ここまでOGP --> |
そのままEnterを連打。
↓のような「Jetpack〜」に囲まれたコードがある場合は、JINで設定したTwitterカードの画像ではなく、Jetpackの設定が有効になっているので、次の手順で無効にします。
1 2 3 4 5 6 7 8 9 10 11 12 |
<!-- Jetpack Open Graph Tags --> <meta property="og:type" content="website" /> <meta property="og:title" content="" /> <meta property="og:description" content="" /> <meta property="og:url" content="" /> <meta property="og:site_name" content="" /> <meta property="og:image" content="" /> <meta property="og:image:width" content="512" /> <meta property="og:image:height" content="512" /> <meta property="og:locale" content="ja_JP" /> <meta name="twitter:creator" content="" /> <!-- End Jetpack Open Graph Tags --> |
functions.phpを書きかえる!
誤って書きかえてしまったときのために、編集前のコードのバックアップをとっておくことをオススメします。
外観 → テーマエディター → テーマのための関数(functions.php)を開く。
↑の画像の赤枠のところに↓のコードを追加して「ファイルを更新」
1 |
add_filter( 'jetpack_enable_open_graph', '__return_false' ); |
これで、JetpackのOGP設定が無効になりました。
うまく設定できていれば、「トップページのソースを確認!」の手順で検索してもJetpackのコードがないはずなので確認してみてください。