一个插件没装、一行文件没改,靠主题设置、分类描述与自定义 CSS 完成 WooCommerce 子分类导航。完整过程:AI 建议错在哪三个前提、五步怎么走、真机怎么验证、最后书面留下哪三件遗留。

本文目录

改完了。一个插件没装,服务器上的文件一行没改。

这家店的分类导航,最后是靠后台里本来就有的三样东西做成的:主题设置、分类描述、自定义 CSS。

下面是整个过程,包括我们自己踩的坑和顺手记下的遗留问题。

这个客户是什么情况

项目 实际情况
客户 做 B2B 设备的卖家,用产品目录卖货(已获同意发布,未具名)
系统 WordPress + WooCommerce,商业主题跑在子主题上
主机 托管型主机,服务器层面禁用了插件安装和文件编辑
他想要什么 分类页上的子分类导航,桌面端和手机端都要能用
最后怎么做的 先修好被改乱的手机菜单;用主题设置 + 分类描述 + 自定义 CSS 做出标签导航

他以为只是「把三行字做成按钮」

改动前,那三个子分类是手写的纯文本链接——一行一个,没有样式,看不出你当前在哪个分类。其中一个链接的地址是空的,看着是链接,点下去哪也去不了。

改动前的 WooCommerce 分类页:三个子分类是手写的纯文本链接,没有样式
图 1|三个子分类原本是手写的纯文本链接。没有样式,也看不出当前在哪个分类。

他自己先用通用 AI 问过,也照着在后台里改了。改完桌面端看着正常。但手机端的菜单乱了:两个新分类链接飘到了顶级,几个原来的菜单项干脆不见了。

原因很具体:这套主题里,桌面菜单和手机菜单是两个独立的菜单。改一个,另一个不会跟着动。AI 不知道他这个站是这样。

店铺一直在卖货,改的时候不能停。

AI 给的答案错在哪

不是步骤错。菜单的操作步骤是对的,备份建议也对,自定义 CSS 该放在哪也对。

错在三个前提:

答案默认你能做的事 这台主机上的实际情况
装个插件解决 服务器层面禁用,安装界面直接拒绝
改主题文件 主题文件编辑器已被移除
分类描述里写的标记能留存 保存时会被过滤,容器和类名都被剥掉

前提不成立,步骤再对也没用。客户自己改坏,不是因为 AI 说错了步骤,是因为那些步骤的前提在这台主机上不成立。

我们是怎么做的

第一步:先修,再建。

先把手机菜单恢复原样,四个顶级分类放回商店入口下面,两个菜单都检查一遍。坏的菜单比不好看的页面要紧。

第二步:先看系统本来就有什么。

清空分类描述之后发现,WooCommerce 自己就能把这三个子分类渲染成图片卡片。缩略图早就传上去了,只是从来没人用过。这一步零成本、不写代码,还给了客户一个对比的基准。

第三步:客户要的风格优先。

客户看过卡片效果,还是想要标签条。那就用主题设置关掉图片卡片,再用主机唯一允许的方式做标签。链接写在分类描述里,样式写在自定义 CSS 里。

标签条也不是一次就定下来的。中途画过三个备选,一个都没用:

  • 居中链接条,用下划线标出当前分类
  • 手机上做成单行横向滑动
  • 当前分类直接填纯黑

三个方案在纸上都成立,一到这台站就不成立。站点本身就是黑白配色。药丸按钮在 375 像素屏上怎么表现,不实测就预判不了。客户自己在几个看起来都行的方案里也有偏好。

被否掉的原因,才是这段里真正的判断。

被否掉的三个备选方案示意图:起点与三个最终没用的方向
图 2|项目过程中画过、最终没用的方案(据工作记录重绘,非站点截图)。左边是起点,右边三个备选各因这台站的具体情况被搁置,不是因为做得不好。

第四步:绕开过滤器,而不是硬碰。

保存时容器和类名会被剥掉,那就只写裸链接。CSS 不去匹配那些会被删掉的类名,改成针对 WordPress 自己输出的稳定结构。当前分类的高亮,用 WooCommerce 给页面加的分类标识——这个不会被过滤掉。

问题的源头就在这个字段里。原来的第一行写的是 href=" "——地址留了一个空格。浏览器照样把它渲染成链接,点下去哪也去不了。

分类描述字段里手写的链接,第一行地址是一个空格
图 3|分类描述字段里手写的那一行链接。第一个的地址是一个空格,看着能点,点下去是空的。

第五步:三轮调优,每轮都在真机上看。

先是桌面端居中标签。再改成跟站点黑白配色一致的药丸按钮。最后发现药丸按钮在窄屏会溢出,改成换行。每一轮都在真实手机(375px 宽)上看过,才进下一轮。

改完是什么样

  • 桌面端:面包屑下面三个药丸按钮,一眼看得清、点得到。
  • 手机端:按钮换行成两排,不再溢出,每一项都点得到。
  • 顺手清掉了那个空链接。
桌面端成品:面包屑下方三个分类按钮
图 4|桌面端:同一个面包屑、同一个分类页,原来的纯文本一行换成了三个按钮。
手机端成品(375px):分类按钮换行成两排,不溢出
图 5|手机端 375 像素宽:按钮换行成两排,不溢出,每一项都点得到。

全程没装插件、没改文件。所有东西都在后台里,客户自己能看见每一部分在哪,也不会被下一次主题更新悄悄覆盖掉。

顺手记下的三件遗留

改动过程中看到的问题,我们不顺手乱改,都记下来:

发现 怎么处理
子主题里有一份过期的 WooCommerce 模板文件 现在没坏,但下次 WooCommerce 更新可能让分类页错位。已书面记录受影响的模板
旧 CSS 里有一条选择器拼错的死代码 暂留,等新导航跑稳了一起清理
主题更新 故意推迟,排在队列里没忘——避免改到一半被重置设置

这个案例真正说明什么

不是「我们会写 CSS」,是这三件事:

一、得看这个具体的站。两个独立菜单、主机不让装插件、主题本来就带筛选侧边栏、客户还要黑白配色。这些都不在任何模型的训练数据里,只能打开站看。

二、每个答案都建立在前提上,而验证前提不是写作任务。前面那三个前提,AI 没法替你验证。

三、得有人按顺序执行并负责。先修菜单再建导航、在真实手机上验证、改的时候店还在卖货。这些需要几个小时的人力,这是真实成本,我们不省,也不夸大。

我们不主张什么

  • 这不是整站改版,只是产品目录里一个区域的改动。
  • 不做流量和销售提升的承诺。导航改动没有我们能诚实报出来的数字。
  • 标签条是客户选的风格。我们在真机上验证了它是对的,但不保证它适合你的店。
  • 也不说「AI 干不了这个」。AI 让起草标记、查文档这些事快了很多。真正的限制在于:没人替你验证前提,没人替结果负责。

常见问题

用 AI 改坏了,你们接吗?

接,这种情况现在不少见。先把坏的地方恢复,再谈要改什么。恢复通常比新建快。

我的主机也锁了,是不是就没法改了?

看锁在哪一层。锁了插件安装和文件编辑,后台里能做的仍然不少:主题设置、分类描述、自定义 CSS。真正做不了的是装插件、改主题代码,以及站点彻底崩掉之后的整站恢复。

(如果用的是国内 SaaS 建站平台,能改的范围更窄,那是另一回事。)

这种小改动要多久?

这个案例是跨几天的几次短会话。大部分时间花在真机上一步步验证,不是花在打字上。仍然要几个小时的人力。

改完有没有记录?

有。改了什么、每一部分在哪里、下次更新前要检查什么,都写下来。你或者下一个接手的人不用猜。

最后一句

简单的问题,先问 AI——通常是对的,而且免费。

你付钱买的不是答案。是有人打开你的站,检查那些答案在你这里还成不成立,并为结果负责。

这类改动归在网站技术维护里,和日常维护一起安排。如果你只是想改一次,也可以单独谈。

改坏了、或者不知道能不能改,把网址和坏的地方发过来。免费先看一眼,告诉你能不能修、大概要多少。

修不了也会直说,不接的活我们告诉你别花这个钱。

微信 / 电话:18810043668(微信同手机号)

麦哲网联自 2010 年起做网站建设与长期维护。经手企业官网、外贸独立站、社会组织与定制系统,处理过大量接管、故障应急与小改动交付。

本文案例已获客户同意发布,客户名称、网址与账号标识均已隐去。