WordPress
自定义 HTML 区块，或页面构建器的 HTML 元素。
地块 01
内嵌代码长什么样
一个放置计算器的元素，加一个 script 标签。请从后台复制准确的代码，其中包含您的嵌入密钥。
示意代码。属性名称和脚本地址以您后台显示的为准，可能有所不同。
<div data-calc="mortgage" data-key="YOUR_EMBED_KEY" data-mode="inline"></div>
<script src="https://app.calccapture.com/embed.js" async></script>地块 02
放置计算器的七种方式
| 模式 | 访客看到的内容 | 适用场景 |
|---|---|---|
| 内嵌 | 计算器直接显示在页面中，与网站样式隔离 | 房源页面、买家页和卖家页 |
| 框架内嵌 | 同上，放在可自动调整高度的 iframe 中 | 只接受 iframe 的建站平台 |
| 弹窗按钮 | 点击按钮在弹窗中打开计算器 | 房源描述下方 |
| 悬浮气泡 | 每个页面角落都有的按钮 | 全站随时可用 |
| 您自己的链接或按钮 | 您指定的任何元素都能打开计算器 | 自定义设计和菜单 |
| 直接链接 | 拥有独立网址的整页计算器 | 二维码、短信、邮件、社交媒体简介 |
| 传统 iframe | 普通 iframe | 限制严格的平台 |
Squarespace 和 Wix
代码区块或嵌入元素（部分套餐限制脚本，此时可用 iframe 模式）。
Webflow
Embed 元素，可放在页面上或房源的 CMS 模板中。
HighLevel 漏斗和网站
漏斗或网站构建器中的自定义 JS/HTML 元素。
IDX 网站
取决于您的供应商：很多允许在房源页面插入自定义 HTML（IDX，房源数据交换），有些只允许链接。
嵌入计算器会破坏我网站的设计吗？
不会。内嵌模式在 Shadow DOM 中渲染，这是一项能双向隔离样式的浏览器功能。您网站的 CSS 影响不到计算器，计算器的 CSS 也不会外泄。如果无法隔离，嵌入会自动改用 iframe。
按主题分类的问题
经纪人常问的问题
我需要懂代码吗？
不需要。复制代码，粘贴到建站平台的 HTML 或嵌入元素中即可。帮助中心 有各平台的分步指南。
如果我的建站平台不允许脚本怎么办？
使用大多数平台都接受的 iframe 模式，或使用在独立页面打开计算器的直接链接按钮。
能在邮件里使用计算器吗？
邮件客户端不运行脚本，所以请使用直接链接，或链接到计算器的按钮图片。计算器会在浏览器中打开，潜在客户照常获取。
能用在我的 IDX 供应商网站上吗？
取决于您的供应商是否允许在房源详情页使用自定义 HTML、脚本或 iframe。请查看供应商的设置或咨询其客服。不允许的话，直接链接在任何地方都能用。请参阅 IDX 网站。
嵌入代码有多重？
加载器很小，在您的内容之后异步加载；计算器只有在显示时才加载自身资源。每个页面请用一个小组件，而不是多个独立嵌入。
搜索引擎能看到嵌入的内容吗？
计算器是交互工具，并不打算让您的页面靠它获得排名。参与排名的是您自己的页面文案。高级配置可选用服务端渲染的内容。
嵌入内容支持无障碍访问吗？
计算器可用键盘操作，字段有标签，焦点清晰可见，结果对屏幕阅读器友好；弹窗可通过可见的关闭按钮或 Esc 键关闭。请参阅 无障碍嵌入。
弹窗会在手机上困住访客吗？
不会。弹窗和悬浮面板都有醒目的大号关闭按钮，在手机上全屏显示，关闭后焦点回到打开它的按钮。