2013年02月02日 category : Blog tags :

Facebookもチェック(Like Box)が途切れている場合の対処方法

このエントリーをはてなブックマークに追加

20130202-likebox

”「Facebookもチェック」が途中で切れてしまいました。人様のアイコン切れるのイクナイ!”

先月中頃だと思うのですが「Facebookもチェック」(Likebox)の仕様って変わりました?アイコンの下に名前が表示されていたと思うのですが、いまは出ていないですね。その変更に伴ってか、画像が切れるようになってしまいました。

どういう状態になっているのかは、以下を見て貰えればわかるかと思いますが、人様のアイコンが途切れるのは申し訳ないので対処してみました。

01 . アイコンが途切れる

こんな感じで途切れてしまいます。(画像はFacebookDevelopers)

likebox-01

以前はFacebookソーシャルプラグインというフッター(?)まで表示されていたのですが、これが表示されずという状況です。

likebox-02

ちなみにCSSのheightが足りてないんじゃないの?って思った方もいるかと思いますが高さを確保しても同じです。途切れたまま…

02 . 対処方法

フッターが出ていないだけなら大した問題でもないのですが、アイコンが途切れてしまうのはよろしくないので対処してみました。

当ブログのFacebookもチェック(Likebox)は横幅328pxで作成しています。これは設置場所やブログ、サイトによって異なると思うのですが、今回はこの横幅が影響しているみたいです。横幅を317px以下にすると治りました。

likebox-03

ここからはちょっとCSSの話になりますが、328pxを316pxにしましたので12px減少することになります。なので両端を6pxずつmarginを増加。これで元通り途切れることなく表示されるようになりました。

03 . Facebookの対応待ち

当ブログではHTML5用のコードで表示していますが、iframe用にしてみても同じ結果になりました。当ブログは個人ブログなので12pxの調整で済みましたが、1px単位で戦っているサイトも沢山あります。

横幅の調整で出る出ないになるとデザインにも影響してきますしね。Facebookの対応待ちでしょうか。いい解決法ありましたら教えてくださいませ m(__)m

HOME >>  Blog > Facebookもチェック(Like Box)が途切れている場合の対処方法