前言¶

凡科/华可商城小程序的装修编辑器是一个网页版工具，站点域名形如 *.mallapp.vip.webportal.top。运营常见的需求是给「产品中心」页（分类页）的广告位替换配图：打开编辑器、点进产品中心页、点广告位、弹出素材库、选图、确认、保存草稿。单次操作不复杂，但广告位多、图片常换时，重复点击非常磨人。

自己用 Playwright 写脚本时，通常会卡在两个坑上：素材弹窗的点击事件不触发，filechooser 事件不弹出。按常规 UI 自动化思路模拟鼠标点击，弹窗根本不响应。下面介绍的 Skill 就是针对这两个坑做的封装。

这是什么¶

webportal 商城小程序广告位配图自动化 是一个社区来源（community）的 Skill，坐标 @user_6af9f15b/webportal-mallapp-decorator-ad，发布者 user_6af9f15b，当前版本 1.0.2，分类 dev-programming，无需 API Key（requires_api_key=false）。

它解决的问题很单一：在凡科/华可商城小程序装修编辑器里，为分类页/产品中心的广告位从素材库选择图片，并保存草稿。实现方式是 Playwright 配合 Vue 2 内部状态驱动——不依赖弹窗的鼠标点击，直接操作组件内部状态，从而绕开素材弹窗不触发、filechooser 不弹出的问题。

核心功能¶

根据官方简介，该 Skill 具备以下能力：

1、定位装修编辑器中「产品中心」页面的广告位；
2、绕过素材弹窗点击不触发、filechooser 不弹出的问题，通过 Vue 2 内部状态驱动配图流程；
3、从素材库中选择图片，填入广告位；
4、保存草稿（注意是保存草稿，不是直接发布）。

官方给出的触发词如下：

产品中心广告位、广告位配图、商城装修广告、webportal 广告位、分类页 banner

安装与启用¶

该 Skill 基于通用 SKILL.md 格式分发，来源为 community，无需 API Key。本次撰写时官方页面（api.skillhub.cn 与 skillhub.cn）均无法打开，具体安装命令未能核实，此处不写未经验证的命令。

按通用 SKILL.md Skill 的惯例，启用方式是把 Skill 文件放入 Agent 的 skills 目录后，在对话中使用上述触发词调用。是否支持 Cursor / Codex CLI / Claude Code 等具体客户端的差异，官方资料未说明，建议在使用前到官方页面核对最新版本与安装方式。

典型用法¶

官方简介描述的流程可以归纳为以下几步，这也是该 Skill 内部封装的操作顺序：

1、打开目标商城小程序的装修编辑器页面（*.mallapp.vip.webportal.top 域名）；
2、进入「产品中心」页，定位广告位组件；
3、触发广告位的配图流程，在素材库中选择目标图片；
4、确认选择，保存草稿。

调用时使用触发词，例如直接说「给产品中心页的广告位换上素材库里的图，保存草稿」。由于 Skill 通过 Vue 2 内部状态驱动，第 3 步不需要真实弹出素材窗口或系统文件选择框，这是它与普通 Playwright 脚本的主要区别。

适用场景与注意¶

适合谁：

• 使用凡科/华可商城小程序、需要频繁更换产品中心页广告位配图的开发者或运营自动化人员；
• 已经在用 Playwright 做编辑器自动化、被素材弹窗和 filechooser 卡住的人。

限制和坑：

• 只保存草稿，不会直接发布，发布仍需人工确认；
• 适用范围限定在装修编辑器的分类页/产品中心广告位，其他页面未提及；
• 源码不在本地，出问题时排查依赖发布者 user_6af9f15b 的更新；
• 数据以抓取时点为准：SkillHub 评分 100000，下载 978 次，安装数为 0。评分和下载量会随时间变化，引用时注意时点。

结尾¶

这个 Skill 的价值在于把一个具体、琐碎的编辑器操作固化下来：用 Vue 2 内部状态驱动替代脆弱的弹窗点击，让广告位配图这类重复劳动可以交给 Agent 完成。如果你的场景正好落在凡科/华可商城小程序的装修编辑器里，值得试一下。

官方地址：https://api.skillhub.cn/user_6af9f15b/webportal-mallapp-decorator-ad