Question

我正在尝试生成一些可嵌入的iframe代码，以便用户可以在博客中包含代码以显示我计划提供的内容。现在我正在尝试提供的内容只是一个网站。我试图在Wordpress博客上使用以下代码：

<iframe width="420" height="315" src="http://www.cnn.com" frameborder="0"></iframe>

但是当查看该页面时，Wordpress会根据以下html输出“http://www.cnn.com”的链接。

<a href="http://www.cnn.com">http://www.cnn.com</a>

也就是说，如果我使用Youtube生成的iframe代码，iframe加载就好了。例如：

<iframe width="420" height="315" src="http://www.youtube.com/embed/_OBlgSz8sSM" frameborder="0" allowfullscreen></iframe>

结果：

<iframe class='youtube-player' type='text/html' width='420' height='315' src='http://www.youtube.com/embed/_OBlgSz8sSM?version=3&#038;rel=1&#038;fs=1&#038;showsearch=0&#038;showinfo=1&#038;iv_load_policy=1&#038;wmode=transparent' frameborder='0'></iframe>

知道Youtube正在做什么来启用此功能，或者更普遍的是如何使我的简单iframe工作。

Answer 1

我不知道你为什么得到一个锚而不是iframe，但我知道谷歌不希望他们的主页在iframe中。如果你有一个带有src http://www.google.com 的iframe，你会看到一个空的iframe。另请参阅this example。

=== UPDATE ===

Wordpress禁止iframe几乎没有例外。可能你可以使用短代码来处理它。尝试将以下未经测试的代码添加到主题中的functions.php中。

// [iframe src="www.cnn.com"]
function iframe_func($atts) {
    extract(shortcode_atts(array(
        'src' => 'default'
    ), $atts));
    return '<iframe src="{$src}"></iframe>';
}
add_shortcode('iframe', 'iframe_func');

现在，您可以在wordpress admin中的文章编辑器中添加[iframe src="www.cnn.com"]。

Answer 2

创建短代码是我解决这个问题的方法。它绕过WYSIWYG编辑器并将html放在页面中。

我会像这样接近它。

将它添加到你的functions.php文件中：

function add_iframe($atts) {
    extract(shortcode_atts(array(
    'src' => '/'
    ), $atts));
  $theframe = '<iframe src="'.$src.'" width="420" height="315" frameborder="0"></iframe>';
  return $theframe;
}
add_shortcode('iframe', 'add_iframe');

用途：

将[iframe src = http://thesiteyouwanttoshow.com]添加到您希望iframe显示的内容中。

Answer 3

如果您在iframe中加载自己的网页，请记住大多数托管解决方案都将xFrame选项设置为SAMEORIGIN，因此无论您在Wordpress中更改了什么，该页面仍然无法呈现，因为它被目标阻止网站。

我花了好几个小时解决这个问题，所以希望如果你遇到这个问题，你也会成为目标网站。如果您在rails上托管解决方案，我找到的答案是here，并且可以找到一个肯定会在Wordpress中加载的网站here，因此请随意使用该端点作为测试。

Answer 4

Google使用X-Frame-Options标题（设置为SAMEORIGIN）来阻止您将其置于iframe中。解决此问题需要用户使用不支持X-Frame-Options的浏览器。

Answer 5

不幸的是，google和yahoo（bing除外）等主要搜索引擎网站不允许嵌入iframe，因为它们提供了大量的API和集成选项。所以你真的没有办法做到这一点。如果您不打算将谷歌嵌入作为iframe源，那么您应该清楚地了解您现有的代码。尝试一下，只需将源更改为其他内容 - 谷歌将不会显示在其位置。如果你想要一个搜索引擎，不幸的是我很恐怖，我说bing是唯一有效的。

希望这有帮助！

所以在回顾中 - Google没有嵌入iframe，但您生成的其他内容应该基于您的编码：例如：

<iframe width="420" height="315" src="http://www.uncrate.com" frameborder="0"></iframe>

http://jsfiddle.net/pKby8/

您获得的锚是xFrame选项的结果。当它连接到谷歌服务器时，服务器会回复一个可爱的回复，暗示你应该链接到它们而不是iframe。

Answer 6

我会创建一个WordPress short_code，它会在输出中插入你的iFrame。我认为通过在邮箱中直接添加iFrame代码，wordpress正在改变它。

http://codex.wordpress.org/Shortcode_API

Wordpress中的iframe

6 个答案: