2

iframe コードを使用して、開発中のサイトに fb のようなボタンを表示しました。通常、すべてのブラウザーで正しく表示されますが、これはクロムでのみ表示されます。

html5 を使用してみましたが、xfbml はまだ他のブラウザーでは表示されません。

html5 バージョンの CSS スパンで高さと幅を修正しようとしましたが、まだ表示されません。

それはクロムheight:0;とwidth:0;height:21;width:73;

なぜそれが起こっているのですか？

http://developers.facebook.com/docs/reference/plugins/like/に fb ページの URL を入力すると 、プレビューが表示されないことにも気付きました。他のページを試してみると、プレビューが表示されます。

これは、他のブラウザで表示されない理由と関係がありますか?

これがiframeコードです

<iframe src="//www.facebook.com/plugins/like.php?href=http%3A%2F%2Fwww.facebook.com%2Fpages%2FCarolina-Designer-Cabinets%2F400436533396747&amp;send=false&amp;layout=button_count&amp;width=450&amp;show_faces=false&amp;font&amp;colorscheme=light&amp;action=like&amp;height=21" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:450px; height:21px;" allowTransparency="true"></iframe>

サイトはこちら http://carolinadesignercabinets.com/

4

1 に答える 1

1

奇妙なことに、これを引き起こすレイアウト (CSS、JS、または HTML のいずれか) の特定の問題のように見えます。また、Chrome 以外のブラウザでは iframe の内部コードが正しくレンダリングされていないようです。いずれにせよ、Facebook は iframe を非推奨として発表したので、更新されたコードに移動して、うまくいくかどうかを確認することをお勧めします。あなたの場合：

<div class="fb-like" data-href="http://www.facebook.com/pages/Carolina-Designer-Cabinets/400436533396747" data-send="false" data-layout="button_count" data-width="450" data-show-faces="true"></div>

まだ行っていない場合は、ページの下部に次の JS を含める必要がある場合があります。

<div id="fb-root"></div>
<script>(function(d, s, id) {
  var js, fjs = d.getElementsByTagName(s)[0];
  if (d.getElementById(id)) return;
  js = d.createElement(s); js.id = id;
  js.src = "//connect.facebook.net/en_US/all.js#xfbml=1&appId=465232306855359";
  fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));</script>
于 2013-05-10T07:27:35.310 に答える