如何将facebook页面插件调整为100％？

Question

我正在使用this facebook page plugin将其集成到我的网站。但是，似乎最大宽度仅为500px。互联网上有很多关于其他插件的建议但不是这个。

有没有人知道如何将此页面插件扩展到我的网页的100％？

Answer 1

实际上，你不能！ 由于插件页面源代码驻留在iframe中，其中CSS样式在本地应用 此外，插件页面iframe不在您的域/服务器中，因此您无法修改任何资源，因为SOP 见：

在某些方面，facebook说：

  

默认情况下，插件会适应其父容器的宽度   页面加载（最小180px / 最大 .500px），对于更改布局非常有用。

所以没有任何解决方法，甚至是丑陋的东西？

是的，有。
它可以获取响应页面内容（来自iframe url）并将内联CSS中的标记从500px替换为100％，如下所示：

<?php 

$url = 'IFRAME URL GOES HERE'; #copy and paste url from iframe plugin
$http_headers = array(
    'User-Agent: Mozilla/5.0 (X11; Linux x86_64; rv:40.0) Gecko/20100101 Firefox/40.0',
    'Accept: text/html,application/xhtml+xml,application/xml;q=0.9,*/*;q=0.8',
    'Accept-Language: pt-BR,en-US;q=0.7,en;q=0.3',   
);

$opener = curl_init($url);
curl_setopt_array($opener, array(
    CURLOPT_SSL_VERIFYPEER => false,
    CURLOPT_SSL_VERIFYHOST => false,
    CURLOPT_HTTPHEADER => $http_headers,        
    CURLOPT_FOLLOWLOCATION => true,
    CURLOPT_AUTOREFERER => true,
    CURLOPT_RETURNTRANSFER => true,        
));
$content = curl_exec($opener);
curl_close($opener);
# Maybe you want to use DomDocument + DOMXPath
echo str_replace('width: 500px', 'width: 100%', $content);

但是，它不是一个合适的解决方案。如果某些用户点击了按钮＆＃34;例如＆＃34;，那么facebook弹出窗口无法正常打开，那么这可能是一个问题。