【Web運営日記】TwitterカードOGP事件レポート

Web運営日記のアイキャッチ画像。パソコン画面のアイコンと「悪戦苦闘する毎日の連続だ!」というメッセージ入り。 Think & Market
Webサイト運営の裏側を記録する「Web運営日記」シリーズ用アイキャッチ。THINK INK NOW公式デザイン。

【事件発生】投稿したのにTwitterカードが表示されない!

先日、THINK INK NOWの記事をTwitterでシェアしようとしたところ、「あれっ?」と違和感を覚えました。

せっかく作ったアイキャッチが、ポストに表示されない!!──代わりに、ブログのデフォルトビジュアルが出てしまったのです。

Twitterでシェアした際に、意図したアイキャッチ画像が表示されなかったときのスクリーンショット。
OGP設定ミスにより、意図したTwitterカード画像が表示されなかった時の状況を記録したスクリーンショット。

一瞬でテンションがダダ下がりです(とほほ…….)。


【調査開始】まずはCard Validatorでチェック

原因を調べるため、Twitter公式の「Card Validator」を使ってみました。

結果は「summary_large_image found」──つまりタグ自体は存在している。

それでも、なぜか意図した画像が出ない。モヤモヤしながら、さらに調査を続けました。


【原因判明】OGP設定ミスだった!

WordPress側のSEOプラグイン「SEO SIMPLE PACK」の設定を改めて確認。すると──

サイト全体のデフォルトOGP画像が設定されており、投稿単体のアイキャッチが優先されていなかった!

まさに灯台下暗し……!


【解決策】二段構えでリカバリー!

すぐに次の2つの対策を取りました。

  • A案:投稿単体で明示的にOGP画像を設定
  • B案:全体OGP設定をリフレッシュして優先度を整理

この二段構えで対応した結果──無事、正しいアイキャッチがTwitterカードに反映されるようになりました!


【成果】公式アカウントにリポストされる

今回の一件で学んだのは、OGP設定は、見た目以上に影響力が大きいということ。

しかも、投稿した記事は、なんと「文具マーケット」公式アカウントさんにリポストされるという嬉しい結果に!

※5月18日開催の「第8回文具マーケット」の会場、正くは「大田区産業プラザPiO 大展示ホール」です。上記ポストの「五反田」は誤記載でした。訂正いたします。

SNS運用において、ビジュアル設計と細かい設定がいかに大事かを痛感しました。


【まとめ】Twitterカード、なめたらアカン!

OGPの細かい設定ミスは、案外誰でも起こすものです。

でも、それに気づいて修正するかどうかで、情報発信の質も結果も大きく変わると、身をもって学びました。

今後も、THINK INK NOWは細部にこだわりながら一歩ずつ進化を続けていきます。

明日もがんばろ!💪


コメント