Administration: Replace Dashicons icon font with @wordpress/icons SVGs in the sidebar navigation - #12843
Conversation
Replace the Dashicons icon font glyphs on the default top-level admin menu items with inline SVG icons from the core icon library, via wp_get_icon(). Covers Dashboard, Posts, Media, Pages, Comments, Appearance, Plugins, Users, Tools, Settings, and the Collapse menu button. The menu icon API is unchanged: plugin and theme icons, base64 data URIs, and dashicons classes all continue to work as before. The Dashicons font remains registered for plugins that still use it. Adds the corresponding SVGs to the core icon library and updates the generated icon library manifest. Props to those involved in the icons API work in wp-includes. Fixes #65387. See WordPress#12270.
|
The following accounts have interacted with this PR and/or linked issues. I will continue to update these lists as activity occurs. You can also manually ask me to refresh this list by adding the Unlinked AccountsThe following contributors have not linked their GitHub and WordPress.org accounts: @lucasmendes-design. Contributors, please read how to link your accounts to ensure your work is properly credited in WordPress releases. Core Committers: Use this line as a base for the props when committing in SVN: To understand the WordPress project's expectations around crediting contributors, please review the Contributor Attribution page in the Core Handbook. |
The 8 new sidebar icons (brush, dashboard, link, media, page, plugins, post, tool) were previously added by hand to the Gutenberg-versioned icon-library/ directory and manifest. Those files are regenerated by the gutenberg:copy build task from the pinned Gutenberg source, which deletes any local additions and causes the CI git-diff gate to fail. Move the SVG assets to a new, Core-owned wp-includes/images/core-icons/ directory and register them at runtime via wp_register_icon() in _wp_register_default_icons(). The versioned files revert to their upstream state, so the build regenerates them identically and the CI diff gate passes by construction. Props: see ticket #65387.
Test using WordPress PlaygroundThe changes in this pull request can previewed and tested using a WordPress Playground instance. WordPress Playground is an experimental project that creates a full WordPress instance entirely within the browser. Some things to be aware of
For more details about these limitations and more, check out the Limitations page in the WordPress Playground documentation. |
|
@faisalahammad, thanks for looking at this. I'm reviewing this now :) |
|
Why is that out of scope "plugin and theme menu icons"? |
|
cc: @t-hamano |
|
Related as well: |
|
To answer the scope question: this PR only targets Core's default top-level menu items (Dashboard through Settings) plus the Collapse button. Plugin and theme menu icons are explicitly out of scope because they can be custom dashicons classes, external URLs, or base64 data URIs — all of which continue to render via the existing fallback path in On #12270 — thanks for flagging. This is the sidebar-only companion to that PR (which covers admin bar + sidebar). #12843 covers the sidebar navigation replacements referenced in #65387, while #12270 handles the admin bar side. They're meant to land together but are tracked separately. |
2 participants
https://core.trac.wordpress.org/ticket/65387
Replaces the Dashicons icon font glyphs on Core's default top-level admin sidebar menu items with inline SVG icons from the @wordpress/icons library, via the new wp_get_icon() API. Icons keep their current look, position, and labels; only the rendering technique changes, which removes the font glyph dependencies from Core's own menu and prepares for the eventual removal of the Dashicons font from wp-admin.
In scope: the default top-level menu icons (Dashboard, Posts, Media, Pages, Comments, Appearance, Plugins, Users, Tools, Settings) and the Collapse menu button icon. Adds the corresponding SVGs to the core icon library.
Out of scope: plugin and theme menu icons, the admin bar (#65386), and any restructuring of the sidebar navigation. The menu icon API is untouched. Base64 data URI, none/div, and dashicons icon types continue to render as before, and the Dashicons font stays registered for plugins that still rely on it.
Testing: