Už od příchodu WordPressu 7.0 v dubnu letošního roku mají uživatelé k dispozici blok Ikona, který dovoluje vkládat do obsahu SVG grafiku. Nabídka vestavěných ikon však byla omezená a vývojáři neměli možnost přidávat vlastní. To se mění už zítra – WordPress 7.1 přináší plnohodnotné veřejné API pro registraci a správu vlastních ikon.
Co je blok Ikona a proč dosud chyběl
Blok Ikona (anglicky Icon block) byl jednou z nejzajímavějších novinek WordPressu 7.0. Umožňuje vložit do článku či stránky libovolnou SVG ikonu z vestavěné knihovny, nastavit jí velikost, barvu a další vizuální vlastnosti. Pro běžné uživatele to znamenalo pohodlné doplnění obsahu o ilustrativní grafiku bez nutnosti nahrávat obrázky.
Pro vývojáře to ale byla polovičatá radost. Knihovna obsahovala jen ikony dodávané přímo jádrem WordPressu – a chyběl jakýkoli způsob, jak do ní přidat vlastní SVG sadu. Pokud chtěl vývojář použít ikony svého pluginu či tématu, musel sáhnout po vlastním CSS a HTML, čímž se ochudil o integraci s blokovým editorem.
WordPress 7.1, jehož vydání je naplánováno na 19. srpna, tento nedostatek odstraňuje. Nové SVG Icon API přináší standardizovaný způsob, jak registrovat, organizovat a vykreslovat vlastní ikony napříč celým systémem.
Jak SVG Icon API funguje
API je postaveno na jednoduchém konceptu kolekcí a ikon. Každá ikona patří do pojmenované kolekce, což zabraňuje kolizím – ikona core/plus se díky tomu liší od muj-plugin/plus.
Hlavní funkce API
wp_register_icon_collection()– zaregistruje novou kolekci s názvem, popiskem a volitelným popisemwp_register_icon()– přidá konkrétní SVG ikonu do existující kolekce (jako inline SVG řetězec nebo cestu k souboru)wp_unregister_icon_collection()– odstraní celou kolekci i se všemi ikonami v níwp_unregister_icon()– odstraní jednu konkrétní ikonuwp_get_icon()– vykreslí SVG kód ikony v PHP
Registrace probíhá standardně na hooku init. Pokud vývojář zaregistruje kolekci například s názvem restaurace a ikonu s názvem dort, výsledný identifikátor bude restaurace/dort. Stejný identifikátor se pak automaticky objeví v bloku Ikona v editoru.
Dva způsoby dodání SVG
API podporuje dva režimy předání SVG grafiky:
content– SVG kód vložený přímo jako řetězec do PHP (vhodné pro malé sady nebo jednotlivé ikony)file_path– absolutní cesta k souboru.svgna serveru (vhodné pro větší sady)
Důležité je, že file_path se vyhodnocuje až při prvním použití ikony – registrace může proběhnout úspěšně, i když soubor na dané cestě neexistuje. Chyba se projeví až při pokusu o vykreslení, kdy ikona vrátí prázdný řetězec.
Bezpečnostní sanitizace a její omezení
Každá registrovaná SVG ikona prochází automatickou sanitizací přes wp_kses. Povoleny jsou pouze tři HTML elementy: <svg>, <path> a <polygon>, každý s omezenou sadou atributů. Vše ostatní – inline styly, skripty, obsluhy událostí – je odstraněno.
Tento konzervativní přístup má dva praktické důsledky:
- Atribut
strokenení povolen – ikony založené na tazích (stroke-based) ztratí obrys a je třeba používat výplňové (fill-based) tvary - Atribut
fillna vnějším<svg>je odstraněn – pokud chcete, aby ikona přebírala barvu textu, musíte buď přidatfill="currentColor"přímo na element<path>, nebo nastavit CSS přes třídu
Tým WordPressu pracuje na rozšíření allowlistu o další elementy a atributy (viz GitHub pull request #75550), takže v budoucích verzích lze očekávat podporu pro stroke, kruhy, obdélníky a další tvary.
Vylepšení bloku Ikona v editoru
Samotný blok Ikona se v 7.1 dočkal několika důležitých vylepšení:
- Ikony seskupené podle kolekcí – výběr ikon nyní zobrazuje záložky pro jednotlivé kolekce, včetně záložky „Vše” pro prohledávání napříč všemi sadami
- Otočení a zrcadlení – panel nástrojů bloku získal ovládací prvky pro horizontální i vertikální překlopení a rotaci po 90 stupních
- Výchozí ikona – nově vložený blok už nezačíná prázdným placeholderem, ale ikonou
core/info - Serverové vykreslování – blok nyní používá
wp_get_icon()i na straně serveru, což zajišťuje konzistentní výstup napříč celým systémem
REST API pro ikony a kolekce
Vývojáři mohou s ikonami pracovat i přes REST API. WordPress 7.1 přidává nové endpointy pod wp/v2:
GET /wp/v2/icon-collections– seznam všech kolekcíGET /wp/v2/icon-collections/{kolekce}– detail jedné kolekceGET /wp/v2/icons– všechny ikony (s podporou vyhledávání a filtrování podle kolekce)GET /wp/v2/icons/{kolekce}– ikony v jedné kolekciGET /wp/v2/icons/{kolekce}/{nazev}– konkrétní ikona
Všechny endpointy jsou read-only (pouze GET) a vyžadují přihlášeného uživatele s právem edit_posts. To umožňuje nástrojům třetích stran procházet dostupné ikony, aniž by musely sahat přímo do databáze.
Praktický příklad: restaurační menu
Jeden z prvních demonstrovaných projektů využívajících nové API je plugin pro restaurační menu. Vývojáři z WordPress Developer Blog vytvořili kompletní ukázkový plugin, který registruje třináct ikon jídel – od pečiva a bento krabičky přes snídani až po tapas.
Plugin je postavený na PHP 8.1 enumeracích s typovou bezpečností. Každá ikona je reprezentována jako case v enum Icon, což poskytuje autocompletion v IDE a kontrolu typů při kompilaci, na rozdíl od pole s řetězcovými klíči, kde překlep způsobí tichou chybu až za běhu.
Když se ikony zaregistrují, v editoru se automaticky objeví nová záložka „Restaurant” v dialogu pro výběr ikon. Uživatel pak může vybrat například ikonu dortu a vložit ji do stránky – výsledný blok v HTML vypadá jako <!-- wp:icon {"icon":"devblog-restaurant/cake"} /-->.
Co přinese budoucnost
WordPress 7.1 vychází 19. srpna a přináší přes 310 uzavřených ticketů v Core Trac, z toho více než 100 vylepšení. SVG Icon API je jen jednou z mnoha novinek – k dalším patří responzivní styly, vylepšená práce s médii na straně klienta, nové nástroje pro přístupnost nebo API pro DataViews.
Pro samotné API je aktuálně největším omezením úzký allowlist SVG elementů a chybějící editorová komponenta pro pokročilou správu ikon. Tým již pracuje na rozšíření podporovaných tvarů, takže v příštích verzích se můžeme těšit na podporu kruhů, obdélníků a atributu stroke.
Pokud vyvíjíte plugin nebo téma pro WordPress, SVG Icon API vám dává možnost dodat vlastní ikony, které budou plně integrované do blokového editoru. Stačí pár řádků PHP kódu a vaše ikony se objeví vedle těch vestavěných – připravené k použití, s konzistentním vykreslováním a bez nutnosti vlastního CSS.
Zdroje
Zdroj: WordPress Developer Blog – Hands-on with the WordPress 7.1 Icon Registration API (18. 8. 2026)
Zdroj: Make WordPress Core – Registering and rendering SVG icons in WordPress 7.1 (24. 7. 2026)
Zdroj: Make WordPress Core – WordPress 7.1 Field Guide (5. 8. 2026)
Potřebujete s WordPress webem pomoct? Kontakt najdete přes formulář na stránce Kontakt.