Page Plugin – Social Plugins – Documentation – Facebook for Developers

Posted on by mtoplistChuyên mục:Top List

Adaptive Width

The plugin will by default adapt to the width of its parent container on page load (min. 180px / max. 500px), useful for changing layout:

<div style="width: 190px;">
<!-- Page plugin's width will be 190px -->
<div class="fb-page" data-href="{url}" data-width="420"></div>
</div>

If the width of the parent element is bigger than the Page plugin’s width it will maintain the value defined in data-width:

<div style="width: 600px;">
<!-- Page plugin's width will be 500px -->
<div class="fb-page" data-href="{url}" data-width="500"></div>
</div>

The plugin will never be smaller than 180px:

<div style="width: 100px;">
<!-- Page plugin's width will be 180px -->
<div class="fb-page" data-href="{url}" data-width="320"></div>
</div>

Adaptive width can be switched off by unchecking Adapt to plugin container width and the plugin will rendered at the specified width irrespective of the parent container.

No Dynamic Resizing

The Page plugin works with responsive, fluid and static layouts. You can use media queries or other methods to set the width of the parent element, yet:

  • The plugin will determine its width on page load
  • It will not react changes to the box model after page load.

If you want to adjust the plugin’s width on window resize, you manually need to rerender the plugin.

mtoplist