Facebookページプラグインを画面幅から出ないようにする

こんにちは。ましじめの田村です。

Facebookページの公式で用意されているフィードプラグインは、URLや必要項目を入力することでペースト用のHTMLソースを取得することができ気軽に自分のホームページにフィードを表示させることができます。

今回、Facebookページプラグインを設置してスマホ時画面幅からはみ出るケースがありました。
公式サイトをみてみると次の値を設定でるようです。
ページプラグイン

●data-href
「FacebookページのURL」
FacebookページのURLです。

●data-width
「幅」
プラグインの幅です(ピクセル数)。最小値は180、最大値は500です。

●data-height
「高さ」
プラグインの高さです(ピクセル数)。最小値は70です。

●data-tabs
「タブ」
表示するタブです(timeline、events、messagesなど)。複数のタブを追加する場合は、コンマで区切って指定します(例: timeline, events)。

●data-hide-cover
「カバー写真を非表示にする」
ヘッダーのカバー写真を非表示にします。

●data-show-facepile
「友達の顔を表示する」
友達が「いいね！」している場合にプロフィール写真を表示します。

●data-hide-cta
カスタムのコールトゥアクションボタンを非表示にします(ボタンがある場合)。

●data-small-header
「スモールヘッダーを使用」
サイズの小さなヘッダーを使用します。

●data-adapt-container-width
「plugin containerの幅に合わせる」
表示枠の幅に収まるようサイズを合わせます。

今回は幅がはみ出るという問題でしたのでdata-adapt-container-widthの値を見た所falseとなっていました。
こちらをtrueにすることで解決出来そうです。

data-adapt-container-width='true'

設定値などは変更される場合がありますので必要な時は都度公式サイトを確認すると良さそうです。
ページプラグイン

以上「Facebookページプラグインを画面幅から出ないようにする」でした。
ページプラグインを画面幅からはみ出さないようにしたい場合に参考にしてみてください。

---