如何轻松在WordPress中嵌入iFrame代码(3种方法)

03/23/2024

什么是iFrame?

iFrame(内嵌框架)允许您在网站上嵌入视频或其他内容,而无需实际托管这些内容。这样可以节省带宽和存储空间,因此,您不应直接将视频上传到WordPress。此外,iFrame会自动更新原内容的变化,这意味着访问者将始终看到最新版本的内容。通过iFrame嵌入版权内容也不违反版权法,有助于保护您免受法律诉讼。

方法1:使用源代码在WordPress中嵌入iFrame(快速简便)

许多大型视频托管网站都有“嵌入”选项,可供您获取所需的iFrame代码以添加到网站。例如,在YouTube中,要在WordPress中嵌入YouTube视频,只需点击所需视频下方的“分享”按钮。然后您会看到一个弹出窗口,提供各种分享选项。接下来,点击“嵌入”按钮,YouTube会显示iFrame代码。启用隐私增强模式,可以使访客在您的WordPress网站上观看嵌入内容而不会影响他们在YouTube上的浏览体验。然后,只需复制该代码并将其粘贴到您的文章或页面中。在WordPress块编辑器中,打开页面并点击“+”按钮,在弹出的窗口中输入‘HTML’以找到自定义HTML块,然后将YouTube iFrame代码粘贴到该块中。发布页面即可看到嵌入的YouTube视频。

方法2:使用WordPress插件嵌入iFrame(适用于所有网站)

并非所有第三方网站都提供现成的嵌入代码。如果找不到任何“分享”或“嵌入”设置,可以使用iFrame插件轻松创建自己的iFrame代码。首先,安装并激活iFrame插件,插件激活后无需设置。然后,在所需的页面或文章中添加Shortcode块,添加以下短代码:[iframe src=”URL goes here”],将“URL goes here”替换为您要嵌入的内容URL。例如,在WordPress中添加Google地图,这对于商店、餐馆和其他场所添加路线图非常有用。在发布或预览文章后,您应该会看到嵌入的内容。

方法3:手动创建iFrame代码(无需插件)

如果您不想使用特殊的WordPress插件,可以手动创建iFrame代码。打开所需页面或文章,然后在WordPress内容编辑器中添加HTML块。粘贴以下代码到您的HTML块中:
,将“URL goes here”替换为您要嵌入的内容的直接URL。您还可以添加额外的参数来更改内容在网站上的外观。例如,可以将宽度设置为600像素,高度设置为200像素:
。这在您需要在较小空间中显示嵌入内容时非常有用。

有哪些iFrame替代方案?

使用iFrames有些缺点,并不是所有网站都允许将其内容放入iFrame,您可能需要手动调整内容以使其在可用空间中看起来不错。另一个问题是HTTPS网站只能使用来自其他HTTPS网站的iFrame内容,HTTP网站也是如此。因此,许多平台如WordPress更喜欢使用oEmbed。通常,您只需在WordPress文章中粘贴一个URL,就可以使用oEmbed嵌入视频和其他内容,WordPress会自动调整oEmbed的大小以适应可用空间,使其始终在台式机、智能手机和平板电脑上看起来完美。
重要提示:WordPress默认不再支持Facebook和Instagram帖子 的oEmbed。我们建议使用社交媒体插件来显示社交媒体内容。例如,Smash Balloon可以轻松嵌入Facebook、Instagram、Twitter和YouTube的内容。

希望本指南能帮助您学习如何轻松在WordPress中嵌入iFrame代码。您也可以查看我们的其他指南,例如如何在WordPress文章和页面中允许PHP,以及我们专家推荐的最佳YouTube图库插件。



Related Posts

  • 2025-02-16
  • WordPress 教学

你是否想过,能不能用更引人注目的方式取代WooCommerce中基本的促销徽章?答案是肯定的!通过自定义产品徽章,你可以在在线商店中突出新产品、折扣商品或限时优惠。在这篇文章中,我们将展示给你两个简单的方法,使用强大的插件或添加简单代码来为你的WooCommerce商店添加自定义产品徽章。

閱讀更多
  • 2025-01-18
  • WordPress 教学

我们都知道推荐计划是强大的武器。但要找到真正的品牌代言者并不容易。许多计划吸引的只是想快速赚钱的人,导致非真实的推广,无法有效转化客户。幸好,作为 WooCommerce 商店的店主,您有一个巨大的优势:一群真正喜爱和使用您产品的内置客户群。通过将这些现有客户转化为推广合伙人,您可以释放真实口碑营销的力量。

閱讀更多
  • 2025-01-10
  • WordPress 教学

最近,我们的一位比利时读者在其在线商店中苦于销售增长缓慢。除了其他建议外,我们建议他们在网站上设置Bancontact支付。Bancontact是一种主要在比利时使用的流行支付系统,客户可以通过银行账户进行安全的实时支付。

閱讀更多

{"email":"Email address invalid","url":"Website address invalid","required":"Required field missing"}
>