复制一行 <script>,页面右上角就多出「AI 助手」:访客可就本页主题提问(走 freem.ai 智能路由 auto),也可提出开发需求;页脚前自动沉淀成 FAQ。样式隔离、可配置、开箱即用 —— 右上角的按钮就是它本人,点一下试试。
接入 freem.ai 智能路由,按问题自动选模型作答,带来源引用,保留多轮上下文。
访客描述想要的功能/页面/接口,进入 Freem Flow 队列;当前按「人工处理」跟进。
每个浏览器保留自己的多轮对话,可切换、可继续追问,无需登录。
问答自动汇成页脚前的 FAQ,最新若干条内联展示,「更多」跳独立分页页。
把下面这行放进页面(一般在 </body> 前即可),把 data-site 换成你的站点标识:
<script src="https://freem.ai/flow-widget.js" data-site="yoursite" defer></script>就这样。按钮会自动插到语言切换按钮(.navbtn)旁边,FAQ 会插到 <footer> 之前。需要微调时,加上下面的可选属性:
| 属性 | 默认 | 说明 |
|---|---|---|
data-site | 必填 | 站点标识(用于隔离会话与 FAQ),如 sport |
data-brand | 1 | 面板底部 Powered by freem 回链;默认显示,仅付费/特批站点可设 0(接入条款) |
data-features | qa,dev | 启用的功能:qa(问答)/ dev(开发),逗号分隔 |
data-anchor | .navbtn | 按钮插入位置(CSS 选择器,插在该元素前);找不到则右上角浮动 |
data-faq-before | footer | FAQ 区块插入在该元素之前;设为空则不插 |
data-faq | 1 | 是否显示页脚前的 FAQ 区块(0 关闭) |
data-faq-limit | 10 | FAQ 区块显示的最新问答条数 |
data-accent | #4F87ED | 主题色 |
data-lang | 跟随页面 | 强制语言 zh/en(默认跟随宿主 html.zh/.en 或 freem_lang) |
data-label | AI 助手 | 触发按钮文字 |
data-context | main,article,[data-flow-page],.wrap | 用于提取页面正文的 CSS 选择器;长文只生成一次概览并复用 |
data-api | 脚本同源 | 后端 API 根地址(默认取脚本 origin) |
在每个页面(或公共模板)的 </body> 前粘贴上面那行。多页站放进公共 footer 模板即可全站生效。
...
<script src="https://freem.ai/flow-widget.js" data-site="yoursite" defer></script>
</body>两种方式任选:① 用 WPCode 等「插入代码」插件,新建一条 Site-wide Footer 片段粘贴脚本;② 主题自带「页脚代码/Footer Scripts」设置的直接粘贴。避免改 footer.php(换主题会丢)。
在根 app/layout 里用 next/script,属性用 data-* 原样传:
import Script from "next/script";
export default function RootLayout({ children }) {
return (
<html>
<body>
{children}
<Script src="https://freem.ai/flow-widget.js"
data-site="yoursite" strategy="afterInteractive" />
</body>
</html>
);
}Pages Router 放 _app 或 _document 同理;客户端路由切页不需重载,组件挂载一次全站可用。
① 页面右上角出现「AI 助手」按钮(有 .navbtn 锚点时挨着它,没有则右上角浮动);② 点开随便问一句,能流式回答;③ 若开了 FAQ(data-faq 非 0),滚到页脚前能看到 FAQ 区。
常见坑:脚本被 CSP 拦(放行 freem.ai);data-site 忘改(会话会混进别站);SPA 手写路由把 DOM 整个替换掉(把脚本放在持久布局层)。
会话与问答存于 freem 侧数据库;token 消耗、回答/开发模型、最近互动与开发工单,统一在 flow 后台查看与配置。开发需求默认进人工队列,可在后台处理。
组件已在 rushos / freem 系 31+ 个站点长期运行(本页右上角按钮就是活的 demo)。当前对外接入为白名单制——AI 回答的 token 成本由 freem 承担,先控量保质量:留下站点与邮箱,开通你的 data-site 标识后邮件通知你。