WordPress 7.1 可以自定义全套 SVG 图标？一篇搞懂注册、渲染与 REST API！
内容提要
WordPress 7.1 将内置 SVG 图标升级为公共 API。开发者可通过 wp_register_icon_collection() 注册图标集，通过 wp_register_icon() 添加内联或文件图标，名称格式为“集合/图标名”，SVG 会经过安全过滤。图标区块选择器按集合分组，并支持翻转和旋转。可用 wp_get_icon() 在 PHP 中渲染图标，并通过 REST 只读端点浏览集合与图标。
延伸解读
命名空间如何避免图标冲突
文章强调每个图标必须属于一个图标集，名称格式为“集合/图标名”，集合名作为前缀。这样来自核心、插件或第三方库的同名图标可以共存，例如 core/plus 与 my-plugin/plus 互不冲突。注册图标前必须先注册对应集合，否则会失败。这种设计让不同来源的图标在编辑器和 REST API 中都能清晰区分，也便于按集合管理。
SVG 安全过滤带来的实际限制
注册的 SVG 会经过 wp_kses 清洗，目前白名单仅允许 <svg>、<path> 和 <polygon> 元素及固定属性，内联样式、脚本和事件处理程序都会被移除。这意味着基于描边的图标会丢失 stroke，开发者应尽量使用填充形状。同时，最外层 <svg> 上的 fill 不会被保留，独立调用 wp_get_icon() 时图标默认以黑色渲染，需要额外处理才能继承文本颜色。
独立渲染图标时如何继承文本颜色
文章指出，图标区块内部通过样式表设置 fill: currentColor，所以颜色正常。但独立调用 wp_get_icon() 返回的原始标记没有该规则，默认显示 SVG 自身的填充色。要让独立图标跟随文本颜色，有两种方法：一是渲染时传入 class，再用自定义 CSS 设置 fill: currentColor；二是在注册图标时直接把 fill="currentColor" 写在 <path> 或 <polygon> 上，因为白名单保留了形状上的 fill 属性。
REST API 只读浏览的权限与用途
所有图标和集合的 REST 端点都位于 wp/v2 下，且为只读 GET 请求，不能通过 REST 注册或修改。访问需要已认证用户具备 edit_posts 权限，或对任何 show_in_rest 文章类型有编辑权限。图标列表支持 search 和 collection 查询参数，方便按名称、标签或集合过滤。这些端点主要用于后台编辑器读取图标，也可供开发者在 PHP 中浏览已注册内容。
Q&A
WordPress 7.1 的 SVG 图标 API 主要能做什么？
WordPress 7.1 将内置 SVG 图标升级为公共 API，开发者可以注册自定义图标集和图标、在图标区块选择器中按集合浏览、使用 wp_get_icon() 在 PHP 中渲染图标，并通过 REST API 只读端点浏览集合与图标。
如何注册一个自定义图标集？
使用 wp_register_icon_collection() 函数，在 init 钩子中调用。第一个参数是集合名称，必须以小写字母或数字开头和结尾，中间可包含小写字母、数字、连字符和下划线；第二个参数是数组，包含必需的 label 和可选的 description。
注册图标时，SVG 内容会经过怎样的安全处理？
SVG 字符串会经过 wp_kses 安全清洗过滤，仅保留白名单中的元素：目前只允许 <svg>、<path> 和 <polygon> 元素，且每个元素仅限于一组固定的属性。白名单之外的任何内容（如其它元素、内联样式、脚本或事件处理程序）都会被删除。
wp_get_icon() 函数如何使用？
wp_get_icon() 用于获取已注册图标的 SVG 标记。第一个参数是图标名称（如 core/plus），未注册则返回空字符串。第二个可选参数支持 size（像素，默认 24，传 null 保留 SVG 自身尺寸）、class（额外 CSS 类名）和 label（无障碍标签，提供则读屏软件朗读，留空则视为装饰性元素隐藏）。
图标区块的选择器有哪些增强？
图标选择器现在按集合对图标进行分组，每个集合有独立选项卡，还有一个涵盖所有集合的“全部”选项卡。搜索功能在当前选中的集合内过滤，使用“全部”选项卡可跨集合搜索，切换选项卡时搜索关键字会被保留。
REST API 提供了哪些端点来浏览图标和集合？
所有端点位于 wp/v2 下，均为只读 GET 请求。集合端点：GET /wp/v2/icon-collections 获取所有集合，GET /wp/v2/icon-collections/<collection> 获取单个集合。图标端点：GET /wp/v2/icons 获取所有图标，GET /wp/v2/icons/<collection> 获取指定集合中的图标，GET /wp/v2/icons/<collection>/<name> 获取单个图标。图标列表支持 search 和 collection 查询参数。
如何让 wp_get_icon() 渲染的独立图标继承文本颜色？
有两种方法：1. 通过自定义 CSS，在渲染时加上类名，然后对该类设置 fill: currentColor，由于 fill 可继承，会下钻应用到内部形状；2. 在注册图标时直接将 fill="currentColor" 放在形状上，白名单保留了 <path> 和 <polygon> 上的 fill 属性，因此能通过安全清洗过滤。
