自适应嵌入代码生成器
嵌入代码生成器
自适应嵌入代码生成器（YouTube、Vimeo、地图、Calendly）| We.Inc
粘贴 YouTube、Vimeo、Google Maps、Calendly、Spotify、Loom 或 Google Forms 链接，生成自适应、延迟加载的 iframe 代码，带无障碍标题、实时预览和服务商隐私说明。
粘贴受支持服务商的链接，选择宽高比，并为嵌入内容填写标题。生成的 iframe 代码可以适配任何屏幕宽度，只会在访客滚动到附近时加载，并为屏幕阅读器用户提供标题。实时预览会显示效果，每家服务商旁还会说明可能收集哪些信息，以及是否提供更注重隐私的选项。所有操作都在浏览器中完成。您输入或上传的内容不会发送给 We.Inc 或其他任何人。
- 粘贴链接：YouTube 或 Vimeo 视频、Google Maps 嵌入链接、Calendly 预约页面、Spotify 曲目或播放列表、Loom 视频或 Google Form。
- 工具会识别服务商，并将链接改写为其官方嵌入地址。无法识别的链接会被拒绝，不会猜测。
- 选择宽高比（视频用 16:9，另有 4:3, 1:1，或为预约页面和表单设置固定高度），并填写描述嵌入内容的标题。
- 选择加载方式。默认启用延迟加载，避免嵌入内容拖慢页面首次显示。
- 查看实时预览，然后复制 HTML。服务商说明会列出隐私或 Cookie 声明中应提及的内容。
- 为每个 iframe 添加描述内容的标题，例如“King Street 店铺地图”。屏幕阅读器会读出标题。
- YouTube 视频可使用 youtube-nocookie.com。这样访客点击播放前不会设置 YouTube Cookie。
- 将占用资源较多的嵌入内容放在首屏以下，或启用延迟加载；每个嵌入项都会从其他网站载入完整页面。
- 预约组件、聊天组件和表单属于服务商的产品，而不是您的网站。相关条款和数据处理规则由服务商决定。
- 对于 Google Maps，请依次选择“分享”和“嵌入地图”，然后复制 src 中的网址。普通地图链接无法嵌入。
常见问题
如何让 iframe 自适应？
将 iframe 放在设置了 aspect-ratio（例如 16 / 9）和 width: 100% 的容器中，并让 iframe 填满容器。旧网站会使用 padding-top 技巧；目前所有浏览器都支持 aspect-ratio。本工具会生成现代写法。
支持哪些服务商？
YouTube（包括 Shorts 和 youtu.be 链接）、Vimeo、Google Maps 嵌入链接、Calendly、Spotify、Loom 和 Google Forms。每种服务都有文档说明的嵌入地址。工具会拒绝其他链接，避免生成无法使用的代码。
延迟加载会影响嵌入内容吗？
不会。loading="lazy" 会告诉浏览器，只有当 iframe 接近页面可视区域时才获取内容。访客滚动到那里时，它会正常加载。
We.Inc 提供预约或聊天功能吗？
不提供。Calendly 等工具是需要您单独注册的服务。本工具只会生成在页面上显示其组件的代码。
为什么我的 Google Maps 链接无法使用？
普通的 maps.google.com 和 goo.gl 链接会阻止嵌入。请在 Google Maps 中打开地点，选择“分享”和“嵌入地图”，再粘贴所显示代码中 src 部分的网址。
每种嵌入内容对访客的影响
- 嵌入内容相当于另一个公司的页面窗口。它会加载对方的脚本，可能设置对方的 Cookie，也会增加页面负担。这通常有其价值，但应由您主动决定：首屏以下的嵌入内容启用延迟加载，在可用时采用增强隐私模式，并在隐私声明中提及第三方嵌入内容。
无障碍嵌入内容
- 屏幕阅读器会通过标题来说明 iframe 的内容。没有标题时，访客只会听到“框架”，无法了解内容。清晰的标题、嵌入内容下方指向相同内容的文本链接，以及视频字幕，能让所有人都可以使用嵌入内容。
免费开始 · 无需信用卡
Product
Who It's For
Features
Resources
Company
View Sitemap