预约小组件 — 将 Addagio 添加到您的网站

让客户直接在您自己的网站上预约。Addagio 小组件有两种模式:悬浮按钮以弹窗方式打开预约页面,或内嵌表单直接显示在您的页面中。

两步完成设置

1. 在 控制台 → 设置 的"预约网址"下找到您的 slug — 即 addagio.io/book/ 之后的部分。
2. 将代码片段粘贴到网站的 </body> 结束标签之前。

悬浮按钮 + 弹窗

您网站角落会显示"立即预约"按钮。点击后,预约页面在精美的浮层中打开 — 客户无需离开您的网站即可完成预约。

<script>
var addagioWidget = {
  slug: 'your-business-slug',
  buttonText: 'Book Now',
  color: '#C67B5C',
  position: 'right'
};
</script>
<script src="https://addagio.io/widget.js" async></script>

内嵌预约表单

完整的预约流程(服务、日历、结账)直接显示在您的页面布局中 — 类似 Calendly 的内嵌小组件。在需要显示表单的位置添加一个空 div 即可。

<div data-addagio-inline="your-business-slug">
  <a href="https://addagio.io/book/your-business-slug">Book online — Addagio</a>
</div>
<script src="https://addagio.io/widget.js" async></script>

内嵌框架会根据内容自动调整高度 — 没有滚动条,也没有固定高度。一个页面上可以放置多个表单。

完整技术参考(所有选项、JavaScript API、各平台指南) →

常见问题