2

我正在尝试生成一些可嵌入的 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 工作。

4

6 回答 6

3

创建一个简码是我解决这个问题的方法。它绕过 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 显示的内容中。

于 2012-06-08T21:05:49.213 回答
3

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

=== 更新 ===

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');

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

于 2012-06-08T13:57:14.693 回答
2

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

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

于 2015-04-16T12:58:27.247 回答
0

Google 使用X-Frame-Options标头(设置为SAMEORIGIN)来防止您将其放置在 iframe 中。解决这个问题需要用户使用不支持X-Frame-Options.

于 2012-06-08T13:58:32.920 回答
0

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

http://codex.wordpress.org/Shortcode_API

于 2012-06-08T14:52:47.680 回答
0

不幸的是,谷歌和雅虎等主要搜索引擎网站(不包括 bing)不允许 iframe 嵌入,因为它们提供了大量的 API 和集成选项。所以你真的没有真正的方法可以做到这一点。如果您不打算将 google 作为您的 iframe 源嵌入,那么您应该清楚地了解您拥有的当前代码。尝试一下,只需将源更改为其他内容 - 谷歌不会出现在它的位置。不幸的是,如果你想要一个搜索引擎,我会惊恐地说,必应是唯一有效的。

希望这可以帮助!

因此,回顾一下 - Google 不会嵌入 iframe,但您生成的其他内容应基于您的编码:例如:

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

http://jsfiddle.net/pKby8/

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

于 2012-06-08T14:07:14.093 回答