兼業主婦の楽しむアフィリエイト

いつものように自分で書いた記事をFacebookでシェアしようとリンクを貼ったらエラーでなんかよく表示されない。ブログ記事はちゃんと表示されてるけど一応再保存したり、ブログを再構築したりしてみたけどダメ。

試しにブログ内の「いいね！」ボタンを押してみると、こちらでも同じエラーが発生。

同じブログの他の記事はふつうに動くのにこの記事だけ何でだろうと思ったものの、まぁしょうがないから放置してたら、状況についてFacebookでつぶやいてたのを見た親切な友人が対処法を教えてくれました。

表示されていたエラーの内容は、以下のとおり。


友人に教えてもらった対処法は、
下記ページでURLを入力して「デバッグ」ボタンを押す。
https://developers.facebook.com/tools/debug/

「Facebookが独自にキャッシュ持ってるのを消す操作」なんだそうです。

これでちゃんと動くようになりました。感謝！

Like / angermann


自分のブログ記事に自分で「いいね！」することがないので気がつかなかったんですが、「いいね！」ボタンを押したときのコメント記入欄と投稿ボタンが隠れていたようです。友人が指摘してくれて気付きました。感謝！

無料ブログ（Seesaaブログ）なので自分で対処できることかわからないなぁと思いながらテストしてみたら、自分で書いたCSSの設定っていうかコードで隠しちゃってるっぽかったので、対処法を調べることに。

【Facebook】「いいね！」ボタンのコメント欄が隠れる（切れる）場合の3種類の修正方法
Facebook いいね！ボタンのコメント欄が表示されない問題2大パターンと解決方法

この2記事がわかりやすかったです。

コメント欄が隠れる原因・状態としては、

【1】いいね！ボタンに「max-width」が設定されている
【2】他のコンテンツの下に隠れている
【3】いいね！ボタンの親要素に「overflow: hidden;」が指定されている

の3つが考えられるとのこと。

わたしのブログの場合は、隠れ方が【3】だなと思ったので、引っかかっている親要素の「overflow: hidden;」を1つずつ消していったらちゃんと表示されるようになりました。

もしかしたら【3】だけじゃなく他の原因も作用してるかもと思ったんですが、他は特に問題なかったようです。よかった。

原因と対処法の詳細は、上掲の2記事をご覧ください。