为您的网站添加订座组件

该用哪种样式？

内嵌最适合有“预订”页面或首页有空余区块的情况。表单就在页面里，会随着顾客填写自动调整大小，看起来就像您网站的一部分。按钮最适合不想改动布局的情况：它在您粘贴脚本的位置放一个按钮，表单在页面上方弹出。Iframe适用于会过滤脚本但允许嵌入的建站工具。链接适用于其他所有情况。

这四种方式都指向同一个订座页面，所以顾客无论从哪里进来，体验都完全一样。您可以同时使用几种，例如在预订页面内嵌，并在页眉放一个按钮。

背后的运作原理

脚本会创建一个 iframe，以嵌入模式指向您的订座页面，嵌入模式会隐藏页眉和页脚，并使用透明背景。订座页面会在顾客填写过程中告诉父页面它的高度，所以不会出现滚动条套滚动条。您页面上的其他内容完全不受影响。脚本不到 4KB，在您的内容之后加载，不会在您的网站上设置 cookie。

因为表单运行在 tablez.uk 上，您无需在自己的网站上处理顾客数据，我们改进订座页面时您也不用更新任何东西。您的嵌入代码永远不变。

能用在我的建站工具上吗？

可以，只要它允许您粘贴 HTML。几乎所有网站都可以：

• WordPress：粘贴到自定义 HTML 区块。无需插件。
• Squarespace：任何页面上的代码块。
• Wix：嵌入 HTML 元素，或者链接到您页面的按钮。
• Shopify：自定义 Liquid 区块，或 HTML 视图中的页面。
• Webflow、GoDaddy、Weebly、Jimdo、Carrd、Framer：使用它们的嵌入或 HTML 元素。
• 多年前别人做的纯 HTML：粘贴到文本编辑器里再上传。

Google Sites 和一些免费建站工具会过滤脚本。在那里请使用 iframe 或链接。

让它看起来像您的

在 Tablez 后台设置主题色并上传标志，嵌入的表单会使用它们。除此之外订座页面自带的样式很少，因此在浅色和深色网站上都很协调。如果您想让“预订餐桌”按钮和您网站自己的按钮完全一致，请不要用生成的按钮，而是在您自己的某个按钮上使用 tablez-open 类。

手机

表单优先为手机设计，因为大多数预订发生在手机上。内嵌时，它占满手机屏幕的宽度。按钮浮层在手机上铺满屏幕，在电脑上则显示在居中的面板里。添加后请用自己的手机测试；在线演示会展示预期效果。