自定义代码嵌入

注意:我们正在过渡到工作区，并且正在更新我们的内容。访问Workspaces博客文章阅读更多关于这些更新和变化，或访问我们的更新了自定义代码嵌入的课程．你也可以学习如何检查您的帐户是否在工作区上．

的嵌入元素使您能够向站点添加自定义代码块。如果你有一个付费的Webflow帐户，或者你的项目有一个活跃的网站计划，你可以使用嵌入元素解锁各种自定义功能。

您可以嵌入第三方元素，例如谷歌文档和表，社交媒体源，即时聊天软件，形式和调查，以及更多。您也可以使用CMS收藏领域动态更新嵌入的代码。

注意:的嵌入元素只支持超文本标记语言，CSS在<样式>标记中，并且JS在脚本< >标签。你不能将服务器端语言(例如，Perl, PHP, Python, Ruby)集成到一个嵌入元素。

在这节课中，你将学到:

1. 如何添加一个嵌入元素
2. 如何编辑嵌入元素
3. 如何设置尺寸上的嵌入元素
4. 如何预览嵌入的内容
5. 常见问题和故障排除技巧

重要的是:自定义代码是一种高级修改，可能与Webflow的底层功能相冲突。因此，Webflow不能保证任何自定义代码的功能或完全兼容性。此外，我们的支持团队无法提供自定义代码设置或故障排除的直接帮助，因为这些主题不在本教程的范围内我们的客户支持政策．如果您遇到自定义代码的问题，请让我们知道Webflow论坛，整个Webflow社区(包括工作人员)都可以提供额外的帮助和资源。

如何添加一个嵌入元素

您可以在设计中的任何位置或富文本元素中嵌入第三方代码或您自己的自定义代码。

需要知道:Embed元素中的自定义代码不能超过10,000个字符。如果要嵌入的代码较长，可以将其存储在另一个服务器上，并在嵌入中引用脚本。您还可以使用第三方工具缩小您的自定义代码，或者将代码拆分为多个Embed元素(前提是这不会破坏任何JavaScript函数)。

如何将自定义代码直接添加到您的设计

1. 复制您想嵌入到剪贴板的代码
2. 打开添加面板和添加一个嵌入元素的Webflow帆布
3. 粘贴在步骤1中复制的自定义代码
4. 保存并关闭模态

重要的是:如果您的自定义代码有开始和/或结束标记，请确保添加这些标记，以确保您的代码按预期工作。另外，不要在你的自定义代码中包含， ，或标签，否则你的网站/布局会被破坏。

注意:默认情况下启用了行换行，以方便查看和编辑代码，但您可以通过取消选中来切换此设置线包装复选框的HTML嵌入代码编辑器．您也可以通过单击& quot启用全屏编辑最大化”图标。

专家提示:如果您想在整个站点中重用相同的嵌入内容，可以使用符号将您的Embed元素转换为可重用组件。

如何将自定义代码添加到富文本元素

1. 复制您想嵌入到剪贴板的代码
2. 将光标放入富文本元素您想在哪里添加自定义代码
3. 点击“+图标以打开插入菜单，然后单击自定义代码按钮
4. 粘贴在步骤1中复制的自定义代码

如何在自定义代码中使用动态内容

您可以将Collection字段合并到嵌入的代码中，以动态地提取信息以供各种用途。

了解更多:动态的嵌入

如何编辑嵌入元素

有很多方法可以打开HTML嵌入代码编辑器并编辑代码在嵌入元素。

您可以:

• 选择嵌入元素的帆布并双击
• 选择嵌入元素的帆布并按回车键
• 选择嵌入元素的帆布点击设置齿轮”图标
• 选择嵌入元素的帆布并点击打开代码编辑器在设置面板下HTML嵌入设置

很高兴知道:如果你看不到你的嵌入元素，您可以从导航器面板。然后,打开设置面板并点击打开代码编辑器下HTML嵌入设置编辑代码。

如何设置尺寸上的嵌入元素

如果Embed元素中的自定义代码没有显式地设置大小或尺寸，则内容通常会占用其父元素的全部宽度。你五月能够追加身高=“100%”宽度=“100%”控件中的嵌入元素和内容的宽度和高度风格的面板．

如何预览嵌入的内容

包装的自定义HTML< iframe > < / iframe >或> <时尚> < /风格标签将在画布或富文本元素中显示预览，但一些嵌入的代码只能在live网站上查看。任何时候一个脚本脚本< > < / >标记在代码编辑器中使用时，您将在设计器中看到该元素的占位符。

一旦发布或导出站点，其中的脚本和自定义代码将在您放置它的地方呈现。如果您需要在自定义域上使用您的站点之前预览嵌入，您可以将站点发布到.webflow。io暂存子域名。

了解更多:使用.webflow。IO作为测试和反馈的暂存域

常见问题和故障排除技巧

我可以在嵌入元素中使用服务器端语言吗?

你不能将服务器端语言(例如，Perl, PHP, Python, Ruby)集成到一个嵌入元素。Embed元素只支持超文本标记语言，CSS在<样式>标记中，并且JS在脚本< >标签。

我可以增加Embed元素的10,000个字符的限制吗?

控件中的自定义代码。嵌入元素不能超过10,000个字符。如果要嵌入的代码较长，可以将其存储在另一个服务器上，并在嵌入中引用脚本。您还可以使用第三方工具缩小自定义代码，或将代码拆分为多个嵌入元素(前提是这不会破坏任何JavaScript函数)。

的帮助!我的自定义代码不工作!

再次检查您的代码是否包含适当的开始和/或结束标记，并且不包含、或标记。

截至2020年8月，新发布的Webflow站点包括jQuery v3.5.1。使用自定义代码导入其他版本的jQuery可能会导致站点上的冲突和意外行为。脚本影响的DOM事件，如onClick, onHover等，也可能导致意外的行为。

重要的是要记住，自定义代码是一种高级修改，它可能与Webflow的底层功能相冲突。因此，Webflow不能保证任何自定义代码的功能或完全兼容性。

我们的支持团队无法提供有关自定义代码设置或故障排除的直接帮助，因为这些主题不在本文的范围之内我们的客户支持政策．如果您遇到自定义代码的问题，请让我们知道Webflow论坛，整个Webflow社区(包括工作人员)都可以提供额外的帮助和资源。