很多 Shopify 店铺的 FAQ 是后来加上的:装一个评价 App、接一个问答工具,或者在主题里放一个 FAQ block。浏览器里看起来正常,但 AI 搜索回答时仍然漏掉成分、尺寸、兼容型号或授权规则。
先给结论:FAQ 折叠本身不是问题,答案是不是在可访问的页面内容里,才是问题。先做 4 个测试:原始 HTML 里有没有答案、页面渲染后的 DOM 里有没有答案、不点击和不滚动时会不会出现答案、页面正文和结构化数据是否说同一件事。测试结果比“这个 App 宣称支持 SEO”更值得参考。
背景解释:App block、JavaScript 和初始 HTML 不是一回事
Google Search 处理 JavaScript 大致会经历抓取、渲染和索引三个阶段。Google 可以渲染很多 JavaScript 页面,但渲染需要排队,而且不是所有机器人都能执行 JavaScript。一个页面在浏览器里能显示,不等于每个搜索或 AI 系统都会按同样方式看到它。
Shopify 的 Theme app extensions 可以把动态元素放进 Online Store 2.0 主题,App block 由主题编辑器控制位置,App embed 则通常负责全局或非固定位置的功能。真正需要检查的不是“用了 App 还是没用 App”,而是这个 App 最终输出了什么:服务器直接输出的 HTML、页面加载后注入的 DOM、点击后才请求的接口,还是 iframe 里的内容。
Google 针对 AI features 的公开要求仍然是基础搜索要求:页面要能被抓取和索引,重要内容要有文本形式,结构化数据要和页面可见文本一致。Google 没有要求另加一套“AI 专用 FAQ 标记”。所以这篇文章把“AI 能不能看到”拆成页面可验证的技术条件,不把一次回答当成平台保证。
实测记录:同一答案的 4 种加载方式
下面用同一个测试问题做最小对照:“敏感肌能用吗?”假设答案是“含神经酰胺,先做局部测试”。测试日期为 2026 年 9 月 9 日,先看原始 HTML,再看浏览器渲染后的 DOM;这组记录用于判断内容位置,不代表 Google、ChatGPT、Perplexity 或 Bing 会给出相同结果。
| 方式 | 原始 HTML | 渲染 DOM | 判断 |
|---|---|---|---|
| 原生 details | 有答案 | 有答案 | 可作为核心内容 |
| 首屏脚本注入 | 没有答案 | 渲染后出现 | 要做渲染检查 |
| 点击后加载 | 没有答案 | 点击前没有 | 核心信息有风险 |
| 图片或 CSS | 不算正文 | 不算正文 | 只能做辅助说明 |
怎么读这张表
原生 <details> 的答案即使默认折叠,也仍然存在于页面 HTML 中,用户可以点击展开阅读。它通常比“点击按钮后才向接口请求答案”更容易稳定检查。首屏脚本注入不一定不能被 Google 处理,但你需要用渲染后的 HTML 确认内容真的出现,而且不能假设其他 AI 机器人有同样的 JavaScript 执行能力。
图片里的“敏感肌可用”、CSS 的 ::before 文案、评价 App 的 iframe 以及只在聊天窗口中出现的回答,都不应该承担商品页唯一的事实说明。图片和互动组件可以增强体验,核心答案仍应放在可读文本里。
具体例子/案例说明
下面 4 个例子都按同一条线看:原始问题 -> 判断过程 -> 改法 -> Shopify 落点。
| 类目 | 原始问题 | 判断重点 | Shopify 落点 |
|---|---|---|---|
| 美妆 | 成分 FAQ 点开后才出现 | 答案是否在商品页 HTML | 描述、metafield、FAQ block |
| 服装 | 尺码表只在弹窗中加载 | 无点击时是否有尺码摘要 | 商品页、尺码页、内链 |
| 家居小电 | 兼容型号藏在聊天组件 | 型号事实是否进入正文 | 规格表、FAQ、App block |
| 数字产品 | 授权条款只在账户内显示 | 公开购买问题有没有答案 | 产品页、政策页、版本页 |
例子 1:美妆商品的成分 FAQ 只在 App 点击后出现
原始问题:护肤品页面首图写着“无香精、含神经酰胺”,商品描述只有“舒缓精华 30ml”。成分 App 在用户点击“查看完整问答”后才请求答案。AI 搜索回答时只知道它是一瓶精华,却说不清核心成分和使用边界。
判断过程:先用查看源代码搜索“神经酰胺”,再在页面加载完成后用 Elements 面板或 document.body.innerText 搜索。如果源代码没有、渲染后有,说明答案依赖脚本;如果不点击时也没有,说明答案依赖用户交互。最后检查 Product 结构化数据的 description 是否至少包含不容易变化的核心事实。
改法:把“核心成分、适用肤质、使用限制”放进商品描述或 product metafields,并在商品页输出一段简短 FAQ。App 可以继续提供更长的问答和评价,但不要让它成为唯一事实来源。
Shopify 落点:Products 的描述、Custom data 中的 product metafields、商品页主题 block、FAQ App block,以及 Product JSON-LD。
例子 2:服装店的尺码表只在弹窗打开后加载
原始问题:用户在商品页看到“修身版型”,点击“尺码建议”后才从 /apps/size-guide 请求身高体重和胸围对照。AI 搜索被问到“这条裤子适合 160 厘米的人吗”,页面没有稳定的尺寸事实可以引用。
判断过程:不点击弹窗,检查商品页是否至少写出尺码范围、版型和测量方式;再打开弹窗,看内容是同一页面 DOM,还是 iframe 或外部 URL。若只有弹窗里的完整表格,页面主体缺少可理解的摘要,用户和搜索系统都要先猜这个入口是什么。
改法:商品页首屏或规格区放 2-3 句尺码摘要,链接到稳定的 /pages/size-guide。完整尺码表可以继续由 App 提供,但商品页要明确说明测量位置、尺码范围和退换货边界。
Shopify 落点:商品页 description、size metafield、主题里的尺寸 block、Pages 中的尺码指南、商品页到尺码页的内链。
例子 3:家居小电的兼容型号只在聊天组件里回答
原始问题:一个桌面风扇配件页面没有列兼容型号,客服聊天组件在用户输入“适合 X100 吗”后才返回答案。AI 搜索看到的只是“通用配件”,无法判断具体型号是否匹配。
判断过程:查看页面源代码和渲染 DOM,确认兼容型号有没有出现在商品描述、规格表或 FAQ。再检查聊天组件是不是 iframe;如果答案只存在 iframe 或接口响应里,不能把它当成公开页面的稳定文本。还要核对变体、SKU 和兼容型号有没有互相矛盾。
改法:在商品页加一张简短兼容表,至少列“支持型号、不支持型号、安装限制”。聊天组件可以负责复杂的售前追问,但不能替代公开规格。
Shopify 落点:product metafields、规格表主题 block、FAQ、相关配件集合页,以及 App block 的位置和加载脚本。
例子 4:数字产品的授权条款只对已购买用户开放
原始问题:一个数字模板店把授权范围放在账户下载页,商品页只写“商业使用友好”。用户问“能不能给客户项目使用”,AI 搜索只能看到模糊的营销表达,无法给出准确边界。
判断过程:把购买前问题和购买后私有信息分开。下载链接、订单信息和个人账户内容应该保持私有;授权范围、可否转售、团队席位和软件兼容性则属于购买前事实,应检查公开页面是否能直接访问。
改法:在商品页公开写授权摘要,并链接到稳定的授权政策页;版本更新时同步修改商品页、FAQ 和政策页。账户内仍然可以保留完整下载说明,但不要让购买前必须知道的规则只存在登录后页面。
Shopify 落点:数字产品商品页、License policy 页面、版本说明博客、FAQ、导航菜单和主题中的下载 App block。
实战方法:4 个测试把问题定位到页面
选 3 个最重要的 FAQ:一个商品事实、一个适用边界、一个购买前政策。每个问题用同一组测试,记录 URL、测试日期、答案所在位置和改动后的复测结果。
测试 1:查看源代码,确认答案有没有进入原始 HTML
在浏览器中打开页面源代码,搜索完整答案里的一个独特短语,例如“神经酰胺”或“支持 X100”。也可以用终端请求公开 URL 后搜索文本。注意不要只搜页面标题,标题常常存在,但真正的 FAQ 答案可能没有。
- 能搜到:答案至少在服务器响应或初始页面里。
- 搜不到:记录为“依赖脚本、接口、iframe 或图片”,继续做第二个测试。
测试 2:查看渲染后的 DOM,确认脚本有没有稳定输出
页面加载完成后,在开发者工具 Elements 面板搜索答案;也可以在 Console 中运行 document.body.innerText.includes('答案短语')。对 Google 的页面检查,用 Search Console 的 URL Inspection 查看 Googlebot 收到的渲染 HTML。Google 官方也建议用 URL Inspection 或 Rich Results Test 确认渲染后的内容。
如果浏览器 DOM 有答案,但 Search Console 的渲染 HTML 没有,先查脚本报错、资源阻塞、robots 规则、接口权限和加载时机。不要根据自己的登录状态或本地缓存判断公开页面。
测试 3:不点击、不滚动,观察答案是不是依赖用户动作
用无痕窗口重新打开页面,不点击 FAQ、不打开弹窗、不滚动到底部,观察核心答案是否已经出现。Google 的懒加载文档强调,重要内容应在进入视口时自动加载,不应依赖滚动或点击;Google Search 不会像用户一样主动点击页面控件。
如果内容只在点击后请求,改法通常不是把所有互动都删掉,而是把最重要的事实提前放到页面文本里。完整表格、评价筛选和复杂问答仍可以保留互动形式。
测试 4:对照页面正文、metafield 和结构化数据
把同一个事实在商品描述、FAQ、metafield、Product JSON-LD、政策页和 App 输出里列成一行对照。例如“适合敏感肌”不能在商品页写成确定结论,FAQ 又写“先做局部测试”,结构化数据还留着旧描述。页面能被读取,不代表读取到的是正确版本。
| 记录项 | 示例 | 通过标准 |
|---|---|---|
| 问题 | 敏感肌能用吗? | 问题来自真实购买场景 |
| 答案位置 | 商品页 FAQ + metafield | 公开页面可访问 |
| 源码 / DOM | 源码有,DOM 有 | 不依赖点击才出现 |
| 一致性 | 描述、FAQ、JSON-LD 同口径 | 没有旧事实冲突 |
| 复测 | 固定问题,7 天后再测 | 记录引用 URL 和错误点 |
Shopify 页面怎么改:把核心答案留在可读文本里
测试完成后,按答案的重要程度分层。商品名称、规格、适用边界、兼容型号、授权范围、配送和退货规则属于核心事实;评论排序、推荐问题、筛选器和聊天问答属于增强功能。前一组应该优先进入页面文本,后一组可以继续使用 App。
商品页:首段和规格区先回答购买前问题
商品页首段不要只写形容词。先说明品类、适用场景、关键规格和限制,再用 FAQ 补充用户会追问的条件。美妆可以放成分和肤质边界,服装可以放版型和尺码摘要,家居小电可以放兼容型号,数字产品可以放版本和授权摘要。
如果这些字段已经放在 metafield 里,要确认主题动态源真的把它们输出到前台。只存在后台字段里的内容,不能替代公开页面的可读说明。
FAQ 页:用原生结构承载可访问答案
一个简单的原生写法如下。答案默认折叠,但仍在 HTML 中,用户可以展开阅读:
<details>
<summary>敏感肌能用吗?</summary>
<div class="faq-answer">
含神经酰胺,先做局部测试。
</div>
</details>
不要把答案写进 CSS 伪元素、图片文字或点击后才创建的空容器。若使用 FAQ App,先确认它输出的是页面 HTML 还是 iframe;如果是 App block,也要在商品页预览、源代码和渲染 DOM 中分别检查。
主题和 App:分别检查 App block、App embed 和脚本
App block 适合放在商品详情、文章正文或 FAQ 区域,位置由主题编辑器控制;App embed 更适合全局脚本、浮层或跨页面功能。两者都不自动保证内容适合抓取。打开主题编辑器,记录 App 的位置;再在浏览器网络面板看它是否请求外部接口、是否进入 iframe、是否在点击后才发请求。
如果主题支持 @app 区块,不要因此把所有页面事实交给 App。先在主题中保留一段稳定的 Liquid 或商品描述文本,再把 App 当作补充。核心问题是页面输出结果,不是编辑器里看起来有一个区块。
结构化数据:保持同一事实,不要为了 AI 硬加 Schema
Google 说明,AI features 没有额外的特殊结构化数据要求;如果使用结构化数据,内容应该和页面可见文字一致。商品页的 Product JSON-LD 适合描述商品名称、品牌、图片、价格和可买状态,但不应该把页面没有展示的 FAQ 或夸大的效果承诺塞进去。
FAQPage 也不是“加了就更容易被 AI 引用”的开关。商业店铺先把可访问文本、页面结构和事实一致性做好,再根据 Google 当前结构化数据指南判断是否有实际适用场景。
可复制的 FAQ 渲染检查清单
- 核心问题是否在公开商品页或 FAQ 页中直接可访问。
- 查看源代码时,至少能找到答案中的一个独特短语。
- 页面加载后,答案是否出现在渲染 DOM,而不是只存在接口响应或 iframe。
- 不点击、不滚动时,核心答案是否已经出现或能通过稳定内链访问。
- 商品描述、metafield、FAQ、政策页和结构化数据是否同一口径。
- 改动后是否用 Google URL Inspection 和固定 AI 搜索问题分别复测。
常见误区
- 误区 1:看到浏览器能展开,就认为所有 AI 都能读取。浏览器、Googlebot 和不同 AI 工具的执行环境并不相同。
- 误区 2:把“用了 JavaScript”直接当成不能收录。Google 可以渲染 JavaScript,真正要查的是渲染结果、加载时机和其他机器人是否能处理。
- 误区 3:为了测试而立刻卸载所有 App。先看 App 输出 HTML、DOM、iframe 还是点击接口,再决定保留、改位置或补一段正文。
- 误区 4:把 FAQ 全部复制进 JSON-LD。结构化数据必须与页面可见内容一致,也不能替代正文。
- 误区 5:只测问题有没有答案,不记录答案是否过期。FAQ 的价格、兼容型号、配方、库存和授权范围都要和当前商品事实同步。
FAQ
Shopify FAQ 用 details 折叠,AI 搜索还能看到吗?
折叠本身不一定有问题。只要答案存在于可访问的页面内容中,用户可以展开阅读,就比点击后才请求答案更容易检查。仍然要用源代码、渲染 DOM 和 Search Console URL Inspection 做验证。
Shopify App block 是不是一定不能被 AI 搜索读取?
不是。App block 可能输出正常的 HTML,也可能依赖 JavaScript、外部接口或 iframe。不要按 App 名称判断,直接检查公开页面的原始 HTML、渲染 DOM、网络请求和点击前状态。
Google 能执行 JavaScript,为什么还建议把核心答案放进 HTML?
Google 会渲染很多 JavaScript 页面,但渲染有排队和资源条件,而且其他机器人不一定使用同样的执行环境。把核心事实放进稳定页面文本,可以减少对加载时机和机器人能力的依赖。
没有 Search Console,怎么先做 FAQ 渲染测试?
先查看源代码,再用开发者工具 Elements 搜索答案,最后用无痕窗口测试不点击、不滚动时的状态。你可以先记录结果,之后再用 Search Console URL Inspection 检查 Googlebot 的渲染 HTML。
FAQ 一定要加 FAQPage 结构化数据吗?
不一定。Google 的 AI features 没有要求额外的 AI 专用 Schema,结构化数据也必须和可见内容一致。商业店铺优先保证 FAQ 文本可访问、事实准确,再根据当前 Google 指南判断是否适合使用 FAQPage。
ChatGPT Search、Perplexity 和 Google 会看到同样的 FAQ 吗?
不能假设一样。它们的抓取、索引、检索和引用方式不同。用固定问题分别记录是否找到页面、引用了哪个 URL、回答遗漏了什么,再把问题回溯到商品页、FAQ、主题和 App 的实际输出。