折纸SEO SEO优化 如何在WordPress嵌入iFrame代码

如何在WordPress嵌入iFrame代码

iFrame提供了一种无需上传即可将视频或其他内容嵌入网站的简捷方式。腾讯视频、B站等许多第三方平台都允许用户…

如何在WordPress嵌入iFrame代码

iFrame提供了一种无需上传即可将视频或其他内容嵌入网站的简捷方式。腾讯视频、B站等许多第三方平台都允许用户使用iframe嵌入其网站中的内容。

在本教程中,将先容在WordPress中嵌入iFrame代码的三种设施。

如何在WordPress嵌入iFrame代码折纸SEO

什么是iFrame?

通过iFrame,您可以在网站上嵌入视频或其他内容。这意味着您可以在站点上显示视频而无需上传该视频至你的网站。

iframe就像在网站上打开一个窗口以显示外部内容一样,现实内容从嵌入的源中加载。

添加iframe,需要添加特殊的HTML代码。但操作都对照简朴,后面会详细先容如何将iFrame嵌入WordPress的三种方式。

为什么使用iFrames?

使用iFrame的一个关键缘故原由是制止必须在自己的网站上上传视频或其他资源,以免占用大量的带宽和存储空间。

另外,通过iFrame,还可以制止侵权问题。您无需下载视频或其他内容后再将其上传到网站,只需使用iFrame将其添加到页面即可。

另一个优点是,若是原始内容更改了,iFrame嵌入的方式也会自动更新内容。

如何在WordPress嵌入iFrame代码折纸SEO

使用iFrame也有一些瑕玷。并非所有网站都允许将其内容放入iFrame。另外,对于您的页面而言,iFrame可能会变得太大或太小,因此您需要手动对其进行调整。

另一个问题是HTTPS网站只能使用iFrame嵌入其他HTTPS网站内容。同样,HTTP站点只能使用iFrame嵌入其他HTTP站点内容。

这就是为什么像WordPress这样的许多平台都喜欢oEmbed的缘故原由。您只需将URL粘贴到WordPress帖子中,即可使用oEmbed嵌入视频以及其他类型的内容。内容将自动调整为合适的巨细,且兼容移动装备。

主要提醒: WordPress不支持针对Facebook和Instagram的oEmbed。

iFrames的另一个绝佳选择是使用社交信息流插件。推荐使用Smash Balloon插件,以实现显示来自Facebook,Instagram,Twitter和YouTube的内容。

下面让我们详细看看如何将iFrame添加到网站的三种差异方式。

1.使用嵌入代码在WordPress中添加iFrame

许多大型网站的内容都有“嵌入”选项,以iFrame代码提供其网站内容。

举了例子,若是你需要分享B站的视频,你只需要在详细的视频页面,点击视频播放器下方的分享按钮,即可看到嵌入代码,如下图所示:

如何在WordPress嵌入iFrame代码折纸SEO

单击“复制”按钮以复制代码。

然后,将该代码粘贴到WordPress网站上的任何文章或者页面。我

下面我们将演示将代码复制粘贴到页面的块编辑器(古腾堡编辑器)。

通过WordPress仪表板中的页面»新建页面,即可确定新页面。然后,将HTML块添加到这个页面。

如何在WordPress嵌入iFrame代码折纸SEO

现在,您需要将B站的视频分享iFrame代码粘贴到该块中。

如何在WordPress嵌入iFrame代码折纸SEO

WordPress文章高亮文本设置教程

通过预览或公布页面以查看嵌入其中的B站视频。

如何在WordPress嵌入iFrame代码折纸SEO

提醒:若是使用的是旧版经典编辑器,则需要在“文本”视图中添加iFrame代码。

如何在WordPress嵌入iFrame代码折纸SEO

注:在经典编辑器上的可视化和文本视图之间切换可能会导致iFrame代码泛起问题。

2. 使用iFrame插件实现iFrame代码嵌入

此方式比第一种方式更适用,由于它允许您确定iframe来嵌入任何泉源的内容,纵然该泉源未提供嵌入代码。

首先,您需要安装并启用iFrame插件。

启用后,该插件无需进行设置即可事情。编辑或确定文章、页面。然后,添加一个简码(shortcode)块。

如何在WordPress嵌入iFrame代码折纸SEO

之后,您可以使用此短代码输入iFrame代码。

[iframe src="URL goes here"]

只需将 URL goes here  替换为您要嵌入到站点中的内容URL。举个例子,嵌入百度舆图。

提醒:您可能需要使用“嵌入”选项来获取内容的URL。但你只需要使用URL,而无需使用其余的嵌入代码。

如何在WordPress嵌入iFrame代码折纸SEO 预览或公布文章,即可查看网站上嵌入的百度舆图。

如何在WordPress嵌入iFrame代码折纸SEO

您还可以在iFrame短代码添加参数,以更改嵌入内容的显示方式。例如,设置宽度和高度,添加或删除转动条或边框。这些参数信息可以在iFrame插件页面上找到。

提醒:若是使用的是经典编辑器,则只需将简码粘贴到帖子或页面中。您无需切换到“文本”视图。

如何在WordPress嵌入iFrame代码折纸SEO

3. 手动确定iFrame代码并嵌入WordPress

若是不想使用iFrame插件,则可以手动确定iFrame代码。为此,您需要在WordPress内容编辑器中添加HTML块。

如何在WordPress嵌入iFrame代码折纸SEO

然后将下面iframe代码粘贴到HTML块中。

<iframe src="URL goes here"></iframe>

将“URL go here”替换为嵌入的内容的URL地址。继续以百度舆图为例:

如何在WordPress嵌入iFrame代码折纸SEO

你还可以设置HTML标签其他参数。例如,设置iFrame的宽度和高度,以下代码示意将嵌入内容显示为600*300像素。

<iframe src="URL goes here"></iframe>

若是嵌入内容受限于版块宽度,则这很有用。

如何在WordPress嵌入iFrame代码折纸SEO

希望本教程能辅助您学会如何将iFrame代码嵌入WordPress。

如何修复WordPress网站关于cURL错误

本文来自网络,不代表折纸SEO立场,转载请注明出处:https://www.30th-feb.com/3176

作者: DAR_KING

发表回复

您的邮箱地址不会被公开。 必填项已用 * 标注

联系我们

联系我们

在线咨询: QQ交谈

邮箱: luckiestmjt@163.com

工作时间:周一至周五,9:00-17:30,节假日休息

关注微信
微信扫一扫关注我们

微信扫一扫关注我们

返回顶部