tips レスポンシブWebデザイン FacebookのLike Boxをリキッドレイアウトへ対応させる方法

テクノロジーカテゴリーの変更を依頼記事元:

nobish.jp

74 usersがブックマークコメント

記事へのコメント4件

注目コメント
新着コメント

web_shufu 実際使ってみました。私の場合、ちょっと修正が必要だったけど、それでもSpecial Thanks。

facebook

2013/03/13 リンク

abeshin22 メモ → tips レスポンシブWebデザイン FacebookのLike Boxをリキッドレイアウトへ対応させる方法

2013/03/04 リンク

sekt2o これは後々役立ちそう

2013/03/03 リンク

注目コメント算出アルゴリズムの一部にLINEヤフー株式会社の「建設的コメント順位付けモデルAPI」を使用しています

リンクを埋め込む

以下のコードをコピーしてサイトに埋め込むことができます

<iframe marginwidth="0" marginheight="0" src="https://b.hatena.ne.jp/entry.parts?url=http%3A%2F%2Fnobish.jp%2Ftips%2Fhow-to-respond-to-a-liquid-layout-facebook-like-box.html%2Ftag%2F%25E3%2583%25AC%25E3%2582%25B9%25E3%2583%259D%25E3%2583%25B3%25E3%2582%25B7%25E3%2583%2596Web%25E3%2583%2587%25E3%2582%25B6%25E3%2582%25A4%25E3%2583%25B3%2F" scrolling="no" frameborder="0" height="230" width="500"><div class="hatena-bookmark-detail-info"><a href="http://nobish.jp/tips/how-to-respond-to-a-liquid-layout-facebook-like-box.html/tag/%E3%83%AC%E3%82%B9%E3%83%9D%E3%83%B3%E3%82%B7%E3%83%96Web%E3%83%87%E3%82%B6%E3%82%A4%E3%83%B3/">tips レスポンシブWebデザイン FacebookのLike Boxをリキッドレイアウトへ対応させる方法</a><a href="https://b.hatena.ne.jp/entry/nobish.jp/tips/how-to-respond-to-a-liquid-layout-facebook-like-box.html/tag/%E3%83%AC%E3%82%B9%E3%83%9D%E3%83%B3%E3%82%B7%E3%83%96Web%E3%83%87%E3%82%B6%E3%82%A4%E3%83%B3/">はてなブックマーク - tips レスポンシブWebデザイン FacebookのLike Boxをリキッドレイアウトへ対応させる方法</a></div></iframe>

プレビュー

規約違反を報告

tips レスポンシブWebデザイン FacebookのLike Boxをリキッドレイアウトへ対応させる方法

Webサイトやブログなどにソーシャルプラグインを設置するのは、もはや当然なくらいなわけですが、今日は... Webサイトやブログなどにソーシャルプラグインを設置するのは、もはや当然なくらいなわけですが、今日はその中からFacebookのLike Boxを設置した際に、それをリキッドレイアウトへ対応させる方法を紹介します。 FacebookのLike Boxの設置コードには、それの横幅を指定してやる必要があります。以下のようなコードですね。 <div class="fb-like-box" data-href="http://www.facebook.com/2843.jp" data-width="500" data-show-faces="true" data-stream="false" data-header="true"></div> この例では横幅を500pxに指定していますが、ブラウザの横幅が500pxより狭くなってしまうと… コレだと不格好なので、何とかしてやりましょう。「レスポ