STEP 1 · 产品说明

Step 1 产品说明

给 AI 助手读的纯文本版：product.md · llms.txt · llms-full.txt

Step 1 是面向外贸独立站的 AI + 真人实时客服。在网站里加一行代码，网页右下角就会出现聊天窗口：AI 依据你提供的知识库，随时回答海外访客关于运费、起订量、交期、退换、保修等问题；访客要报价、要找人，或 AI 没有把握时，对话会转给你的团队接手。出品方：Steplan（阶梯计划）。

官网：https://s1.steplan.io/
免费注册：https://s1.steplan.io/login?mode=signup
演示网站（装好 Step 1 的示例独立站）：https://s1.steplan.io/demo
帮助中心：https://s1.steplan.io/help/
联系：support@steplan.io

English summary. Step 1 by Steplan is a live chat widget with an AI agent for cross-border e-commerce (DTC) stores. One script tag adds it to any site (Shopify, WordPress, plain HTML, React/Vue, mobile WebView). The AI answers visitors from the merchant's own knowledge base (FAQs, web pages, PDF/DOCX files) in the visitor's language, and hands the conversation to a human when the visitor asks for a quote or a person, or when the AI isn't confident. One account manages up to 20 stores from a single inbox.

关键事实

项目	说明
产品类型	网站实时聊天组件 + AI 客服 + 团队收件箱
适合谁	外贸独立站、B2B 询盘型官网、跨境电商店铺
接入方式	在页面里加一行 `<script>`；也可以不装代码，直接分享"联系页面"链接
适用平台	任意 HTML 网站、Shopify、WordPress、React / Next.js、Vue / Nuxt、移动端 WebView
组件体积	约 17 KB（gzip），异步加载，无第三方依赖
样式隔离	组件渲染在 Shadow DOM 里，不会被网站主题样式弄乱，也不影响网站原有样式
访客界面语言	自动跟随访客浏览器，支持 18 种：英语、简体中文、繁体中文、日语、韩语、西班牙语、葡萄牙语、法语、德语、意大利语、荷兰语、俄语、阿拉伯语、土耳其语、越南语、泰语、印尼语、印地语
AI 模型	DeepSeek（默认）、OpenAI，或任意 OpenAI 兼容接口（如通义千问 DashScope、Moonshot 等）；使用你自己的 API Key
不配置模型时	仍可用：按知识库做关键词检索作答，不消耗 token
转人工	访客说出你设定的关键词、AI 判断需要人工、或知识库里没有足够相关的内容时，自动转给团队
多站点	一个账号最多管理 20 个独立站，每个站点的代码、外观、AI、知识库、收件箱相互独立
团队角色	所有者（Owner）、管理员（Admin）、客服（Agent）
登录方式	邮箱 + 密码，或 Google 账号（Google 账号登录后可再设置密码）
费用	可免费注册开始使用

核心卖点

AI 只用你的资料回答，不编答案。回答只来自你上传的 FAQ、产品页和 PDF。资料里没有的，转给真人，不拿不相关的内容凑。
拿不准就转真人，报价由你决定。访客要报价、要找人，或者 AI 没有把握时，立即转人工并邮件提醒你。
18 种语言接待海外访客。界面自动跟随访客的浏览器语言，AI 用访客的语言回复；你在中文后台管理。
一行代码接入任意独立站。Shopify、WordPress、任意 HTML 网站或 Google 跟踪代码管理器都能装；不改网站，也能分享聊天链接。
一个账号管理 20 个独立站。所有站点共用一个收件箱，哪个站有访客在等，一眼看清。
用自己的 AI 模型，成本看得见。接入 DeepSeek、OpenAI 或兼容接口，每条回复的 token 用量都有记录；不接模型也能按知识库作答。

一、访客看到什么

图 1　访客视角：独立站页面右下角的聊天组件（首屏）。

访客点击网页角落的按钮即可打开聊天窗口：

首屏：欢迎标题与欢迎语、在线状态（按营业时间自动显示在线或离线）、快捷联系方式（最多 8 个，可选 WhatsApp、Telegram、微信、X、Facebook、Instagram、LinkedIn、YouTube、邮箱、电话、网站）。
对话：访客提问后 AI 立即回复；转人工后由团队成员回复，访客在同一个窗口里继续聊。
开聊前表单（可选）：可以先收集称呼、邮箱、电话、留言，访客也可以跳过。

图 2　开聊前收集访客联系方式（可选，可跳过）。

二、工作方式：AI 接待，真人成交

AI 先回答：AI 只依据你的知识库回答运费、起订量、交期等常见问题，并用访客的语言回复。
需要时转人工：以下任一情况会把对话交给团队，并按设置发邮件提醒：
- 访客的话里包含你设定的转人工关键词（如"报价""找人工"），这一步不经过模型；
- AI 判断问题需要知识库之外的信息（如价格例外、具体订单）；
- 知识库里没有足够相关的内容——宁可转人，也不拿不相关的段落凑答案。
真人接着成交：真人接管期间 AI 保持安静，不会抢话；真人最后一条消息后 30 分钟无人回复，AI 自动接回，也可以在收件箱里一键"恢复 AI"。

可靠性：如果模型服务出错（Key 失效、限流、服务中断），会自动退回知识库关键词检索作答，访客不会一直等一个转圈。

AI 何时值班：可选"始终"或"仅离线时"（团队不在线时才由 AI 回复）；并可分别设置组件和联系页面里是否由 AI 回复。

三、收件箱

Step 1 控制台的收件箱：左侧是对话列表，可按"全部 / AI 已处理 / 人工相关"筛选并搜索；中间是选中的对话，访客问"How long does shipping take?"，AI 回答"Standard delivery is 3–5 business days in the EU and US, 7–12 business days elsewhere. Express options appear at checkout."；右侧是访客详情，显示对话次数、发过的消息数、来源页面、首次和最近访问时间、访客 ID 和备注。

图 3　收件箱：对话列表、对话内容、访客详情。

按"全部 / AI 已处理 / 人工相关"筛选，按访客或消息内容搜索；
访客详情：来源页面、对话次数、首次与最近访问时间，可写备注；
每段对话标注来源渠道（网页组件或联系页面）；
可手动转人工、恢复 AI、标记已解决或重新打开；
多个独立站的待人工数量显示在站点切换器上；控制台也可以在手机浏览器打开，随时回复。

四、AI Agent 设置

AI Agent 设置页：顶部提示"对于已转人工的会话，AI 会在最后一条消息后的 30 分钟恢复"；左侧可开关 AI Agent，选择渠道（网页组件、联系页）和支持时间（始终、离线时），下方设置机器人的头像、名称"Acme Outdoor 智能客服"和欢迎语；右侧是对话预览，机器人用欢迎语打招呼。

图 4　AI Agent：渠道、值班时间、机器人名称与欢迎语，右侧实时预览。

服务商与模型：DeepSeek（默认）、OpenAI、任意 OpenAI 兼容接口；也可以不接模型，只用知识库检索。
行为：系统提示词、温度、回答长度。
测试：先验证连接，再拿一个真实问题走完整流程看效果。
安全：API Key 用 AES-256-GCM 加密后存储，浏览器里只显示掩码（如 sk-••••••••cdef），客服角色看不到 Key。

五、知识库

知识库页面：分为"常见问题、网址、文件"三个标签，当前是常见问题，已有 3/50 条，例如"How long does shipping take?""What is your return policy?""Do you offer wholesale pricing?"，每条显示答案摘要和"已索引"状态；下方"试一试"可以输入问题测试 AI 会怎么回答。

图 5　知识库：常见问题、网址、文件，以及"试一试"。

几种方式添加内容，AI 都会从中检索答案：

方式	说明	每个站点上限
从独立站导入	填写网站域名，自动从站点地图（或首页链接）找出页面，运费、退换货、常见问题、关于与联系等页面默认勾选，确认后批量导入	计入网址的 100 个
Shopify 商品同步	从店铺公开的商品数据读取标题、规格、标价、库存和描述；再次同步会更新改价、移除已下架的商品	50 个商品，不占网址名额
常见问题（FAQ）	一问一答	50 条
网址导入	抓取单个网页正文（自动去掉导航、页脚等），可随时重新同步	100 个
文件上传	PDF、DOCX、TXT、MD、CSV、JSON、HTML，单个最大 10 MB	20 个（含粘贴的文本）
粘贴文本	直接粘贴产品说明、政策等	同上

导入前可以先预览抓取结果。抓取失败会给出原因（如 404、需要登录、页面是纯前端渲染抓不到文字等）。从独立站导入只会抓取你自己域名下的页面；促销、优惠券、测试类页面不会默认勾选。

六、网页小组件外观

图 6　组件外观设置，右侧实时预览，保存后立即生效，无需改代码。

外观：主题色（文字颜色自动调整以保证可读）、按钮样式（圆形图标 / 带文字胶囊）、按钮文案与图标、位置（左下 / 右下）、底部间距、自动展开、品牌 Logo 与名称。
首屏：欢迎标题、欢迎语、快捷联系方式、在线时间（按时区设置每周排班，支持跨夜班次）。
对话界面：客服名称、输入框提示文字、开聊前收集的访客信息。

七、联系页面（不装代码也能用）

联系页面设置：左侧可启用联系页面、填写页面标题和副标题，并从"经典、分屏、刊物、夜幕、海报"五种页面风格中选择；右侧预览一个独立的聊天页面，顶部写着"欢迎来到 Acme Outdoor"、在线状态和"全天候在线"，下方是"开始之前"联系方式表单。

图 7　联系页面：一个可直接分享的独立聊天页。

每个站点自带一个独立的全屏聊天页面（/contact/?key=…），可以放进社媒简介、邮件签名、名片二维码。提供 5 种风格：经典（通用）、分屏（企业官网 / B2B）、刊物（精品独立站）、夜幕（科技 / SaaS）、海报（活动 / 零售），自动沿用组件的品牌色和 Logo。

八、安装接入

安装接入页面：可选"交给 AI 助手"或"手动粘贴代码"。"交给 AI 助手"会生成一段提示词，复制给 Cursor、Claude Code、Copilot 等编程助手即可自动完成接入；下方显示安装检测状态、站点公开密钥和高级参数（autoShow=false、position=left、window.contactWidget 接口）。

图 8　安装接入：复制提示词交给 AI 编程助手，或手动粘贴一行代码。

<script src="https://s1.steplan.io/step1.js?key=pk_live_你的密钥" async></script>

放在网页 </body> 之前即可；控制台提供 HTML、WordPress、Shopify、React / Next.js、Vue / Nuxt、移动端 WebView 的分步指南。
安装检测：组件在你的网站上加载后，控制台会显示"已检测到"及检测到的域名；如果和你填写的域名不一致会提醒。
可选参数：autoShow=false（不自动弹出）、position=left（放在左下角）。
JavaScript 接口：window.contactWidget.show()、hide()、toggle()、showChat()、applySettings({...})、on('message', fn)。

没有网站源代码也能接入

接入不需要拿到网站的源代码。按你手上有的权限选一种：

你有什么	用哪种方式	访客看到的效果
建站平台的后台账号	方式 1：在后台粘贴代码	网页角落的聊天窗口
网站已装 Google 跟踪代码管理器（GTM）	方式 2：用 GTM 添加	网页角落的聊天窗口
什么都改不了	方式 3：只用联系页面链接	点链接打开一个独立的聊天页

方式 1：在建站平台后台粘贴代码

只需要后台账号，不需要源代码：

Shopify：后台进入「在线商店 → 主题 → 编辑代码」，打开 layout/theme.liquid，把代码粘贴到 </body> 之前并保存。建议先在主题副本上测试。
WordPress：安装并启用「WPCode」（原名 Insert Headers and Footers）插件，把代码粘贴到 Footer 区域并保存，无需改主题文件。
其他 SaaS 建站平台：大多数平台在后台设置里提供「自定义代码」「第三方代码」或「Code Injection」之类的位置，把代码贴到页脚（Footer / Body 末尾）即可。菜单名称以各平台为准。

方式 2：用 Google 跟踪代码管理器（GTM）

如果网站已经装了 GTM（投放广告的独立站常见），不用改网站就能加。要用到的代码：

<script src="https://s1.steplan.io/step1.js?key=pk_live_你的密钥" async></script>

在 GTM 工作区新建「代码」，类型选「自定义 HTML」，把上面这行粘贴进去；
触发条件选「所有网页（All Pages）」；
保存后点「提交」并「发布」，刷新网站即可看到聊天按钮。

组件会从自己的 script 标签上读取密钥，所以由 GTM 在页面加载后动态插入也能正常工作。注意：GTM 会被部分广告拦截插件屏蔽，这些访客将看不到聊天窗口；对覆盖率要求高时优先用方式 1。

方式 3：不装代码，只用联系页面链接

每个独立站自带一个可直接分享的聊天页面（见第七节），链接在控制台「联系页面」里，格式为 https://s1.steplan.io/contact/?key=pk_live_你的密钥。AI 接待、转人工、收件箱都和组件一样工作。可以放在：

网站导航菜单或按钮的链接上（建站后台添加链接一般不需要改代码）；
社媒主页简介、邮件签名、WhatsApp 自动回复；
广告落地链接、名片或展会物料上的二维码。

区别在于访客会进入一个独立页面聊天，而不是在当前网页的角落打开窗口；控制台也不会显示"已在你的网站检测到"。

网站由别人维护？ 把控制台「安装接入」里的那一行代码发给对方即可；也可以把页面上生成的提示词交给对方的 AI 编程助手（如 Cursor、Claude Code）代为接入。

九、多个独立站

独立站管理页面：标题"一个账号，管理多个独立站的客服"，说明每个独立站拥有独立的嵌入代码、小组件外观、AI 设置、知识库、集成和收件箱，互不影响；右上角"添加独立站"按钮；列表中有"Acme Outdoor"，标注当前站点和域名 example-store.com。

图 9　一个账号管理多个独立站。

一个账号最多 20 个独立站，用左上角的切换器切换，每个站点的待人工数量一目了然。
新建站点时可以复制已有站点的外观、开聊前表单、营业时间和转人工规则，也可选择复制 AI 设置；知识库和对话不会被复制。
删除站点需要输入站点名称确认，会同时删除该站点的对话、知识库和 AI 设置。

十、团队与权限

团队成员页面：显示成员列表与角色（Owner），"邀请成员"表单可填写邮箱并选择 Admin 或 Agent 角色，下方是各角色权限说明。

图 10　团队成员与角色。

角色	权限
所有者 Owner	全部权限，包括计费和转让所有权；每个工作区一位
管理员 Admin	管理站点、组件外观、AI 设置与 Key、知识库、邀请成员
客服 Agent	回复对话、添加知识库内容；不能改设置，看不到 API Key

邀请通过链接加入，7 天内有效，每个链接只能用一次。

十一、通知与集成

集成页面：Webhook 设置，包括接收地址、订阅事件（新会话 conversation.created、新消息 message.created、转人工 conversation.handoff）、签名密钥和发送测试；下方"平台接入指南"列出原生 HTML、WordPress、Shopify、React / Next.js 等。

图 11　Webhook 与平台接入指南。

浏览器通知：有访客消息时桌面弹窗提醒，点击直达对话；可选只提醒需要人工的对话。控制台页面需保持打开（可在后台标签页）。
邮件提醒：对话转人工、或没有 AI 接待时，给指定成员发邮件；同一对话 10 分钟内最多一封。
Webhook：新会话、新消息、转人工三类事件实时推送到你的系统（如 CRM）；请求带 x-step1-signature（HMAC-SHA256）签名，只允许公网地址。

十二、用量统计

按今天、昨天、近 7 / 14 / 30 天或自定义日期（最长 90 天）查看：AI 回复数、转人工数、响应时间中位数、输入与输出 token，以及按服务商和模型分组的用量。由知识库检索直接回答的对话单独统计，不消耗 token。

常见问题

需要会写代码吗？ 不需要。复制一行代码贴到网站模板里即可；也可以把控制台生成的提示词交给 AI 编程助手代为接入。不想改网站的话，可以只用"联系页面"链接。

没有网站源代码，能接入吗？ 能。有建站平台后台账号的，在后台的主题或"自定义代码"设置里粘贴代码；网站装了 Google 跟踪代码管理器（GTM）的，新建一个"自定义 HTML"代码即可；什么都改不了的，直接分享"联系页面"链接。详见第八节"没有网站源代码也能接入"。

支持 WhatsApp、Instagram 或邮件吗？ 目前专注网站聊天：网页角落的聊天窗口，以及可以分享的"联系页面"链接。暂不接入 WhatsApp、Instagram、Facebook 和邮件，也暂不能读取 Shopify 订单状态。

会拖慢网站吗？ 组件约 17 KB（gzip），异步加载，不阻塞页面渲染。

AI 会乱回答吗？ AI 只依据你的知识库回答；知识库里没有足够相关的内容时，它会如实说明并转给真人，而不是编造答案。

海外访客说不同语言怎么办？ 界面文字自动跟随访客浏览器语言（18 种）；AI 用访客的语言回复。

团队下班了怎么办？ 可以设置营业时间，让 AI 只在下班后值守；访客留言会出现在收件箱，并可邮件提醒。

可以用自己的模型吗？ 可以。支持 DeepSeek、OpenAI 和任意 OpenAI 兼容接口，用你自己的 API Key，Key 加密存储。

有多个独立站可以一起管吗？ 可以，一个账号最多 20 个，共用一个收件箱，每个站点设置相互独立。

怎么开始？ 在 https://s1.steplan.io/login?mode=signup 免费注册，创建工作区后到"安装接入"复制代码；先想看效果可以打开演示网站 https://s1.steplan.io/demo 。

本文档描述 Step 1 当前已上线的功能，截图来自产品控制台（示例品牌为 Acme Outdoor）。最后更新：2026-11-08。