Facebookでブログ記事をシェアしようとすると文字化けする件


このブログの記事、Facebookで「シェア」しようとすると記事タイトルや内容の抜粋が文字化けしてしまう、という問題がありました。

気付いてはいたんですが、とりあえずウチのFacebookページや個人のタイムラインでは表面上問題なく表示されるので、解決を先送りにしてしまってました。
先日の「全国ブロガーツアー in 広島」で刺激を受け、このブログをプラットフォームとしてきちんと整備しないといけないなぁ……、と思い、今回この問題の解決に着手。

結構手こずりましたが、とりあえず問題は解消した模様。

Facebookデバッガーがはき出すエラーとページのソースを見比べて試行錯誤。

原因は、「Facebook関係のプラグインが生成するOGP情報がダブっていた」ことだったようです。(OGPの詳細については検索してみてください)

このブログでは、Facebookに関連するプラグインとしては以下の3つを使ってます。

これに、OGP情報のメタタグを生成するプラグイン「Open Graph Pro」を入れて運用していたのですが、どうもこれがマズかったみたいです。

「Facebook Like」がOGP情報を生成するので、他にOGP情報生成ツールが動いていると、情報がダブってしまい、うまく動かなくなるようです。
プラグインによってはこういう重複を避けるための設定が用意されているものもあるようですが、OGP情報を使うサービスに関係したプラグインを複数利用する場合には、ちょっと注意した方がいいみたいですね。

結局、現在のところこの「Open Graph Pro」を停止することで問題は解決。
本当は、OGP情報をさらに活かせるようにチューンアップした方がいいんでしょうし、その目的では「Open Graph Pro」はなかなか良さそうなんですが……。

当面は、トラブル回避を最優先して、この状態で運用していく予定にしています。

カテゴリー: Webツール・サービス, ツールあれこれ タグ: , , , パーマリンク