{"id":259,"date":"2026-08-14T14:01:23","date_gmt":"2026-08-14T12:01:23","guid":{"rendered":"https:\/\/helloblog.io\/el\/custom-svg-icons-wordpress-7-1\/"},"modified":"2026-08-14T14:01:23","modified_gmt":"2026-08-14T12:01:23","slug":"custom-svg-icons-wordpress-7-1","status":"publish","type":"post","link":"https:\/\/helloblog.io\/el\/custom-svg-icons-wordpress-7-1\/","title":{"rendered":"Custom SVG icons \u03c3\u03c4\u03bf WordPress 7.1: \u03bf\u03b4\u03b7\u03b3\u03cc\u03c2 \u03b3\u03b9\u03b1 plugins"},"content":{"rendered":"\n<p>\u03a4\u03b1 \u03c0\u03c1\u03bf\u03c3\u03b1\u03c1\u03bc\u03bf\u03c3\u03bc\u03ad\u03bd\u03b1 SVG icons \u03c3\u03c4\u03bf WordPress 7.1 \u03c6\u03ad\u03c1\u03bd\u03bf\u03c5\u03bd \u03bc\u03b9\u03b1 \u03b5\u03bd\u03b9\u03b1\u03af\u03b1 API \u03b3\u03b9\u03b1 \u03c4\u03bf\u03bd editor, \u03c4\u03b1 PHP templates \u03ba\u03b1\u03b9 \u03c4\u03bf REST API. \u0391\u03bd\u03c4\u03af \u03bd\u03b1 \u03b3\u03c1\u03ac\u03c6\u03b5\u03c4\u03b5 JavaScript, \u03bd\u03b1 \u03c3\u03c4\u03ae\u03bd\u03b5\u03c4\u03b5 build step \u03ae \u03bd\u03b1 \u03ba\u03b1\u03c4\u03b1\u03c6\u03b5\u03cd\u03b3\u03b5\u03c4\u03b5 \u03c3\u03b5 \u03c0\u03c1\u03bf\u03c3\u03c9\u03c1\u03b9\u03bd\u03ad\u03c2 \u03bb\u03cd\u03c3\u03b5\u03b9\u03c2, \u03bc\u03c0\u03bf\u03c1\u03b5\u03af\u03c4\u03b5 \u03bd\u03b1 \u03b4\u03b7\u03bb\u03ce\u03c3\u03b5\u03c4\u03b5 \u03bc\u03b9\u03b1 \u03c3\u03c5\u03bb\u03bb\u03bf\u03b3\u03ae icons \u03b1\u03c0\u03cc \u03ad\u03bd\u03b1 plugin \u03ba\u03b1\u03b9 \u03bd\u03b1 \u03c4\u03b7 \u03c7\u03c1\u03b7\u03c3\u03b9\u03bc\u03bf\u03c0\u03bf\u03b9\u03ae\u03c3\u03b5\u03c4\u03b5 \u03c0\u03b1\u03bd\u03c4\u03bf\u03cd.<\/p>\n\n\n\n<p>\u0397 \u03ad\u03ba\u03b4\u03bf\u03c3\u03b7 7.1 \u03c4\u03bf\u03c5 WordPress \u03b1\u03bd\u03b1\u03bc\u03ad\u03bd\u03b5\u03c4\u03b1\u03b9 \u03c3\u03c4\u03b9\u03c2 19 \u0391\u03c5\u03b3\u03bf\u03cd\u03c3\u03c4\u03bf\u03c5 2026. \u039f \u03c0\u03b1\u03c1\u03b1\u03ba\u03ac\u03c4\u03c9 \u03bf\u03b4\u03b7\u03b3\u03cc\u03c2 \u03b2\u03b1\u03c3\u03af\u03b6\u03b5\u03c4\u03b1\u03b9 \u03c3\u03c4\u03b7\u03bd API \u03c0\u03bf\u03c5 \u03c0\u03c1\u03bf\u03b2\u03bb\u03ad\u03c0\u03b5\u03c4\u03b1\u03b9 \u03bd\u03b1 \u03c0\u03b5\u03c1\u03b9\u03bb\u03b1\u03bc\u03b2\u03ac\u03bd\u03b5\u03b9 \u03b7 \u03c4\u03b5\u03bb\u03b9\u03ba\u03ae \u03ad\u03ba\u03b4\u03bf\u03c3\u03b7 \u03ba\u03b1\u03b9 \u03b4\u03b5\u03af\u03c7\u03bd\u03b5\u03b9 \u03c0\u03ce\u03c2 \u03b8\u03b1 \u03b4\u03b7\u03bc\u03b9\u03bf\u03c5\u03c1\u03b3\u03ae\u03c3\u03b5\u03c4\u03b5 \u03ad\u03bd\u03b1 \u03bc\u03b9\u03ba\u03c1\u03cc plugin \u03bc\u03b5 \u03ad\u03bd\u03b1 inline icon, icons \u03b1\u03c0\u03cc \u03b1\u03c1\u03c7\u03b5\u03af\u03b1 SVG, \u03bc\u03b1\u03b6\u03b9\u03ba\u03ae \u03ba\u03b1\u03c4\u03b1\u03c7\u03ce\u03c1\u03b9\u03c3\u03b7, shortcode \u03ba\u03b1\u03b9 \u03c7\u03c1\u03ae\u03c3\u03b7 icon \u03c3\u03b5 custom block.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\">\u03a4\u03b9 \u03c7\u03c1\u03b5\u03b9\u03ac\u03b6\u03b5\u03c3\u03c4\u03b5 \u03ba\u03b1\u03b9 \u03c4\u03b9 \u03b8\u03b1 \u03c5\u03bb\u03bf\u03c0\u03bf\u03b9\u03ae\u03c3\u03b5\u03c4\u03b5<\/h2>\n\n\n\n<p>\u0398\u03b1 \u03b4\u03b7\u03bc\u03b9\u03bf\u03c5\u03c1\u03b3\u03ae\u03c3\u03b5\u03c4\u03b5 \u03c4\u03bf plugin <code>myplugin-custom-icons<\/code>, \u03c4\u03bf \u03bf\u03c0\u03bf\u03af\u03bf \u03b4\u03b7\u03bb\u03ce\u03bd\u03b5\u03b9 \u03c4\u03b7 \u03c3\u03c5\u03bb\u03bb\u03bf\u03b3\u03ae <code>myplugin<\/code>. \u0397 \u03c3\u03c5\u03bb\u03bb\u03bf\u03b3\u03ae \u03b8\u03b1 \u03c0\u03b5\u03c1\u03b9\u03ad\u03c7\u03b5\u03b9 \u03ad\u03bd\u03b1 heart icon \u03c0\u03bf\u03c5 \u03bf\u03c1\u03af\u03b6\u03b5\u03c4\u03b5 \u03bc\u03ad\u03c3\u03b1 \u03c3\u03c4\u03b7\u03bd PHP, \u03ba\u03b1\u03b8\u03ce\u03c2 \u03ba\u03b1\u03b9 star \u03ba\u03b1\u03b9 bookmark icons \u03c0\u03bf\u03c5 \u03c6\u03bf\u03c1\u03c4\u03ce\u03bd\u03bf\u03bd\u03c4\u03b1\u03b9 \u03b1\u03c0\u03cc \u03b1\u03c1\u03c7\u03b5\u03af\u03b1 <code>.svg<\/code>.<\/p>\n\n\n\n<p>\u03a7\u03c1\u03b5\u03b9\u03ac\u03b6\u03b5\u03c3\u03c4\u03b5 WordPress 7.1 \u03ae \u03bd\u03b5\u03cc\u03c4\u03b5\u03c1\u03bf &#8211; \u03bc\u03c0\u03bf\u03c1\u03b5\u03af\u03c4\u03b5 \u03bd\u03b1 \u03b1\u03bd\u03b1\u03c0\u03c4\u03cd\u03be\u03b5\u03c4\u03b5 \u03bc\u03b5 \u03c4\u03bf 7.1 RC -, \u03bc\u03b5\u03c1\u03b9\u03ba\u03ac \u03b1\u03c1\u03c7\u03b5\u03af\u03b1 SVG, \u03c4\u03bf\u03c0\u03b9\u03ba\u03cc \u03c0\u03b5\u03c1\u03b9\u03b2\u03ac\u03bb\u03bb\u03bf\u03bd \u03cc\u03c0\u03c9\u03c2 LocalWP, WordPress Studio \u03ae wp-env, \u03ba\u03b1\u03b9 \u03b2\u03b1\u03c3\u03b9\u03ba\u03ae \u03b5\u03be\u03bf\u03b9\u03ba\u03b5\u03af\u03c9\u03c3\u03b7 \u03bc\u03b5 PHP. \u03a3\u03c4\u03b7 \u03c3\u03c5\u03bd\u03ad\u03c7\u03b5\u03b9\u03b1 \u03b8\u03b1 \u03c0\u03c1\u03bf\u03c3\u03b8\u03ad\u03c3\u03b5\u03c4\u03b5 \u03ba\u03ac\u03b8\u03b5 SVG \u03b5\u03bd\u03cc\u03c2 \u03c6\u03b1\u03ba\u03ad\u03bb\u03bf\u03c5 \u03b1\u03c5\u03c4\u03cc\u03bc\u03b1\u03c4\u03b1, \u03b8\u03b1 \u03b5\u03b9\u03c3\u03ac\u03b3\u03b5\u03c4\u03b5 icons \u03c3\u03b5 \u03c0\u03b5\u03c1\u03b9\u03b5\u03c7\u03cc\u03bc\u03b5\u03bd\u03bf \u03bc\u03b5 shortcode \u03ba\u03b1\u03b9 \u03b8\u03b1 \u03c7\u03c1\u03b7\u03c3\u03b9\u03bc\u03bf\u03c0\u03bf\u03b9\u03ae\u03c3\u03b5\u03c4\u03b5 \u03ad\u03bd\u03b1 registered icon \u03c3\u03c4\u03bf <code>register_block_type()<\/code>.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\">\u0397 API \u03c4\u03c9\u03bd custom icons<\/h2>\n\n\n\n<p>\u0397 API \u03ad\u03c7\u03b5\u03b9 \u03c4\u03c1\u03b5\u03b9\u03c2 \u03c3\u03c5\u03bd\u03b1\u03c1\u03c4\u03ae\u03c3\u03b5\u03b9\u03c2 \u03ba\u03b1\u03b9 \u03bc\u03af\u03b1 \u03b2\u03b1\u03c3\u03b9\u03ba\u03ae \u03ad\u03bd\u03bd\u03bf\u03b9\u03b1 \u03bf\u03c1\u03b3\u03ac\u03bd\u03c9\u03c3\u03b7\u03c2: \u03c4\u03b9\u03c2 \u03c3\u03c5\u03bb\u03bb\u03bf\u03b3\u03ad\u03c2. \u039a\u03ac\u03b8\u03b5 icon \u03b1\u03bd\u03ae\u03ba\u03b5\u03b9 \u03c5\u03c0\u03bf\u03c7\u03c1\u03b5\u03c9\u03c4\u03b9\u03ba\u03ac \u03c3\u03b5 \u03bc\u03b9\u03b1 \u03c3\u03c5\u03bb\u03bb\u03bf\u03b3\u03ae \u03ba\u03b1\u03b9 \u03c4\u03bf \u03cc\u03bd\u03bf\u03bc\u03ac \u03c4\u03b7\u03c2 \u03bb\u03b5\u03b9\u03c4\u03bf\u03c5\u03c1\u03b3\u03b5\u03af \u03c9\u03c2 \u03c0\u03c1\u03cc\u03b8\u03b5\u03bc\u03b1. \u0388\u03c4\u03c3\u03b9 \u03c4\u03bf <code>core\/plus<\/code> \u03b4\u03b9\u03b1\u03c6\u03ad\u03c1\u03b5\u03b9 \u03b1\u03c0\u03cc \u03c4\u03bf <code>myplugin\/plus<\/code> \u03ba\u03b1\u03b9 \u03b1\u03c0\u03bf\u03c6\u03b5\u03cd\u03b3\u03b5\u03c4\u03b5 \u03c3\u03c5\u03b3\u03ba\u03c1\u03bf\u03cd\u03c3\u03b5\u03b9\u03c2 \u03bc\u03b5 icons \u03c4\u03bf\u03c5 core \u03ae \u03ac\u03bb\u03bb\u03c9\u03bd plugins.<\/p>\n\n\n\n<p>\u03a7\u03c1\u03b7\u03c3\u03b9\u03bc\u03bf\u03c0\u03bf\u03b9\u03ae\u03c3\u03c4\u03b5 \u03c4\u03b9\u03c2 \u03b5\u03be\u03ae\u03c2 \u03c3\u03c5\u03bd\u03b1\u03c1\u03c4\u03ae\u03c3\u03b5\u03b9\u03c2:<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n\n<li><code>wp_register_icon_collection( $name, $args )<\/code>: \u03b4\u03b7\u03bb\u03ce\u03bd\u03b5\u03b9 \u03bc\u03b9\u03b1 \u03bf\u03bd\u03bf\u03bc\u03b1\u03c3\u03bc\u03ad\u03bd\u03b7 \u03c3\u03c5\u03bb\u03bb\u03bf\u03b3\u03ae icons.<\/li>\n\n\n<li><code>wp_register_icon( $name, $args )<\/code>: \u03b4\u03b7\u03bb\u03ce\u03bd\u03b5\u03b9 \u03ad\u03bd\u03b1 icon.<\/li>\n\n\n<li><code>wp_get_icon( $name, $args )<\/code>: \u03b1\u03c0\u03bf\u03b4\u03af\u03b4\u03b5\u03b9 \u03ad\u03bd\u03b1 SVG \u03b1\u03c0\u03cc PHP \u03ba\u03b1\u03b9 \u03b5\u03c0\u03b9\u03c3\u03c4\u03c1\u03ad\u03c6\u03b5\u03b9 \u03c4\u03bf SVG \u03c9\u03c2 string.<\/li>\n\n<\/ul>\n\n\n\n<p>\u0393\u03b9\u03b1 \u03ba\u03ac\u03b8\u03b5 icon \u03b4\u03b9\u03b1\u03bb\u03ad\u03b3\u03b5\u03c4\u03b5 \u03bc\u03af\u03b1 \u03b1\u03c0\u03cc \u03b4\u03cd\u03bf \u03c0\u03b7\u03b3\u03ad\u03c2 SVG. \u039c\u03b5 \u03c4\u03bf <code>content<\/code> \u03c0\u03b5\u03c1\u03bd\u03ac\u03c4\u03b5 \u03c4\u03bf SVG markup \u03c9\u03c2 string \u03bc\u03ad\u03c3\u03b1 \u03c3\u03c4\u03b7\u03bd PHP. \u039c\u03b5 \u03c4\u03bf <code>file_path<\/code> \u03c0\u03b5\u03c1\u03bd\u03ac\u03c4\u03b5 \u03c4\u03bf \u03b1\u03c0\u03cc\u03bb\u03c5\u03c4\u03bf path \u03b5\u03bd\u03cc\u03c2 \u03b1\u03c1\u03c7\u03b5\u03af\u03bf\u03c5 <code>.svg<\/code>. \u039c\u03b7 \u03c3\u03c5\u03bd\u03b4\u03c5\u03ac\u03b6\u03b5\u03c4\u03b5 \u03c4\u03b1 \u03b4\u03cd\u03bf \u03c3\u03c4\u03bf \u03af\u03b4\u03b9\u03bf icon: \u03c4\u03bf <code>content<\/code> \u03b5\u03be\u03c5\u03c0\u03b7\u03c1\u03b5\u03c4\u03b5\u03af \u03ad\u03bd\u03b1 \u03ae \u03b4\u03cd\u03bf icons, \u03b5\u03bd\u03ce \u03c4\u03bf <code>file_path<\/code> \u03ba\u03bb\u03b9\u03bc\u03b1\u03ba\u03ce\u03bd\u03b5\u03c4\u03b1\u03b9 \u03ba\u03b1\u03bb\u03cd\u03c4\u03b5\u03c1\u03b1 \u03cc\u03c4\u03b1\u03bd \u03b4\u03b9\u03b1\u03c7\u03b5\u03b9\u03c1\u03af\u03b6\u03b5\u03c3\u03c4\u03b5 \u03c6\u03ac\u03ba\u03b5\u03bb\u03bf \u03bc\u03b5 \u03c0\u03bf\u03bb\u03bb\u03ac \u03b1\u03c1\u03c7\u03b5\u03af\u03b1.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\">\u0394\u03b7\u03bc\u03b9\u03bf\u03c5\u03c1\u03b3\u03ae\u03c3\u03c4\u03b5 \u03c4\u03bf plugin \u03ba\u03b1\u03b9 \u03b4\u03b7\u03bb\u03ce\u03c3\u03c4\u03b5 \u03c0\u03c1\u03ce\u03c4\u03b1 \u03c4\u03b7 \u03c3\u03c5\u03bb\u03bb\u03bf\u03b3\u03ae<\/h2>\n\n\n\n<p>\u0397 \u03c3\u03b5\u03b9\u03c1\u03ac \u03ba\u03b1\u03c4\u03b1\u03c7\u03ce\u03c1\u03b9\u03c3\u03b7\u03c2 \u03b5\u03af\u03bd\u03b1\u03b9 \u03ba\u03c1\u03af\u03c3\u03b9\u03bc\u03b7. \u03a0\u03c1\u03ad\u03c0\u03b5\u03b9 \u03bd\u03b1 \u03b4\u03b7\u03bb\u03ce\u03c3\u03b5\u03c4\u03b5 \u03c4\u03b7 \u03c3\u03c5\u03bb\u03bb\u03bf\u03b3\u03ae \u03c0\u03c1\u03b9\u03bd \u03b4\u03b7\u03bb\u03ce\u03c3\u03b5\u03c4\u03b5 icons \u03c0\u03bf\u03c5 \u03b1\u03bd\u03ae\u03ba\u03bf\u03c5\u03bd \u03c3\u03b5 \u03b1\u03c5\u03c4\u03ae\u03bd\u00b7 \u03b4\u03b9\u03b1\u03c6\u03bf\u03c1\u03b5\u03c4\u03b9\u03ba\u03ac \u03c4\u03b1 icons \u03b4\u03b5\u03bd \u03b5\u03bc\u03c6\u03b1\u03bd\u03af\u03b6\u03bf\u03bd\u03c4\u03b1\u03b9 \u03c3\u03c4\u03bf\u03bd picker \u03c7\u03c9\u03c1\u03af\u03c2 \u03bd\u03b1 \u03bb\u03ac\u03b2\u03b5\u03c4\u03b5 \u03b5\u03bc\u03c6\u03b1\u03bd\u03ad\u03c2 \u03c3\u03c6\u03ac\u03bb\u03bc\u03b1.<\/p>\n\n\n\n<p>\u0394\u03b7\u03bc\u03b9\u03bf\u03c5\u03c1\u03b3\u03ae\u03c3\u03c4\u03b5 \u03c4\u03b7\u03bd \u03b1\u03ba\u03cc\u03bb\u03bf\u03c5\u03b8\u03b7 \u03b4\u03bf\u03bc\u03ae \u03bc\u03ad\u03c3\u03b1 \u03c3\u03c4\u03bf <code>wp-content\/plugins\/<\/code>:<\/p>\n\n\n\n<div class=\"wp-block-kevinbatdorf-code-block-pro\" data-code-block-pro-font-family=\"Code-Pro-JetBrains-Mono\" style=\"font-size:.875rem;font-family:Code-Pro-JetBrains-Mono,ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;line-height:1.25rem;--cbp-tab-width:2;tab-size:var(--cbp-tab-width, 2)\"><span style=\"display:block;padding:16px 0 0 16px;margin-bottom:-1px;width:100%;text-align:left;background-color:#24292e\"><svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"54\" height=\"14\" viewBox=\"0 0 54 14\"><g fill=\"none\" fill-rule=\"evenodd\" transform=\"translate(1 1)\"><circle cx=\"6\" cy=\"6\" r=\"6\" fill=\"#FF5F56\" stroke=\"#E0443E\" stroke-width=\".5\"><\/circle><circle cx=\"26\" cy=\"6\" r=\"6\" fill=\"#FFBD2E\" stroke=\"#DEA123\" stroke-width=\".5\"><\/circle><circle cx=\"46\" cy=\"6\" r=\"6\" fill=\"#27C93F\" stroke=\"#1AAB29\" stroke-width=\".5\"><\/circle><\/g><\/svg><\/span><span role=\"button\" tabindex=\"0\" style=\"color:#e1e4e8;display:none\" aria-label=\"Copy\" class=\"code-block-pro-copy-button\"><pre class=\"code-block-pro-copy-button-pre\" aria-hidden=\"true\"><textarea class=\"code-block-pro-copy-button-textarea\" tabindex=\"-1\" aria-hidden=\"true\" readonly>myplugin-custom-icons\/\n\u251c\u2500\u2500 myplugin-custom-icons.php\n\u2514\u2500\u2500 icons\/\n    \u251c\u2500\u2500 star.svg\n    \u2514\u2500\u2500 bookmark.svg\n<\/textarea><\/pre><svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" style=\"width:24px;height:24px\" fill=\"none\" viewBox=\"0 0 24 24\" stroke=\"currentColor\" stroke-width=\"2\"><path class=\"with-check\" stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2m-6 9l2 2 4-4\"><\/path><path class=\"without-check\" stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2\"><\/path><\/svg><\/span><pre class=\"shiki github-dark\" style=\"background-color:#24292e;color:#e1e4e8\" tabindex=\"0\"><code><span class=\"line\"><span>myplugin-custom-icons\/<\/span><\/span>\n<span class=\"line\"><span>\u251c\u2500\u2500 myplugin-custom-icons.php<\/span><\/span>\n<span class=\"line\"><span>\u2514\u2500\u2500 icons\/<\/span><\/span>\n<span class=\"line\"><span>    \u251c\u2500\u2500 star.svg<\/span><\/span>\n<span class=\"line\"><span>    \u2514\u2500\u2500 bookmark.svg<\/span><\/span><\/code><\/pre><\/div>\n\n\n\n<p>\u03a3\u03c4\u03bf \u03b1\u03c1\u03c7\u03b5\u03af\u03bf <code>myplugin-custom-icons.php<\/code>, \u03c0\u03c1\u03bf\u03c3\u03b8\u03ad\u03c3\u03c4\u03b5 \u03c4\u03bf header \u03c4\u03bf\u03c5 plugin \u03ba\u03b1\u03b9 \u03b4\u03b7\u03bb\u03ce\u03c3\u03c4\u03b5 \u03c4\u03b7 \u03c3\u03c5\u03bb\u03bb\u03bf\u03b3\u03ae \u03c3\u03c4\u03bf hook <code>init<\/code>.<\/p>\n\n\n\n<div class=\"wp-block-kevinbatdorf-code-block-pro\" data-code-block-pro-font-family=\"Code-Pro-JetBrains-Mono\" style=\"font-size:.875rem;font-family:Code-Pro-JetBrains-Mono,ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;line-height:1.25rem;--cbp-tab-width:2;tab-size:var(--cbp-tab-width, 2)\"><span style=\"display:block;padding:16px 0 0 16px;margin-bottom:-1px;width:100%;text-align:left;background-color:#24292e\"><svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"54\" height=\"14\" viewBox=\"0 0 54 14\"><g fill=\"none\" fill-rule=\"evenodd\" transform=\"translate(1 1)\"><circle cx=\"6\" cy=\"6\" r=\"6\" fill=\"#FF5F56\" stroke=\"#E0443E\" stroke-width=\".5\"><\/circle><circle cx=\"26\" cy=\"6\" r=\"6\" fill=\"#FFBD2E\" stroke=\"#DEA123\" stroke-width=\".5\"><\/circle><circle cx=\"46\" cy=\"6\" r=\"6\" fill=\"#27C93F\" stroke=\"#1AAB29\" stroke-width=\".5\"><\/circle><\/g><\/svg><\/span><span role=\"button\" tabindex=\"0\" style=\"color:#e1e4e8;display:none\" aria-label=\"Copy\" class=\"code-block-pro-copy-button\"><pre class=\"code-block-pro-copy-button-pre\" aria-hidden=\"true\"><textarea class=\"code-block-pro-copy-button-textarea\" tabindex=\"-1\" aria-hidden=\"true\" readonly>&lt;?php\n\/**\n * Plugin Name: MyPlugin Custom Icons\n * Description: \u0394\u03b7\u03bb\u03ce\u03bd\u03b5\u03b9 custom SVG icons \u03b3\u03b9\u03b1 WordPress 7.1+.\n * Version:     1.0.0\n * Requires at least: 7.1\n * Requires PHP: 7.4\n *\/\n\nif ( ! defined( 'ABSPATH' ) ) {\n    exit;\n}\n\ndefine( 'MYPLUGIN_ICONS_PATH', plugin_dir_path( __FILE__ ) );\n\nadd_action( 'init', 'myplugin_register_icon_collection' );\n\nfunction myplugin_register_icon_collection() {\n    wp_register_icon_collection(\n        'myplugin',\n        array(\n            'label' =&gt; __( 'MyPlugin', 'myplugin-icons' ),\n        )\n    );\n}\n<\/textarea><\/pre><svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" style=\"width:24px;height:24px\" fill=\"none\" viewBox=\"0 0 24 24\" stroke=\"currentColor\" stroke-width=\"2\"><path class=\"with-check\" stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2m-6 9l2 2 4-4\"><\/path><path class=\"without-check\" stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2\"><\/path><\/svg><\/span><pre class=\"shiki github-dark\" style=\"background-color:#24292e;color:#e1e4e8\" tabindex=\"0\"><code><span class=\"line\"><span style=\"color:#F97583\">&#x3C;?<\/span><span style=\"color:#79B8FF\">php<\/span><\/span>\n<span class=\"line\"><span style=\"color:#6A737D\">\/**<\/span><\/span>\n<span class=\"line\"><span style=\"color:#6A737D\"> * Plugin Name: MyPlugin Custom Icons<\/span><\/span>\n<span class=\"line\"><span style=\"color:#6A737D\"> * Description: \u0394\u03b7\u03bb\u03ce\u03bd\u03b5\u03b9 custom SVG icons \u03b3\u03b9\u03b1 WordPress 7.1+.<\/span><\/span>\n<span class=\"line\"><span style=\"color:#6A737D\"> * Version:     1.0.0<\/span><\/span>\n<span class=\"line\"><span style=\"color:#6A737D\"> * Requires at least: 7.1<\/span><\/span>\n<span class=\"line\"><span style=\"color:#6A737D\"> * Requires PHP: 7.4<\/span><\/span>\n<span class=\"line\"><span style=\"color:#6A737D\"> *\/<\/span><\/span>\n<span class=\"line\"><\/span>\n<span class=\"line\"><span style=\"color:#F97583\">if<\/span><span style=\"color:#E1E4E8\"> ( <\/span><span style=\"color:#F97583\">!<\/span><span style=\"color:#79B8FF\"> defined<\/span><span style=\"color:#E1E4E8\">( <\/span><span style=\"color:#9ECBFF\">'ABSPATH'<\/span><span style=\"color:#E1E4E8\"> ) ) {<\/span><\/span>\n<span class=\"line\"><span style=\"color:#F97583\">    exit<\/span><span style=\"color:#E1E4E8\">;<\/span><\/span>\n<span class=\"line\"><span style=\"color:#E1E4E8\">}<\/span><\/span>\n<span class=\"line\"><\/span>\n<span class=\"line\"><span style=\"color:#79B8FF\">define<\/span><span style=\"color:#E1E4E8\">( <\/span><span style=\"color:#9ECBFF\">'MYPLUGIN_ICONS_PATH'<\/span><span style=\"color:#E1E4E8\">, <\/span><span style=\"color:#B392F0\">plugin_dir_path<\/span><span style=\"color:#E1E4E8\">( <\/span><span style=\"color:#79B8FF\">__FILE__<\/span><span style=\"color:#E1E4E8\"> ) );<\/span><\/span>\n<span class=\"line\"><\/span>\n<span class=\"line\"><span style=\"color:#B392F0\">add_action<\/span><span style=\"color:#E1E4E8\">( <\/span><span style=\"color:#9ECBFF\">'init'<\/span><span style=\"color:#E1E4E8\">, <\/span><span style=\"color:#9ECBFF\">'myplugin_register_icon_collection'<\/span><span style=\"color:#E1E4E8\"> );<\/span><\/span>\n<span class=\"line\"><\/span>\n<span class=\"line\"><span style=\"color:#F97583\">function<\/span><span style=\"color:#B392F0\"> myplugin_register_icon_collection<\/span><span style=\"color:#E1E4E8\">() {<\/span><\/span>\n<span class=\"line\"><span style=\"color:#B392F0\">    wp_register_icon_collection<\/span><span style=\"color:#E1E4E8\">(<\/span><\/span>\n<span class=\"line\"><span style=\"color:#9ECBFF\">        'myplugin'<\/span><span style=\"color:#E1E4E8\">,<\/span><\/span>\n<span class=\"line\"><span style=\"color:#79B8FF\">        array<\/span><span style=\"color:#E1E4E8\">(<\/span><\/span>\n<span class=\"line\"><span style=\"color:#9ECBFF\">            'label'<\/span><span style=\"color:#F97583\"> =><\/span><span style=\"color:#B392F0\"> __<\/span><span style=\"color:#E1E4E8\">( <\/span><span style=\"color:#9ECBFF\">'MyPlugin'<\/span><span style=\"color:#E1E4E8\">, <\/span><span style=\"color:#9ECBFF\">'myplugin-icons'<\/span><span style=\"color:#E1E4E8\"> ),<\/span><\/span>\n<span class=\"line\"><span style=\"color:#E1E4E8\">        )<\/span><\/span>\n<span class=\"line\"><span style=\"color:#E1E4E8\">    );<\/span><\/span>\n<span class=\"line\"><span style=\"color:#E1E4E8\">}<\/span><\/span><\/code><\/pre><\/div>\n\n\n\n<p>\u03a4\u03bf <code>myplugin<\/code> \u03b8\u03b1 \u03b1\u03c0\u03bf\u03c4\u03b5\u03bb\u03b5\u03af \u03c4\u03bf \u03c0\u03c1\u03cc\u03b8\u03b5\u03bc\u03b1 \u03cc\u03bb\u03c9\u03bd \u03c4\u03c9\u03bd icons, \u03cc\u03c0\u03c9\u03c2 <code>myplugin\/heart<\/code> \u03ba\u03b1\u03b9 <code>myplugin\/star<\/code>. \u03a4\u03bf <code>label<\/code> \u03b5\u03bc\u03c6\u03b1\u03bd\u03af\u03b6\u03b5\u03c4\u03b1\u03b9 \u03c9\u03c2 \u03c4\u03af\u03c4\u03bb\u03bf\u03c2 \u03b5\u03bd\u03cc\u03c4\u03b7\u03c4\u03b1\u03c2 \u03c3\u03c4\u03bf\u03bd picker. \u0395\u03bd\u03b5\u03c1\u03b3\u03bf\u03c0\u03bf\u03b9\u03ae\u03c3\u03c4\u03b5 \u03c4\u03bf plugin \u03b1\u03c0\u03cc \u03c4\u03bf \u00abPlugins \u2192 Installed Plugins\u00bb\u00b7 \u03c3\u03b5 \u03b1\u03c5\u03c4\u03cc \u03c4\u03bf \u03c3\u03c4\u03ac\u03b4\u03b9\u03bf \u03b4\u03b5\u03bd \u03b8\u03b1 \u03b4\u03b5\u03af\u03c4\u03b5 \u03ba\u03ac\u03c4\u03b9, \u03b5\u03c0\u03b5\u03b9\u03b4\u03ae \u03bc\u03b9\u03b1 \u03ba\u03b5\u03bd\u03ae \u03c3\u03c5\u03bb\u03bb\u03bf\u03b3\u03ae \u03b4\u03b5\u03bd \u03b1\u03c0\u03bf\u03b4\u03af\u03b4\u03b5\u03b9 \u03c0\u03b5\u03c1\u03b9\u03b5\u03c7\u03cc\u03bc\u03b5\u03bd\u03bf.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\">\u0394\u03b7\u03bb\u03ce\u03c3\u03c4\u03b5 icons \u03bc\u03b5 inline SVG \u03ba\u03b1\u03b9 \u03b1\u03c0\u03cc \u03b1\u03c1\u03c7\u03b5\u03af\u03b1<\/h2>\n\n\n\n<h3 class=\"wp-block-heading\">\u039f\u03c1\u03af\u03c3\u03c4\u03b5 \u03ad\u03bd\u03b1 inline icon \u03bc\u03b5 content<\/h3>\n\n\n\n<p>\u039a\u03c1\u03b1\u03c4\u03ae\u03c3\u03c4\u03b5 \u03ad\u03bd\u03b1 \u03b1\u03c0\u03bb\u03cc SVG \u03b1\u03c0\u03b5\u03c5\u03b8\u03b5\u03af\u03b1\u03c2 \u03c3\u03c4\u03b7\u03bd PHP \u03cc\u03c4\u03b1\u03bd \u03b4\u03b5\u03bd \u03b8\u03ad\u03bb\u03b5\u03c4\u03b5 \u03b5\u03c0\u03b9\u03c0\u03bb\u03ad\u03bf\u03bd \u03b1\u03c1\u03c7\u03b5\u03af\u03b1 \u03b3\u03b9\u03b1 \u03ad\u03bd\u03b1 \u03ae \u03b4\u03cd\u03bf icons. \u03a3\u03c5\u03bd\u03b4\u03ad\u03c3\u03c4\u03b5 \u03c4\u03b7 \u03c3\u03c5\u03bd\u03ac\u03c1\u03c4\u03b7\u03c3\u03b7 \u03c3\u03c4\u03bf <code>init<\/code> \u03bc\u03b5 \u03c0\u03c1\u03bf\u03c4\u03b5\u03c1\u03b1\u03b9\u03cc\u03c4\u03b7\u03c4\u03b1 <code>20<\/code>, \u03ce\u03c3\u03c4\u03b5 \u03bd\u03b1 \u03b5\u03ba\u03c4\u03b5\u03bb\u03b5\u03c3\u03c4\u03b5\u03af \u03bc\u03b5\u03c4\u03ac \u03c4\u03b7\u03bd \u03ba\u03b1\u03c4\u03b1\u03c7\u03ce\u03c1\u03b9\u03c3\u03b7 \u03c4\u03b7\u03c2 \u03c3\u03c5\u03bb\u03bb\u03bf\u03b3\u03ae\u03c2, \u03c0\u03bf\u03c5 \u03c7\u03c1\u03b7\u03c3\u03b9\u03bc\u03bf\u03c0\u03bf\u03b9\u03b5\u03af \u03c4\u03b7\u03bd \u03c0\u03c1\u03bf\u03b5\u03c0\u03b9\u03bb\u03b5\u03b3\u03bc\u03ad\u03bd\u03b7 \u03c0\u03c1\u03bf\u03c4\u03b5\u03c1\u03b1\u03b9\u03cc\u03c4\u03b7\u03c4\u03b1 <code>10<\/code>.<\/p>\n\n\n\n<div class=\"wp-block-kevinbatdorf-code-block-pro\" data-code-block-pro-font-family=\"Code-Pro-JetBrains-Mono\" style=\"font-size:.875rem;font-family:Code-Pro-JetBrains-Mono,ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;line-height:1.25rem;--cbp-tab-width:2;tab-size:var(--cbp-tab-width, 2)\"><span style=\"display:block;padding:16px 0 0 16px;margin-bottom:-1px;width:100%;text-align:left;background-color:#24292e\"><svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"54\" height=\"14\" viewBox=\"0 0 54 14\"><g fill=\"none\" fill-rule=\"evenodd\" transform=\"translate(1 1)\"><circle cx=\"6\" cy=\"6\" r=\"6\" fill=\"#FF5F56\" stroke=\"#E0443E\" stroke-width=\".5\"><\/circle><circle cx=\"26\" cy=\"6\" r=\"6\" fill=\"#FFBD2E\" stroke=\"#DEA123\" stroke-width=\".5\"><\/circle><circle cx=\"46\" cy=\"6\" r=\"6\" fill=\"#27C93F\" stroke=\"#1AAB29\" stroke-width=\".5\"><\/circle><\/g><\/svg><\/span><span role=\"button\" tabindex=\"0\" style=\"color:#e1e4e8;display:none\" aria-label=\"Copy\" class=\"code-block-pro-copy-button\"><pre class=\"code-block-pro-copy-button-pre\" aria-hidden=\"true\"><textarea class=\"code-block-pro-copy-button-textarea\" tabindex=\"-1\" aria-hidden=\"true\" readonly>add_action( 'init', 'myplugin_register_inline_icons', 20 );\n\nfunction myplugin_register_inline_icons() {\n    wp_register_icon(\n        'myplugin\/heart',\n        array(\n            'label'   =&gt; __( 'Heart', 'myplugin-icons' ),\n            'content' =&gt; '&lt;svg xmlns=&quot;http:\/\/www.w3.org\/2000\/svg&quot; viewBox=&quot;0 0 24 24&quot; fill=&quot;none&quot; stroke=&quot;currentColor&quot; stroke-width=&quot;2&quot; stroke-linecap=&quot;round&quot; stroke-linejoin=&quot;round&quot;&gt;&lt;path d=&quot;M20.84 4.61a5.5 5.5 0 0 0-7.78 0L12 5.67l-1.06-1.06a5.5 5.5 0 0 0-7.78 7.78l1.06 1.06L12 21.23l7.78-7.78 1.06-1.06a5.5 5.5 0 0 0 0-7.78z&quot;\/&gt;&lt;\/svg&gt;',\n        )\n    );\n}\n<\/textarea><\/pre><svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" style=\"width:24px;height:24px\" fill=\"none\" viewBox=\"0 0 24 24\" stroke=\"currentColor\" stroke-width=\"2\"><path class=\"with-check\" stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2m-6 9l2 2 4-4\"><\/path><path class=\"without-check\" stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2\"><\/path><\/svg><\/span><pre class=\"shiki github-dark\" style=\"background-color:#24292e;color:#e1e4e8\" tabindex=\"0\"><code><span class=\"line\"><span style=\"color:#B392F0\">add_action<\/span><span style=\"color:#E1E4E8\">( <\/span><span style=\"color:#9ECBFF\">'init'<\/span><span style=\"color:#E1E4E8\">, <\/span><span style=\"color:#9ECBFF\">'myplugin_register_inline_icons'<\/span><span style=\"color:#E1E4E8\">, <\/span><span style=\"color:#79B8FF\">20<\/span><span style=\"color:#E1E4E8\"> );<\/span><\/span>\n<span class=\"line\"><\/span>\n<span class=\"line\"><span style=\"color:#F97583\">function<\/span><span style=\"color:#B392F0\"> myplugin_register_inline_icons<\/span><span style=\"color:#E1E4E8\">() {<\/span><\/span>\n<span class=\"line\"><span style=\"color:#B392F0\">    wp_register_icon<\/span><span style=\"color:#E1E4E8\">(<\/span><\/span>\n<span class=\"line\"><span style=\"color:#9ECBFF\">        'myplugin\/heart'<\/span><span style=\"color:#E1E4E8\">,<\/span><\/span>\n<span class=\"line\"><span style=\"color:#79B8FF\">        array<\/span><span style=\"color:#E1E4E8\">(<\/span><\/span>\n<span class=\"line\"><span style=\"color:#9ECBFF\">            'label'<\/span><span style=\"color:#F97583\">   =><\/span><span style=\"color:#B392F0\"> __<\/span><span style=\"color:#E1E4E8\">( <\/span><span style=\"color:#9ECBFF\">'Heart'<\/span><span style=\"color:#E1E4E8\">, <\/span><span style=\"color:#9ECBFF\">'myplugin-icons'<\/span><span style=\"color:#E1E4E8\"> ),<\/span><\/span>\n<span class=\"line\"><span style=\"color:#9ECBFF\">            'content'<\/span><span style=\"color:#F97583\"> =><\/span><span style=\"color:#9ECBFF\"> '&#x3C;svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\">&#x3C;path d=\"M20.84 4.61a5.5 5.5 0 0 0-7.78 0L12 5.67l-1.06-1.06a5.5 5.5 0 0 0-7.78 7.78l1.06 1.06L12 21.23l7.78-7.78 1.06-1.06a5.5 5.5 0 0 0 0-7.78z\"\/>&#x3C;\/svg>'<\/span><span style=\"color:#E1E4E8\">,<\/span><\/span>\n<span class=\"line\"><span style=\"color:#E1E4E8\">        )<\/span><\/span>\n<span class=\"line\"><span style=\"color:#E1E4E8\">    );<\/span><\/span>\n<span class=\"line\"><span style=\"color:#E1E4E8\">}<\/span><\/span><\/code><\/pre><\/div>\n\n\n\n<p>\u03a4\u03bf \u03cc\u03bd\u03bf\u03bc\u03b1 \u03b1\u03ba\u03bf\u03bb\u03bf\u03c5\u03b8\u03b5\u03af \u03c4\u03bf \u03bc\u03bf\u03c4\u03af\u03b2\u03bf <code>collection\/icon-slug<\/code> \u03ba\u03b1\u03b9 \u03c4\u03bf <code>label<\/code> \u03b5\u03bc\u03c6\u03b1\u03bd\u03af\u03b6\u03b5\u03c4\u03b1\u03b9 \u03c3\u03c4\u03bf\u03bd picker. \u03a4\u03bf <code>stroke=&quot;currentColor&quot;<\/code> \u03b5\u03c0\u03b9\u03c4\u03c1\u03ad\u03c0\u03b5\u03b9 \u03c3\u03c4\u03bf SVG \u03bd\u03b1 \u03ba\u03bb\u03b7\u03c1\u03bf\u03bd\u03bf\u03bc\u03b5\u03af \u03c4\u03bf \u03c7\u03c1\u03ce\u03bc\u03b1 \u03c4\u03bf\u03c5 \u03b3\u03cd\u03c1\u03c9 \u03ba\u03b5\u03b9\u03bc\u03ad\u03bd\u03bf\u03c5, \u03c7\u03c9\u03c1\u03af\u03c2 \u03c3\u03c4\u03b1\u03b8\u03b5\u03c1\u03cc \u03c7\u03c1\u03ce\u03bc\u03b1 \u03bc\u03ad\u03c3\u03b1 \u03c3\u03c4\u03bf \u03b1\u03c1\u03c7\u03b5\u03af\u03bf.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\">\u03a6\u03bf\u03c1\u03c4\u03ce\u03c3\u03c4\u03b5 icons \u03b1\u03c0\u03cc \u03b1\u03c1\u03c7\u03b5\u03af\u03b1 SVG<\/h3>\n\n\n\n<p>\u0391\u03c0\u03bf\u03b8\u03b7\u03ba\u03b5\u03cd\u03c3\u03c4\u03b5 \u03c4\u03b1 \u03b5\u03c0\u03cc\u03bc\u03b5\u03bd\u03b1 \u03b1\u03c1\u03c7\u03b5\u03af\u03b1 \u03c3\u03c4\u03bf\u03bd \u03c6\u03ac\u03ba\u03b5\u03bb\u03bf <code>icons\/<\/code>. \u0393\u03b9\u03b1 icons \u03c0\u03bf\u03c5 \u03b2\u03c1\u03af\u03c3\u03ba\u03bf\u03bd\u03c4\u03b1\u03b9 \u03c3\u03c4\u03bf\u03bd \u03b4\u03af\u03c3\u03ba\u03bf, \u03c7\u03c1\u03b7\u03c3\u03b9\u03bc\u03bf\u03c0\u03bf\u03b9\u03ae\u03c3\u03c4\u03b5 \u03c4\u03bf <code>file_path<\/code> \u03b1\u03bd\u03c4\u03af \u03b3\u03b9\u03b1 \u03c4\u03bf <code>content<\/code>. \u03a4\u03bf WordPress \u03b4\u03b9\u03b1\u03b2\u03ac\u03b6\u03b5\u03b9 \u03c4\u03bf \u03b1\u03c1\u03c7\u03b5\u03af\u03bf \u03cc\u03c4\u03b1\u03bd \u03c4\u03bf \u03c7\u03c1\u03b5\u03b9\u03ac\u03b6\u03b5\u03c4\u03b1\u03b9.<\/p>\n\n\n\n<div class=\"wp-block-kevinbatdorf-code-block-pro\" data-code-block-pro-font-family=\"Code-Pro-JetBrains-Mono\" style=\"font-size:.875rem;font-family:Code-Pro-JetBrains-Mono,ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;line-height:1.25rem;--cbp-tab-width:2;tab-size:var(--cbp-tab-width, 2)\"><span style=\"display:block;padding:16px 0 0 16px;margin-bottom:-1px;width:100%;text-align:left;background-color:#24292e\"><svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"54\" height=\"14\" viewBox=\"0 0 54 14\"><g fill=\"none\" fill-rule=\"evenodd\" transform=\"translate(1 1)\"><circle cx=\"6\" cy=\"6\" r=\"6\" fill=\"#FF5F56\" stroke=\"#E0443E\" stroke-width=\".5\"><\/circle><circle cx=\"26\" cy=\"6\" r=\"6\" fill=\"#FFBD2E\" stroke=\"#DEA123\" stroke-width=\".5\"><\/circle><circle cx=\"46\" cy=\"6\" r=\"6\" fill=\"#27C93F\" stroke=\"#1AAB29\" stroke-width=\".5\"><\/circle><\/g><\/svg><\/span><span role=\"button\" tabindex=\"0\" style=\"color:#e1e4e8;display:none\" aria-label=\"Copy\" class=\"code-block-pro-copy-button\"><pre class=\"code-block-pro-copy-button-pre\" aria-hidden=\"true\"><textarea class=\"code-block-pro-copy-button-textarea\" tabindex=\"-1\" aria-hidden=\"true\" readonly>&lt;svg xmlns=&quot;http:\/\/www.w3.org\/2000\/svg&quot; viewBox=&quot;0 0 24 24&quot; fill=&quot;none&quot; stroke=&quot;currentColor&quot; stroke-width=&quot;2&quot; stroke-linecap=&quot;round&quot; stroke-linejoin=&quot;round&quot;&gt;\n    &lt;polygon points=&quot;12 2 15.09 8.26 22 9.27 17 14.14 18.18 21.02 12 17.77 5.82 21.02 7 14.14 2 9.27 8.91 8.26 12 2&quot;\/&gt;\n&lt;\/svg&gt;\n<\/textarea><\/pre><svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" style=\"width:24px;height:24px\" fill=\"none\" viewBox=\"0 0 24 24\" stroke=\"currentColor\" stroke-width=\"2\"><path class=\"with-check\" stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2m-6 9l2 2 4-4\"><\/path><path class=\"without-check\" stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2\"><\/path><\/svg><\/span><pre class=\"shiki github-dark\" style=\"background-color:#24292e;color:#e1e4e8\" tabindex=\"0\"><code><span class=\"line\"><span style=\"color:#E1E4E8\">&#x3C;<\/span><span style=\"color:#85E89D\">svg<\/span><span style=\"color:#B392F0\"> xmlns<\/span><span style=\"color:#E1E4E8\">=<\/span><span style=\"color:#9ECBFF\">\"http:\/\/www.w3.org\/2000\/svg\"<\/span><span style=\"color:#B392F0\"> viewBox<\/span><span style=\"color:#E1E4E8\">=<\/span><span style=\"color:#9ECBFF\">\"0 0 24 24\"<\/span><span style=\"color:#B392F0\"> fill<\/span><span style=\"color:#E1E4E8\">=<\/span><span style=\"color:#9ECBFF\">\"none\"<\/span><span style=\"color:#B392F0\"> stroke<\/span><span style=\"color:#E1E4E8\">=<\/span><span style=\"color:#9ECBFF\">\"currentColor\"<\/span><span style=\"color:#B392F0\"> stroke-width<\/span><span style=\"color:#E1E4E8\">=<\/span><span style=\"color:#9ECBFF\">\"2\"<\/span><span style=\"color:#B392F0\"> stroke-linecap<\/span><span style=\"color:#E1E4E8\">=<\/span><span style=\"color:#9ECBFF\">\"round\"<\/span><span style=\"color:#B392F0\"> stroke-linejoin<\/span><span style=\"color:#E1E4E8\">=<\/span><span style=\"color:#9ECBFF\">\"round\"<\/span><span style=\"color:#E1E4E8\">><\/span><\/span>\n<span class=\"line\"><span style=\"color:#E1E4E8\">    &#x3C;<\/span><span style=\"color:#85E89D\">polygon<\/span><span style=\"color:#B392F0\"> points<\/span><span style=\"color:#E1E4E8\">=<\/span><span style=\"color:#9ECBFF\">\"12 2 15.09 8.26 22 9.27 17 14.14 18.18 21.02 12 17.77 5.82 21.02 7 14.14 2 9.27 8.91 8.26 12 2\"<\/span><span style=\"color:#E1E4E8\">\/><\/span><\/span>\n<span class=\"line\"><span style=\"color:#E1E4E8\">&#x3C;\/<\/span><span style=\"color:#85E89D\">svg<\/span><span style=\"color:#E1E4E8\">><\/span><\/span><\/code><\/pre><\/div>\n\n\n\n<div class=\"wp-block-kevinbatdorf-code-block-pro\" data-code-block-pro-font-family=\"Code-Pro-JetBrains-Mono\" style=\"font-size:.875rem;font-family:Code-Pro-JetBrains-Mono,ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;line-height:1.25rem;--cbp-tab-width:2;tab-size:var(--cbp-tab-width, 2)\"><span style=\"display:block;padding:16px 0 0 16px;margin-bottom:-1px;width:100%;text-align:left;background-color:#24292e\"><svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"54\" height=\"14\" viewBox=\"0 0 54 14\"><g fill=\"none\" fill-rule=\"evenodd\" transform=\"translate(1 1)\"><circle cx=\"6\" cy=\"6\" r=\"6\" fill=\"#FF5F56\" stroke=\"#E0443E\" stroke-width=\".5\"><\/circle><circle cx=\"26\" cy=\"6\" r=\"6\" fill=\"#FFBD2E\" stroke=\"#DEA123\" stroke-width=\".5\"><\/circle><circle cx=\"46\" cy=\"6\" r=\"6\" fill=\"#27C93F\" stroke=\"#1AAB29\" stroke-width=\".5\"><\/circle><\/g><\/svg><\/span><span role=\"button\" tabindex=\"0\" style=\"color:#e1e4e8;display:none\" aria-label=\"Copy\" class=\"code-block-pro-copy-button\"><pre class=\"code-block-pro-copy-button-pre\" aria-hidden=\"true\"><textarea class=\"code-block-pro-copy-button-textarea\" tabindex=\"-1\" aria-hidden=\"true\" readonly>&lt;svg xmlns=&quot;http:\/\/www.w3.org\/2000\/svg&quot; viewBox=&quot;0 0 24 24&quot; fill=&quot;none&quot; stroke=&quot;currentColor&quot; stroke-width=&quot;2&quot; stroke-linecap=&quot;round&quot; stroke-linejoin=&quot;round&quot;&gt;\n    &lt;path d=&quot;M19 21l-7-5-7 5V5a2 2 0 0 1 2-2h10a2 2 0 0 1 2 2z&quot;\/&gt;\n&lt;\/svg&gt;\n<\/textarea><\/pre><svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" style=\"width:24px;height:24px\" fill=\"none\" viewBox=\"0 0 24 24\" stroke=\"currentColor\" stroke-width=\"2\"><path class=\"with-check\" stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2m-6 9l2 2 4-4\"><\/path><path class=\"without-check\" stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2\"><\/path><\/svg><\/span><pre class=\"shiki github-dark\" style=\"background-color:#24292e;color:#e1e4e8\" tabindex=\"0\"><code><span class=\"line\"><span style=\"color:#E1E4E8\">&#x3C;<\/span><span style=\"color:#85E89D\">svg<\/span><span style=\"color:#B392F0\"> xmlns<\/span><span style=\"color:#E1E4E8\">=<\/span><span style=\"color:#9ECBFF\">\"http:\/\/www.w3.org\/2000\/svg\"<\/span><span style=\"color:#B392F0\"> viewBox<\/span><span style=\"color:#E1E4E8\">=<\/span><span style=\"color:#9ECBFF\">\"0 0 24 24\"<\/span><span style=\"color:#B392F0\"> fill<\/span><span style=\"color:#E1E4E8\">=<\/span><span style=\"color:#9ECBFF\">\"none\"<\/span><span style=\"color:#B392F0\"> stroke<\/span><span style=\"color:#E1E4E8\">=<\/span><span style=\"color:#9ECBFF\">\"currentColor\"<\/span><span style=\"color:#B392F0\"> stroke-width<\/span><span style=\"color:#E1E4E8\">=<\/span><span style=\"color:#9ECBFF\">\"2\"<\/span><span style=\"color:#B392F0\"> stroke-linecap<\/span><span style=\"color:#E1E4E8\">=<\/span><span style=\"color:#9ECBFF\">\"round\"<\/span><span style=\"color:#B392F0\"> stroke-linejoin<\/span><span style=\"color:#E1E4E8\">=<\/span><span style=\"color:#9ECBFF\">\"round\"<\/span><span style=\"color:#E1E4E8\">><\/span><\/span>\n<span class=\"line\"><span style=\"color:#E1E4E8\">    &#x3C;<\/span><span style=\"color:#85E89D\">path<\/span><span style=\"color:#B392F0\"> d<\/span><span style=\"color:#E1E4E8\">=<\/span><span style=\"color:#9ECBFF\">\"M19 21l-7-5-7 5V5a2 2 0 0 1 2-2h10a2 2 0 0 1 2 2z\"<\/span><span style=\"color:#E1E4E8\">\/><\/span><\/span>\n<span class=\"line\"><span style=\"color:#E1E4E8\">&#x3C;\/<\/span><span style=\"color:#85E89D\">svg<\/span><span style=\"color:#E1E4E8\">><\/span><\/span><\/code><\/pre><\/div>\n\n\n\n<div class=\"wp-block-kevinbatdorf-code-block-pro\" data-code-block-pro-font-family=\"Code-Pro-JetBrains-Mono\" style=\"font-size:.875rem;font-family:Code-Pro-JetBrains-Mono,ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;line-height:1.25rem;--cbp-tab-width:2;tab-size:var(--cbp-tab-width, 2)\"><span style=\"display:block;padding:16px 0 0 16px;margin-bottom:-1px;width:100%;text-align:left;background-color:#24292e\"><svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"54\" height=\"14\" viewBox=\"0 0 54 14\"><g fill=\"none\" fill-rule=\"evenodd\" transform=\"translate(1 1)\"><circle cx=\"6\" cy=\"6\" r=\"6\" fill=\"#FF5F56\" stroke=\"#E0443E\" stroke-width=\".5\"><\/circle><circle cx=\"26\" cy=\"6\" r=\"6\" fill=\"#FFBD2E\" stroke=\"#DEA123\" stroke-width=\".5\"><\/circle><circle cx=\"46\" cy=\"6\" r=\"6\" fill=\"#27C93F\" stroke=\"#1AAB29\" stroke-width=\".5\"><\/circle><\/g><\/svg><\/span><span role=\"button\" tabindex=\"0\" style=\"color:#e1e4e8;display:none\" aria-label=\"Copy\" class=\"code-block-pro-copy-button\"><pre class=\"code-block-pro-copy-button-pre\" aria-hidden=\"true\"><textarea class=\"code-block-pro-copy-button-textarea\" tabindex=\"-1\" aria-hidden=\"true\" readonly>add_action( 'init', 'myplugin_register_file_icons', 20 );\n\nfunction myplugin_register_file_icons() {\n    wp_register_icon(\n        'myplugin\/star',\n        array(\n            'label'     =&gt; __( 'Star', 'myplugin-icons' ),\n            'file_path' =&gt; MYPLUGIN_ICONS_PATH . 'icons\/star.svg',\n        )\n    );\n\n    wp_register_icon(\n        'myplugin\/bookmark',\n        array(\n            'label'     =&gt; __( 'Bookmark', 'myplugin-icons' ),\n            'file_path' =&gt; MYPLUGIN_ICONS_PATH . 'icons\/bookmark.svg',\n        )\n    );\n}\n<\/textarea><\/pre><svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" style=\"width:24px;height:24px\" fill=\"none\" viewBox=\"0 0 24 24\" stroke=\"currentColor\" stroke-width=\"2\"><path class=\"with-check\" stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2m-6 9l2 2 4-4\"><\/path><path class=\"without-check\" stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2\"><\/path><\/svg><\/span><pre class=\"shiki github-dark\" style=\"background-color:#24292e;color:#e1e4e8\" tabindex=\"0\"><code><span class=\"line\"><span style=\"color:#B392F0\">add_action<\/span><span style=\"color:#E1E4E8\">( <\/span><span style=\"color:#9ECBFF\">'init'<\/span><span style=\"color:#E1E4E8\">, <\/span><span style=\"color:#9ECBFF\">'myplugin_register_file_icons'<\/span><span style=\"color:#E1E4E8\">, <\/span><span style=\"color:#79B8FF\">20<\/span><span style=\"color:#E1E4E8\"> );<\/span><\/span>\n<span class=\"line\"><\/span>\n<span class=\"line\"><span style=\"color:#F97583\">function<\/span><span style=\"color:#B392F0\"> myplugin_register_file_icons<\/span><span style=\"color:#E1E4E8\">() {<\/span><\/span>\n<span class=\"line\"><span style=\"color:#B392F0\">    wp_register_icon<\/span><span style=\"color:#E1E4E8\">(<\/span><\/span>\n<span class=\"line\"><span style=\"color:#9ECBFF\">        'myplugin\/star'<\/span><span style=\"color:#E1E4E8\">,<\/span><\/span>\n<span class=\"line\"><span style=\"color:#79B8FF\">        array<\/span><span style=\"color:#E1E4E8\">(<\/span><\/span>\n<span class=\"line\"><span style=\"color:#9ECBFF\">            'label'<\/span><span style=\"color:#F97583\">     =><\/span><span style=\"color:#B392F0\"> __<\/span><span style=\"color:#E1E4E8\">( <\/span><span style=\"color:#9ECBFF\">'Star'<\/span><span style=\"color:#E1E4E8\">, <\/span><span style=\"color:#9ECBFF\">'myplugin-icons'<\/span><span style=\"color:#E1E4E8\"> ),<\/span><\/span>\n<span class=\"line\"><span style=\"color:#9ECBFF\">            'file_path'<\/span><span style=\"color:#F97583\"> =><\/span><span style=\"color:#79B8FF\"> MYPLUGIN_ICONS_PATH<\/span><span style=\"color:#F97583\"> .<\/span><span style=\"color:#9ECBFF\"> 'icons\/star.svg'<\/span><span style=\"color:#E1E4E8\">,<\/span><\/span>\n<span class=\"line\"><span style=\"color:#E1E4E8\">        )<\/span><\/span>\n<span class=\"line\"><span style=\"color:#E1E4E8\">    );<\/span><\/span>\n<span class=\"line\"><\/span>\n<span class=\"line\"><span style=\"color:#B392F0\">    wp_register_icon<\/span><span style=\"color:#E1E4E8\">(<\/span><\/span>\n<span class=\"line\"><span style=\"color:#9ECBFF\">        'myplugin\/bookmark'<\/span><span style=\"color:#E1E4E8\">,<\/span><\/span>\n<span class=\"line\"><span style=\"color:#79B8FF\">        array<\/span><span style=\"color:#E1E4E8\">(<\/span><\/span>\n<span class=\"line\"><span style=\"color:#9ECBFF\">            'label'<\/span><span style=\"color:#F97583\">     =><\/span><span style=\"color:#B392F0\"> __<\/span><span style=\"color:#E1E4E8\">( <\/span><span style=\"color:#9ECBFF\">'Bookmark'<\/span><span style=\"color:#E1E4E8\">, <\/span><span style=\"color:#9ECBFF\">'myplugin-icons'<\/span><span style=\"color:#E1E4E8\"> ),<\/span><\/span>\n<span class=\"line\"><span style=\"color:#9ECBFF\">            'file_path'<\/span><span style=\"color:#F97583\"> =><\/span><span style=\"color:#79B8FF\"> MYPLUGIN_ICONS_PATH<\/span><span style=\"color:#F97583\"> .<\/span><span style=\"color:#9ECBFF\"> 'icons\/bookmark.svg'<\/span><span style=\"color:#E1E4E8\">,<\/span><\/span>\n<span class=\"line\"><span style=\"color:#E1E4E8\">        )<\/span><\/span>\n<span class=\"line\"><span style=\"color:#E1E4E8\">    );<\/span><\/span>\n<span class=\"line\"><span style=\"color:#E1E4E8\">}<\/span><\/span><\/code><\/pre><\/div>\n\n\n\n<p>\u0391\u03bd\u03bf\u03af\u03be\u03c4\u03b5 \u03c4\u03bf block <code>core\/icon<\/code> \u03c3\u03c4\u03bf\u03bd editor. \u039f picker \u03b5\u03bc\u03c6\u03b1\u03bd\u03af\u03b6\u03b5\u03b9 \u03b5\u03bd\u03cc\u03c4\u03b7\u03c4\u03b1 \u00abMyPlugin\u00bb \u03bc\u03b5 \u03c4\u03b1 Heart, Star \u03ba\u03b1\u03b9 Bookmark, \u03b1\u03c0\u03cc \u03cc\u03c0\u03bf\u03c5 \u03bc\u03c0\u03bf\u03c1\u03b5\u03af\u03c4\u03b5 \u03bd\u03b1 \u03b5\u03b9\u03c3\u03b1\u03b3\u03ac\u03b3\u03b5\u03c4\u03b5 \u03ba\u03b1\u03b8\u03ad\u03bd\u03b1 \u03c3\u03c4\u03bf \u03c0\u03b5\u03c1\u03b9\u03b5\u03c7\u03cc\u03bc\u03b5\u03bd\u03bf. \u0391\u03bd \u03bb\u03b5\u03af\u03c0\u03b5\u03b9 \u03ba\u03ac\u03c0\u03bf\u03b9\u03bf icon, \u03b5\u03bb\u03ad\u03b3\u03be\u03c4\u03b5 \u03c0\u03c1\u03ce\u03c4\u03b1 \u03c4\u03b7 \u03c3\u03b5\u03b9\u03c1\u03ac \u03c4\u03c9\u03bd hooks: \u03b4\u03b7\u03bb\u03ce\u03c3\u03c4\u03b5 \u03c4\u03b7 \u03c3\u03c5\u03bb\u03bb\u03bf\u03b3\u03ae \u03c3\u03c4\u03b7\u03bd \u03c0\u03c1\u03bf\u03b5\u03c0\u03b9\u03bb\u03b5\u03b3\u03bc\u03ad\u03bd\u03b7 \u03c0\u03c1\u03bf\u03c4\u03b5\u03c1\u03b1\u03b9\u03cc\u03c4\u03b7\u03c4\u03b1 \u03ba\u03b1\u03b9 \u03c4\u03b1 icons \u03b1\u03c1\u03b3\u03cc\u03c4\u03b5\u03c1\u03b1, \u03b3\u03b9\u03b1 \u03c0\u03b1\u03c1\u03ac\u03b4\u03b5\u03b9\u03b3\u03bc\u03b1 \u03c3\u03c4\u03b7\u03bd <code>20<\/code>.<\/p>\n\n\n\n<figure class=\"wp-block-image size-large\"><img loading=\"lazy\" decoding=\"async\" width=\"1712\" height=\"602\" src=\"https:\/\/helloblog.io\/app\/uploads\/sites\/12\/2026\/08\/custom-icons-added-tab-in-wordpress.webp\" alt=\"\u039f picker \u03c4\u03bf\u03c5 block icon \u03bc\u03b5 \u03c0\u03c1\u03bf\u03c3\u03c4\u03b9\u03b8\u03ad\u03bc\u03b5\u03bd\u03b1 custom icons\" class=\"wp-image-257\" srcset=\"https:\/\/helloblog.io\/app\/uploads\/sites\/12\/2026\/08\/custom-icons-added-tab-in-wordpress.webp 1712w, https:\/\/helloblog.io\/app\/uploads\/sites\/12\/2026\/08\/custom-icons-added-tab-in-wordpress-300x105.webp 300w, https:\/\/helloblog.io\/app\/uploads\/sites\/12\/2026\/08\/custom-icons-added-tab-in-wordpress-1024x360.webp 1024w, https:\/\/helloblog.io\/app\/uploads\/sites\/12\/2026\/08\/custom-icons-added-tab-in-wordpress-768x270.webp 768w, https:\/\/helloblog.io\/app\/uploads\/sites\/12\/2026\/08\/custom-icons-added-tab-in-wordpress-1536x540.webp 1536w, https:\/\/helloblog.io\/app\/uploads\/sites\/12\/2026\/08\/custom-icons-added-tab-in-wordpress-400x141.webp 400w\" sizes=\"auto, (max-width: 1712px) 100vw, 1712px\" \/><figcaption class=\"wp-element-caption\">\u0397 \u03c3\u03c5\u03bb\u03bb\u03bf\u03b3\u03ae \u03b5\u03bc\u03c6\u03b1\u03bd\u03af\u03b6\u03b5\u03c4\u03b1\u03b9 \u03c9\u03c2 \u03be\u03b5\u03c7\u03c9\u03c1\u03b9\u03c3\u03c4\u03ae \u03b5\u03bd\u03cc\u03c4\u03b7\u03c4\u03b1 \u03c3\u03c4\u03bf\u03bd picker \u03c4\u03bf\u03c5 block <code>core\/icon<\/code>. \u2014 <em>Forr\u00e1s: WPVibes<\/em><\/figcaption><\/figure>\n\n\n\n<h2 class=\"wp-block-heading\">\u039a\u03b1\u03c4\u03b1\u03c7\u03c9\u03c1\u03af\u03c3\u03c4\u03b5 \u03b1\u03c5\u03c4\u03cc\u03bc\u03b1\u03c4\u03b1 \u03cc\u03bb\u03b1 \u03c4\u03b1 SVG \u03b5\u03bd\u03cc\u03c2 \u03c6\u03b1\u03ba\u03ad\u03bb\u03bf\u03c5<\/h2>\n\n\n\n<p>\u039f\u03b9 \u03bc\u03b5\u03bc\u03bf\u03bd\u03c9\u03bc\u03ad\u03bd\u03b5\u03c2 \u03ba\u03bb\u03ae\u03c3\u03b5\u03b9\u03c2 <code>wp_register_icon()<\/code> \u03b4\u03b5\u03bd \u03b5\u03be\u03c5\u03c0\u03b7\u03c1\u03b5\u03c4\u03bf\u03cd\u03bd \u03bc\u03b9\u03b1 \u03c0\u03c1\u03b1\u03b3\u03bc\u03b1\u03c4\u03b9\u03ba\u03ae \u03b2\u03b9\u03b2\u03bb\u03b9\u03bf\u03b8\u03ae\u03ba\u03b7 \u03bc\u03b5 \u03b4\u03b5\u03ba\u03ac\u03b4\u03b5\u03c2 icons. \u0391\u03bd\u03c4\u03b9\u03ba\u03b1\u03c4\u03b1\u03c3\u03c4\u03ae\u03c3\u03c4\u03b5 \u03c4\u03b7 <code>myplugin_register_file_icons()<\/code> \u03bc\u03b5 \u03c4\u03b7\u03bd \u03b5\u03c0\u03cc\u03bc\u03b5\u03bd\u03b7 \u03c3\u03c5\u03bd\u03ac\u03c1\u03c4\u03b7\u03c3\u03b7, \u03b7 \u03bf\u03c0\u03bf\u03af\u03b1 \u03b5\u03bd\u03c4\u03bf\u03c0\u03af\u03b6\u03b5\u03b9 \u03ba\u03ac\u03b8\u03b5 <code>.svg<\/code> \u03c3\u03c4\u03bf\u03bd \u03c6\u03ac\u03ba\u03b5\u03bb\u03bf \u03ba\u03b1\u03b9 \u03c4\u03bf \u03b4\u03b7\u03bb\u03ce\u03bd\u03b5\u03b9 \u03c3\u03c4\u03bf \u03b5\u03c0\u03cc\u03bc\u03b5\u03bd\u03bf request.<\/p>\n\n\n\n<div class=\"wp-block-kevinbatdorf-code-block-pro\" data-code-block-pro-font-family=\"Code-Pro-JetBrains-Mono\" style=\"font-size:.875rem;font-family:Code-Pro-JetBrains-Mono,ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;line-height:1.25rem;--cbp-tab-width:2;tab-size:var(--cbp-tab-width, 2)\"><span style=\"display:block;padding:16px 0 0 16px;margin-bottom:-1px;width:100%;text-align:left;background-color:#24292e\"><svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"54\" height=\"14\" viewBox=\"0 0 54 14\"><g fill=\"none\" fill-rule=\"evenodd\" transform=\"translate(1 1)\"><circle cx=\"6\" cy=\"6\" r=\"6\" fill=\"#FF5F56\" stroke=\"#E0443E\" stroke-width=\".5\"><\/circle><circle cx=\"26\" cy=\"6\" r=\"6\" fill=\"#FFBD2E\" stroke=\"#DEA123\" stroke-width=\".5\"><\/circle><circle cx=\"46\" cy=\"6\" r=\"6\" fill=\"#27C93F\" stroke=\"#1AAB29\" stroke-width=\".5\"><\/circle><\/g><\/svg><\/span><span role=\"button\" tabindex=\"0\" style=\"color:#e1e4e8;display:none\" aria-label=\"Copy\" class=\"code-block-pro-copy-button\"><pre class=\"code-block-pro-copy-button-pre\" aria-hidden=\"true\"><textarea class=\"code-block-pro-copy-button-textarea\" tabindex=\"-1\" aria-hidden=\"true\" readonly>add_action( 'init', 'myplugin_register_all_file_icons', 20 );\n\nfunction myplugin_register_all_file_icons() {\n    $icons_dir = MYPLUGIN_ICONS_PATH . 'icons\/';\n    $svg_files = glob( $icons_dir . '*.svg' );\n\n    if ( empty( $svg_files ) ) {\n        return;\n    }\n\n    foreach ( $svg_files as $file_path ) {\n        $slug  = basename( $file_path, '.svg' );\n        $label = ucwords( str_replace( '-', ' ', $slug ) );\n\n        wp_register_icon(\n            'myplugin\/' . $slug,\n            array(\n                'label'     =&gt; $label,\n                'file_path' =&gt; $file_path,\n            )\n        );\n    }\n}\n<\/textarea><\/pre><svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" style=\"width:24px;height:24px\" fill=\"none\" viewBox=\"0 0 24 24\" stroke=\"currentColor\" stroke-width=\"2\"><path class=\"with-check\" stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2m-6 9l2 2 4-4\"><\/path><path class=\"without-check\" stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2\"><\/path><\/svg><\/span><pre class=\"shiki github-dark\" style=\"background-color:#24292e;color:#e1e4e8\" tabindex=\"0\"><code><span class=\"line\"><span style=\"color:#B392F0\">add_action<\/span><span style=\"color:#E1E4E8\">( <\/span><span style=\"color:#9ECBFF\">'init'<\/span><span style=\"color:#E1E4E8\">, <\/span><span style=\"color:#9ECBFF\">'myplugin_register_all_file_icons'<\/span><span style=\"color:#E1E4E8\">, <\/span><span style=\"color:#79B8FF\">20<\/span><span style=\"color:#E1E4E8\"> );<\/span><\/span>\n<span class=\"line\"><\/span>\n<span class=\"line\"><span style=\"color:#F97583\">function<\/span><span style=\"color:#B392F0\"> myplugin_register_all_file_icons<\/span><span style=\"color:#E1E4E8\">() {<\/span><\/span>\n<span class=\"line\"><span style=\"color:#E1E4E8\">    $icons_dir <\/span><span style=\"color:#F97583\">=<\/span><span style=\"color:#79B8FF\"> MYPLUGIN_ICONS_PATH<\/span><span style=\"color:#F97583\"> .<\/span><span style=\"color:#9ECBFF\"> 'icons\/'<\/span><span style=\"color:#E1E4E8\">;<\/span><\/span>\n<span class=\"line\"><span style=\"color:#E1E4E8\">    $svg_files <\/span><span style=\"color:#F97583\">=<\/span><span style=\"color:#79B8FF\"> glob<\/span><span style=\"color:#E1E4E8\">( $icons_dir <\/span><span style=\"color:#F97583\">.<\/span><span style=\"color:#9ECBFF\"> '*.svg'<\/span><span style=\"color:#E1E4E8\"> );<\/span><\/span>\n<span class=\"line\"><\/span>\n<span class=\"line\"><span style=\"color:#F97583\">    if<\/span><span style=\"color:#E1E4E8\"> ( <\/span><span style=\"color:#79B8FF\">empty<\/span><span style=\"color:#E1E4E8\">( $svg_files ) ) {<\/span><\/span>\n<span class=\"line\"><span style=\"color:#F97583\">        return<\/span><span style=\"color:#E1E4E8\">;<\/span><\/span>\n<span class=\"line\"><span style=\"color:#E1E4E8\">    }<\/span><\/span>\n<span class=\"line\"><\/span>\n<span class=\"line\"><span style=\"color:#F97583\">    foreach<\/span><span style=\"color:#E1E4E8\"> ( $svg_files <\/span><span style=\"color:#F97583\">as<\/span><span style=\"color:#E1E4E8\"> $file_path ) {<\/span><\/span>\n<span class=\"line\"><span style=\"color:#E1E4E8\">        $slug  <\/span><span style=\"color:#F97583\">=<\/span><span style=\"color:#79B8FF\"> basename<\/span><span style=\"color:#E1E4E8\">( $file_path, <\/span><span style=\"color:#9ECBFF\">'.svg'<\/span><span style=\"color:#E1E4E8\"> );<\/span><\/span>\n<span class=\"line\"><span style=\"color:#E1E4E8\">        $label <\/span><span style=\"color:#F97583\">=<\/span><span style=\"color:#79B8FF\"> ucwords<\/span><span style=\"color:#E1E4E8\">( <\/span><span style=\"color:#79B8FF\">str_replace<\/span><span style=\"color:#E1E4E8\">( <\/span><span style=\"color:#9ECBFF\">'-'<\/span><span style=\"color:#E1E4E8\">, <\/span><span style=\"color:#9ECBFF\">' '<\/span><span style=\"color:#E1E4E8\">, $slug ) );<\/span><\/span>\n<span class=\"line\"><\/span>\n<span class=\"line\"><span style=\"color:#B392F0\">        wp_register_icon<\/span><span style=\"color:#E1E4E8\">(<\/span><\/span>\n<span class=\"line\"><span style=\"color:#9ECBFF\">            'myplugin\/'<\/span><span style=\"color:#F97583\"> .<\/span><span style=\"color:#E1E4E8\"> $slug,<\/span><\/span>\n<span class=\"line\"><span style=\"color:#79B8FF\">            array<\/span><span style=\"color:#E1E4E8\">(<\/span><\/span>\n<span class=\"line\"><span style=\"color:#9ECBFF\">                'label'<\/span><span style=\"color:#F97583\">     =><\/span><span style=\"color:#E1E4E8\"> $label,<\/span><\/span>\n<span class=\"line\"><span style=\"color:#9ECBFF\">                'file_path'<\/span><span style=\"color:#F97583\"> =><\/span><span style=\"color:#E1E4E8\"> $file_path,<\/span><\/span>\n<span class=\"line\"><span style=\"color:#E1E4E8\">            )<\/span><\/span>\n<span class=\"line\"><span style=\"color:#E1E4E8\">        );<\/span><\/span>\n<span class=\"line\"><span style=\"color:#E1E4E8\">    }<\/span><\/span>\n<span class=\"line\"><span style=\"color:#E1E4E8\">}<\/span><\/span><\/code><\/pre><\/div>\n\n\n\n<p>\u0397 <code>glob( $icons_dir . '*.svg' )<\/code> \u03b5\u03c0\u03b9\u03c3\u03c4\u03c1\u03ad\u03c6\u03b5\u03b9 \u03cc\u03bb\u03b1 \u03c4\u03b1 SVG \u03c4\u03bf\u03c5 \u03c6\u03b1\u03ba\u03ad\u03bb\u03bf\u03c5. \u0397 <code>basename( $file_path, '.svg' )<\/code> \u03b1\u03c6\u03b1\u03b9\u03c1\u03b5\u03af \u03c4\u03bf path \u03ba\u03b1\u03b9 \u03c4\u03b7\u03bd \u03b5\u03c0\u03ad\u03ba\u03c4\u03b1\u03c3\u03b7, \u03ac\u03c1\u03b1 \u03c4\u03bf <code>advanced-button.svg<\/code> \u03b3\u03af\u03bd\u03b5\u03c4\u03b1\u03b9 <code>advanced-button<\/code>. \u03a3\u03c4\u03b7 \u03c3\u03c5\u03bd\u03ad\u03c7\u03b5\u03b9\u03b1, \u03b7 <code>ucwords( str_replace( '-', ' ', $slug ) )<\/code> \u03c4\u03bf \u03bc\u03b5\u03c4\u03b1\u03c4\u03c1\u03ad\u03c0\u03b5\u03b9 \u03c3\u03b5 \u03b1\u03bd\u03b1\u03b3\u03bd\u03ce\u03c3\u03b9\u03bc\u03bf label \u00abAdvanced Button\u00bb.<\/p>\n\n\n\n<p>\u03a0\u03c1\u03bf\u03c3\u03b8\u03ad\u03c3\u03c4\u03b5 \u03bd\u03ad\u03bf SVG \u03c3\u03c4\u03bf\u03bd \u03c6\u03ac\u03ba\u03b5\u03bb\u03bf <code>icons\/<\/code> \u03ba\u03b1\u03b9 \u03b1\u03bd\u03b1\u03bd\u03b5\u03ce\u03c3\u03c4\u03b5 \u03c4\u03bf\u03bd editor. \u03a4\u03bf \u03bd\u03ad\u03bf icon \u03b8\u03b1 \u03b5\u03bc\u03c6\u03b1\u03bd\u03b9\u03c3\u03c4\u03b5\u03af \u03c3\u03c4\u03bf\u03bd picker \u03c7\u03c9\u03c1\u03af\u03c2 \u03bd\u03b1 \u03b1\u03bb\u03bb\u03ac\u03be\u03b5\u03c4\u03b5 PHP. \u03a4\u03bf \u03bc\u03bf\u03c4\u03af\u03b2\u03bf \u03bb\u03b5\u03b9\u03c4\u03bf\u03c5\u03c1\u03b3\u03b5\u03af \u03bc\u03b1\u03b6\u03af \u03bc\u03b5 inline icons: \u03bc\u03c0\u03bf\u03c1\u03b5\u03af\u03c4\u03b5 \u03bd\u03b1 \u03ba\u03c1\u03b1\u03c4\u03ae\u03c3\u03b5\u03c4\u03b5 \u03c4\u03bf heart inline \u03ba\u03b1\u03b9 \u03bd\u03b1 \u03b4\u03b7\u03bb\u03ce\u03bd\u03b5\u03c4\u03b5 \u03b1\u03c0\u03cc \u03c4\u03bf\u03bd \u03c6\u03ac\u03ba\u03b5\u03bb\u03bf \u03c4\u03bf star, \u03c4\u03bf bookmark \u03ba\u03b1\u03b9 \u03cc\u03c3\u03b1 \u03b5\u03c0\u03b9\u03c0\u03bb\u03ad\u03bf\u03bd icons \u03c0\u03c1\u03bf\u03c3\u03b8\u03ad\u03c3\u03b5\u03c4\u03b5.<\/p>\n\n\n\n<figure class=\"wp-block-image size-large\"><img loading=\"lazy\" decoding=\"async\" width=\"1207\" height=\"341\" src=\"https:\/\/helloblog.io\/app\/uploads\/sites\/12\/2026\/08\/multiple-custom-icons-added-wordpress.webp\" alt=\"\u03a0\u03bf\u03bb\u03bb\u03b1\u03c0\u03bb\u03ac custom SVG icons \u03c3\u03b5 \u03c3\u03c5\u03bb\u03bb\u03bf\u03b3\u03ae \u03c4\u03bf\u03c5 WordPress\" class=\"wp-image-258\" srcset=\"https:\/\/helloblog.io\/app\/uploads\/sites\/12\/2026\/08\/multiple-custom-icons-added-wordpress.webp 1207w, https:\/\/helloblog.io\/app\/uploads\/sites\/12\/2026\/08\/multiple-custom-icons-added-wordpress-300x85.webp 300w, https:\/\/helloblog.io\/app\/uploads\/sites\/12\/2026\/08\/multiple-custom-icons-added-wordpress-1024x289.webp 1024w, https:\/\/helloblog.io\/app\/uploads\/sites\/12\/2026\/08\/multiple-custom-icons-added-wordpress-768x217.webp 768w, https:\/\/helloblog.io\/app\/uploads\/sites\/12\/2026\/08\/multiple-custom-icons-added-wordpress-400x113.webp 400w\" sizes=\"auto, (max-width: 1207px) 100vw, 1207px\" \/><figcaption class=\"wp-element-caption\">\u0397 \u03bc\u03b1\u03b6\u03b9\u03ba\u03ae \u03ba\u03b1\u03c4\u03b1\u03c7\u03ce\u03c1\u03b9\u03c3\u03b7 \u03b5\u03c0\u03b9\u03c4\u03c1\u03ad\u03c0\u03b5\u03b9 \u03c3\u03b5 \u03ad\u03bd\u03b1\u03bd \u03c6\u03ac\u03ba\u03b5\u03bb\u03bf SVG \u03bd\u03b1 \u03c4\u03c1\u03bf\u03c6\u03bf\u03b4\u03bf\u03c4\u03b5\u03af \u03b1\u03c0\u03b5\u03c5\u03b8\u03b5\u03af\u03b1\u03c2 \u03c4\u03b7 \u03c3\u03c5\u03bb\u03bb\u03bf\u03b3\u03ae icons. \u2014 <em>Forr\u00e1s: WPVibes<\/em><\/figcaption><\/figure>\n\n\n\n<h2 class=\"wp-block-heading\">\u03a7\u03c1\u03b7\u03c3\u03b9\u03bc\u03bf\u03c0\u03bf\u03b9\u03ae\u03c3\u03c4\u03b5 \u03c4\u03b1 icons \u03c3\u03c4\u03bf\u03bd editor, \u03c3\u03b5 PHP \u03ba\u03b1\u03b9 \u03c3\u03b5 blocks<\/h2>\n\n\n\n<h3 class=\"wp-block-heading\">\u0395\u03b9\u03c3\u03b1\u03b3\u03ac\u03b3\u03b5\u03c4\u03ad \u03c4\u03b1 \u03bc\u03b5 \u03c4\u03bf block core\/icon<\/h3>\n\n\n\n<p>\u03a4\u03bf <code>core\/icon<\/code> \u03b5\u03bc\u03c6\u03b1\u03bd\u03af\u03b6\u03b5\u03b9 \u03b1\u03c5\u03c4\u03cc\u03bc\u03b1\u03c4\u03b1 \u03ba\u03ac\u03b8\u03b5 registered \u03c3\u03c5\u03bb\u03bb\u03bf\u03b3\u03ae. \u039f \u03c7\u03c1\u03ae\u03c3\u03c4\u03b7\u03c2 \u03b5\u03b9\u03c3\u03ac\u03b3\u03b5\u03b9 \u03c4\u03bf block, \u03b5\u03c0\u03b9\u03bb\u03ad\u03b3\u03b5\u03b9 \u03ad\u03bd\u03b1 icon \u03c4\u03b7\u03c2 \u03c3\u03c5\u03bb\u03bb\u03bf\u03b3\u03ae\u03c2 \u03ba\u03b1\u03b9 \u03c4\u03bf WordPress \u03c4\u03bf \u03b1\u03c0\u03bf\u03b4\u03af\u03b4\u03b5\u03b9 \u03c3\u03c4\u03bf frontend \u03c7\u03c9\u03c1\u03af\u03c2 \u03c0\u03c1\u03cc\u03c3\u03b8\u03b5\u03c4\u03bf \u03ba\u03ce\u03b4\u03b9\u03ba\u03b1.<\/p>\n\n\n\n<p>\u03a4\u03b1 icons \u03b4\u03b9\u03b1\u03c4\u03af\u03b8\u03b5\u03bd\u03c4\u03b1\u03b9 \u03b5\u03c0\u03af\u03c3\u03b7\u03c2 \u03c3\u03c4\u03bf REST endpoint <code>\/wp-json\/wp\/v2\/icons<\/code>, \u03b5\u03bd\u03ce \u03bf\u03b9 \u03c3\u03c5\u03bb\u03bb\u03bf\u03b3\u03ad\u03c2 \u03b5\u03ba\u03c4\u03af\u03b8\u03b5\u03bd\u03c4\u03b1\u03b9 \u03c3\u03c4\u03bf <code>\/wp-json\/wp\/v2\/icon-collections<\/code>. \u0388\u03c4\u03c3\u03b9 \u03bc\u03c0\u03bf\u03c1\u03bf\u03cd\u03bd \u03bd\u03b1 \u03c4\u03b1 \u03b4\u03b9\u03b1\u03b2\u03ac\u03c3\u03bf\u03c5\u03bd \u03b5\u03be\u03c9\u03c4\u03b5\u03c1\u03b9\u03ba\u03ac \u03b5\u03c1\u03b3\u03b1\u03bb\u03b5\u03af\u03b1 \u03c0\u03bf\u03c5 \u03b1\u03bd\u03c4\u03bb\u03bf\u03cd\u03bd \u03b4\u03b5\u03b4\u03bf\u03bc\u03ad\u03bd\u03b1 \u03b1\u03c0\u03cc \u03c4\u03bf WordPress.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\">\u0391\u03c0\u03bf\u03b4\u03ce\u03c3\u03c4\u03b5 SVG \u03c3\u03b5 PHP \u03bc\u03b5 wp_get_icon()<\/h3>\n\n\n\n<p>\u0397 <code>wp_get_icon()<\/code> \u03b5\u03c0\u03b9\u03c3\u03c4\u03c1\u03ad\u03c6\u03b5\u03b9 \u03c4\u03bf SVG \u03c9\u03c2 string, \u03b5\u03c0\u03bf\u03bc\u03ad\u03bd\u03c9\u03c2 \u03bc\u03c0\u03bf\u03c1\u03b5\u03af\u03c4\u03b5 \u03bd\u03b1 \u03c4\u03bf \u03b5\u03bc\u03c6\u03b1\u03bd\u03af\u03c3\u03b5\u03c4\u03b5 \u03b1\u03c0\u03b5\u03c5\u03b8\u03b5\u03af\u03b1\u03c2 \u03c3\u03b5 template. \u0397 \u03b1\u03c0\u03bb\u03bf\u03cd\u03c3\u03c4\u03b5\u03c1\u03b7 \u03c7\u03c1\u03ae\u03c3\u03b7 \u03b5\u03af\u03bd\u03b1\u03b9 \u03b7 \u03b5\u03be\u03ae\u03c2:<\/p>\n\n\n\n<div class=\"wp-block-kevinbatdorf-code-block-pro\" data-code-block-pro-font-family=\"Code-Pro-JetBrains-Mono\" style=\"font-size:.875rem;font-family:Code-Pro-JetBrains-Mono,ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;line-height:1.25rem;--cbp-tab-width:2;tab-size:var(--cbp-tab-width, 2)\"><span style=\"display:block;padding:16px 0 0 16px;margin-bottom:-1px;width:100%;text-align:left;background-color:#24292e\"><svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"54\" height=\"14\" viewBox=\"0 0 54 14\"><g fill=\"none\" fill-rule=\"evenodd\" transform=\"translate(1 1)\"><circle cx=\"6\" cy=\"6\" r=\"6\" fill=\"#FF5F56\" stroke=\"#E0443E\" stroke-width=\".5\"><\/circle><circle cx=\"26\" cy=\"6\" r=\"6\" fill=\"#FFBD2E\" stroke=\"#DEA123\" stroke-width=\".5\"><\/circle><circle cx=\"46\" cy=\"6\" r=\"6\" fill=\"#27C93F\" stroke=\"#1AAB29\" stroke-width=\".5\"><\/circle><\/g><\/svg><\/span><span role=\"button\" tabindex=\"0\" style=\"color:#e1e4e8;display:none\" aria-label=\"Copy\" class=\"code-block-pro-copy-button\"><pre class=\"code-block-pro-copy-button-pre\" aria-hidden=\"true\"><textarea class=\"code-block-pro-copy-button-textarea\" tabindex=\"-1\" aria-hidden=\"true\" readonly>echo wp_get_icon( 'myplugin\/heart' );\n<\/textarea><\/pre><svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" style=\"width:24px;height:24px\" fill=\"none\" viewBox=\"0 0 24 24\" stroke=\"currentColor\" stroke-width=\"2\"><path class=\"with-check\" stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2m-6 9l2 2 4-4\"><\/path><path class=\"without-check\" stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2\"><\/path><\/svg><\/span><pre class=\"shiki github-dark\" style=\"background-color:#24292e;color:#e1e4e8\" tabindex=\"0\"><code><span class=\"line\"><span style=\"color:#79B8FF\">echo<\/span><span style=\"color:#B392F0\"> wp_get_icon<\/span><span style=\"color:#E1E4E8\">( <\/span><span style=\"color:#9ECBFF\">'myplugin\/heart'<\/span><span style=\"color:#E1E4E8\"> );<\/span><\/span><\/code><\/pre><\/div>\n\n\n\n<p>\u03a0\u03b5\u03c1\u03ac\u03c3\u03c4\u03b5 \u03b4\u03b5\u03cd\u03c4\u03b5\u03c1\u03bf array \u03bf\u03c1\u03b9\u03c3\u03bc\u03ac\u03c4\u03c9\u03bd \u03cc\u03c4\u03b1\u03bd \u03c7\u03c1\u03b5\u03b9\u03ac\u03b6\u03b5\u03c3\u03c4\u03b5 \u03b1\u03ba\u03c1\u03b9\u03b2\u03ad\u03c2 \u03bc\u03ad\u03b3\u03b5\u03b8\u03bf\u03c2, CSS class \u03ae \u03c0\u03c1\u03bf\u03c3\u03b2\u03ac\u03c3\u03b9\u03bc\u03bf \u03cc\u03bd\u03bf\u03bc\u03b1. \u03a4\u03bf <code>size<\/code> \u03bf\u03c1\u03af\u03b6\u03b5\u03b9 <code>width<\/code> \u03ba\u03b1\u03b9 <code>height<\/code> \u03c3\u03b5 pixels, \u03c4\u03bf <code>class<\/code> \u03c0\u03c1\u03bf\u03c3\u03b8\u03ad\u03c4\u03b5\u03b9 class \u03c3\u03c4\u03bf \u03c3\u03c4\u03bf\u03b9\u03c7\u03b5\u03af\u03bf SVG \u03ba\u03b1\u03b9 \u03c4\u03bf <code>label<\/code> \u03bf\u03c1\u03af\u03b6\u03b5\u03b9 <code>aria-label<\/code> \u03b3\u03b9\u03b1 screen readers. \u0397 \u03c3\u03c5\u03bd\u03ac\u03c1\u03c4\u03b7\u03c3\u03b7 \u03b4\u03ad\u03c7\u03b5\u03c4\u03b1\u03b9 \u03b5\u03c0\u03af\u03c3\u03b7\u03c2 <code>title<\/code>.<\/p>\n\n\n\n<div class=\"wp-block-kevinbatdorf-code-block-pro\" data-code-block-pro-font-family=\"Code-Pro-JetBrains-Mono\" style=\"font-size:.875rem;font-family:Code-Pro-JetBrains-Mono,ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;line-height:1.25rem;--cbp-tab-width:2;tab-size:var(--cbp-tab-width, 2)\"><span style=\"display:block;padding:16px 0 0 16px;margin-bottom:-1px;width:100%;text-align:left;background-color:#24292e\"><svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"54\" height=\"14\" viewBox=\"0 0 54 14\"><g fill=\"none\" fill-rule=\"evenodd\" transform=\"translate(1 1)\"><circle cx=\"6\" cy=\"6\" r=\"6\" fill=\"#FF5F56\" stroke=\"#E0443E\" stroke-width=\".5\"><\/circle><circle cx=\"26\" cy=\"6\" r=\"6\" fill=\"#FFBD2E\" stroke=\"#DEA123\" stroke-width=\".5\"><\/circle><circle cx=\"46\" cy=\"6\" r=\"6\" fill=\"#27C93F\" stroke=\"#1AAB29\" stroke-width=\".5\"><\/circle><\/g><\/svg><\/span><span role=\"button\" tabindex=\"0\" style=\"color:#e1e4e8;display:none\" aria-label=\"Copy\" class=\"code-block-pro-copy-button\"><pre class=\"code-block-pro-copy-button-pre\" aria-hidden=\"true\"><textarea class=\"code-block-pro-copy-button-textarea\" tabindex=\"-1\" aria-hidden=\"true\" readonly>echo wp_get_icon(\n    'myplugin\/star',\n    array(\n        'size'  =&gt; 32,\n        'class' =&gt; 'featured-icon',\n        'label' =&gt; __( '\u03a0\u03c1\u03bf\u03c4\u03b5\u03b9\u03bd\u03cc\u03bc\u03b5\u03bd\u03bf', 'myplugin-icons' ),\n    )\n);\n<\/textarea><\/pre><svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" style=\"width:24px;height:24px\" fill=\"none\" viewBox=\"0 0 24 24\" stroke=\"currentColor\" stroke-width=\"2\"><path class=\"with-check\" stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2m-6 9l2 2 4-4\"><\/path><path class=\"without-check\" stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2\"><\/path><\/svg><\/span><pre class=\"shiki github-dark\" style=\"background-color:#24292e;color:#e1e4e8\" tabindex=\"0\"><code><span class=\"line\"><span style=\"color:#79B8FF\">echo<\/span><span style=\"color:#B392F0\"> wp_get_icon<\/span><span style=\"color:#E1E4E8\">(<\/span><\/span>\n<span class=\"line\"><span style=\"color:#9ECBFF\">    'myplugin\/star'<\/span><span style=\"color:#E1E4E8\">,<\/span><\/span>\n<span class=\"line\"><span style=\"color:#79B8FF\">    array<\/span><span style=\"color:#E1E4E8\">(<\/span><\/span>\n<span class=\"line\"><span style=\"color:#9ECBFF\">        'size'<\/span><span style=\"color:#F97583\">  =><\/span><span style=\"color:#79B8FF\"> 32<\/span><span style=\"color:#E1E4E8\">,<\/span><\/span>\n<span class=\"line\"><span style=\"color:#9ECBFF\">        'class'<\/span><span style=\"color:#F97583\"> =><\/span><span style=\"color:#9ECBFF\"> 'featured-icon'<\/span><span style=\"color:#E1E4E8\">,<\/span><\/span>\n<span class=\"line\"><span style=\"color:#9ECBFF\">        'label'<\/span><span style=\"color:#F97583\"> =><\/span><span style=\"color:#B392F0\"> __<\/span><span style=\"color:#E1E4E8\">( <\/span><span style=\"color:#9ECBFF\">'\u03a0\u03c1\u03bf\u03c4\u03b5\u03b9\u03bd\u03cc\u03bc\u03b5\u03bd\u03bf'<\/span><span style=\"color:#E1E4E8\">, <\/span><span style=\"color:#9ECBFF\">'myplugin-icons'<\/span><span style=\"color:#E1E4E8\"> ),<\/span><\/span>\n<span class=\"line\"><span style=\"color:#E1E4E8\">    )<\/span><\/span>\n<span class=\"line\"><span style=\"color:#E1E4E8\">);<\/span><\/span><\/code><\/pre><\/div>\n\n\n\n<h3 class=\"wp-block-heading\">\u03a0\u03c1\u03bf\u03c3\u03b8\u03ad\u03c3\u03c4\u03b5 shortcode \u03b3\u03b9\u03b1 \u03c4\u03bf \u03c0\u03b5\u03c1\u03b9\u03b5\u03c7\u03cc\u03bc\u03b5\u03bd\u03bf<\/h3>\n\n\n\n<p>\u03a4\u03bf \u03b5\u03c0\u03cc\u03bc\u03b5\u03bd\u03bf shortcode \u03b5\u03c0\u03b9\u03c4\u03c1\u03ad\u03c0\u03b5\u03b9 \u03c3\u03b5 \u03c3\u03c5\u03bd\u03c4\u03ac\u03ba\u03c4\u03b5\u03c2 \u03bd\u03b1 \u03b2\u03ac\u03b6\u03bf\u03c5\u03bd \u03ad\u03bd\u03b1 registered icon \u03b4\u03af\u03c0\u03bb\u03b1 \u03c3\u03b5 \u03ba\u03b5\u03af\u03bc\u03b5\u03bd\u03bf \u03c3\u03b5 \u03ac\u03c1\u03b8\u03c1\u03b1, \u03c3\u03b5\u03bb\u03af\u03b4\u03b5\u03c2 \u03ae widgets. \u039a\u03b1\u03b8\u03b1\u03c1\u03af\u03b6\u03b5\u03b9 \u03c4\u03bf \u03cc\u03bd\u03bf\u03bc\u03b1, \u03c4\u03bf \u03bc\u03ad\u03b3\u03b5\u03b8\u03bf\u03c2 \u03ba\u03b1\u03b9 \u03c4\u03bf CSS class \u03c0\u03c1\u03b9\u03bd \u03ba\u03b1\u03bb\u03ad\u03c3\u03b5\u03b9 \u03c4\u03b7 <code>wp_get_icon()<\/code>.<\/p>\n\n\n\n<div class=\"wp-block-kevinbatdorf-code-block-pro\" data-code-block-pro-font-family=\"Code-Pro-JetBrains-Mono\" style=\"font-size:.875rem;font-family:Code-Pro-JetBrains-Mono,ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;line-height:1.25rem;--cbp-tab-width:2;tab-size:var(--cbp-tab-width, 2)\"><span style=\"display:block;padding:16px 0 0 16px;margin-bottom:-1px;width:100%;text-align:left;background-color:#24292e\"><svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"54\" height=\"14\" viewBox=\"0 0 54 14\"><g fill=\"none\" fill-rule=\"evenodd\" transform=\"translate(1 1)\"><circle cx=\"6\" cy=\"6\" r=\"6\" fill=\"#FF5F56\" stroke=\"#E0443E\" stroke-width=\".5\"><\/circle><circle cx=\"26\" cy=\"6\" r=\"6\" fill=\"#FFBD2E\" stroke=\"#DEA123\" stroke-width=\".5\"><\/circle><circle cx=\"46\" cy=\"6\" r=\"6\" fill=\"#27C93F\" stroke=\"#1AAB29\" stroke-width=\".5\"><\/circle><\/g><\/svg><\/span><span role=\"button\" tabindex=\"0\" style=\"color:#e1e4e8;display:none\" aria-label=\"Copy\" class=\"code-block-pro-copy-button\"><pre class=\"code-block-pro-copy-button-pre\" aria-hidden=\"true\"><textarea class=\"code-block-pro-copy-button-textarea\" tabindex=\"-1\" aria-hidden=\"true\" readonly>add_shortcode( 'myplugin_icon', 'myplugin_icon_shortcode' );\n\nfunction myplugin_icon_shortcode( $atts ) {\n    $atts = shortcode_atts(\n        array(\n            'name'  =&gt; 'heart',\n            'text'  =&gt; '',\n            'size'  =&gt; 24,\n            'class' =&gt; '',\n        ),\n        $atts\n    );\n\n    $icon = wp_get_icon(\n        'myplugin\/' . sanitize_key( $atts['name'] ),\n        array(\n            'size'  =&gt; absint( $atts['size'] ),\n            'class' =&gt; sanitize_html_class( $atts['class'] ),\n        )\n    );\n\n    if ( ! $icon ) {\n        return '';\n    }\n\n    return sprintf(\n        '&lt;span&gt;%s %s&lt;\/span&gt;',\n        $icon,\n        esc_html( $atts['text'] )\n    );\n}\n<\/textarea><\/pre><svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" style=\"width:24px;height:24px\" fill=\"none\" viewBox=\"0 0 24 24\" stroke=\"currentColor\" stroke-width=\"2\"><path class=\"with-check\" stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2m-6 9l2 2 4-4\"><\/path><path class=\"without-check\" stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2\"><\/path><\/svg><\/span><pre class=\"shiki github-dark\" style=\"background-color:#24292e;color:#e1e4e8\" tabindex=\"0\"><code><span class=\"line\"><span style=\"color:#B392F0\">add_shortcode<\/span><span style=\"color:#E1E4E8\">( <\/span><span style=\"color:#9ECBFF\">'myplugin_icon'<\/span><span style=\"color:#E1E4E8\">, <\/span><span style=\"color:#9ECBFF\">'myplugin_icon_shortcode'<\/span><span style=\"color:#E1E4E8\"> );<\/span><\/span>\n<span class=\"line\"><\/span>\n<span class=\"line\"><span style=\"color:#F97583\">function<\/span><span style=\"color:#B392F0\"> myplugin_icon_shortcode<\/span><span style=\"color:#E1E4E8\">( $atts ) {<\/span><\/span>\n<span class=\"line\"><span style=\"color:#E1E4E8\">    $atts <\/span><span style=\"color:#F97583\">=<\/span><span style=\"color:#B392F0\"> shortcode_atts<\/span><span style=\"color:#E1E4E8\">(<\/span><\/span>\n<span class=\"line\"><span style=\"color:#79B8FF\">        array<\/span><span style=\"color:#E1E4E8\">(<\/span><\/span>\n<span class=\"line\"><span style=\"color:#9ECBFF\">            'name'<\/span><span style=\"color:#F97583\">  =><\/span><span style=\"color:#9ECBFF\"> 'heart'<\/span><span style=\"color:#E1E4E8\">,<\/span><\/span>\n<span class=\"line\"><span style=\"color:#9ECBFF\">            'text'<\/span><span style=\"color:#F97583\">  =><\/span><span style=\"color:#9ECBFF\"> ''<\/span><span style=\"color:#E1E4E8\">,<\/span><\/span>\n<span class=\"line\"><span style=\"color:#9ECBFF\">            'size'<\/span><span style=\"color:#F97583\">  =><\/span><span style=\"color:#79B8FF\"> 24<\/span><span style=\"color:#E1E4E8\">,<\/span><\/span>\n<span class=\"line\"><span style=\"color:#9ECBFF\">            'class'<\/span><span style=\"color:#F97583\"> =><\/span><span style=\"color:#9ECBFF\"> ''<\/span><span style=\"color:#E1E4E8\">,<\/span><\/span>\n<span class=\"line\"><span style=\"color:#E1E4E8\">        ),<\/span><\/span>\n<span class=\"line\"><span style=\"color:#E1E4E8\">        $atts<\/span><\/span>\n<span class=\"line\"><span style=\"color:#E1E4E8\">    );<\/span><\/span>\n<span class=\"line\"><\/span>\n<span class=\"line\"><span style=\"color:#E1E4E8\">    $icon <\/span><span style=\"color:#F97583\">=<\/span><span style=\"color:#B392F0\"> wp_get_icon<\/span><span style=\"color:#E1E4E8\">(<\/span><\/span>\n<span class=\"line\"><span style=\"color:#9ECBFF\">        'myplugin\/'<\/span><span style=\"color:#F97583\"> .<\/span><span style=\"color:#B392F0\"> sanitize_key<\/span><span style=\"color:#E1E4E8\">( $atts[<\/span><span style=\"color:#9ECBFF\">'name'<\/span><span style=\"color:#E1E4E8\">] ),<\/span><\/span>\n<span class=\"line\"><span style=\"color:#79B8FF\">        array<\/span><span style=\"color:#E1E4E8\">(<\/span><\/span>\n<span class=\"line\"><span style=\"color:#9ECBFF\">            'size'<\/span><span style=\"color:#F97583\">  =><\/span><span style=\"color:#B392F0\"> absint<\/span><span style=\"color:#E1E4E8\">( $atts[<\/span><span style=\"color:#9ECBFF\">'size'<\/span><span style=\"color:#E1E4E8\">] ),<\/span><\/span>\n<span class=\"line\"><span style=\"color:#9ECBFF\">            'class'<\/span><span style=\"color:#F97583\"> =><\/span><span style=\"color:#B392F0\"> sanitize_html_class<\/span><span style=\"color:#E1E4E8\">( $atts[<\/span><span style=\"color:#9ECBFF\">'class'<\/span><span style=\"color:#E1E4E8\">] ),<\/span><\/span>\n<span class=\"line\"><span style=\"color:#E1E4E8\">        )<\/span><\/span>\n<span class=\"line\"><span style=\"color:#E1E4E8\">    );<\/span><\/span>\n<span class=\"line\"><\/span>\n<span class=\"line\"><span style=\"color:#F97583\">    if<\/span><span style=\"color:#E1E4E8\"> ( <\/span><span style=\"color:#F97583\">!<\/span><span style=\"color:#E1E4E8\"> $icon ) {<\/span><\/span>\n<span class=\"line\"><span style=\"color:#F97583\">        return<\/span><span style=\"color:#9ECBFF\"> ''<\/span><span style=\"color:#E1E4E8\">;<\/span><\/span>\n<span class=\"line\"><span style=\"color:#E1E4E8\">    }<\/span><\/span>\n<span class=\"line\"><\/span>\n<span class=\"line\"><span style=\"color:#F97583\">    return<\/span><span style=\"color:#79B8FF\"> sprintf<\/span><span style=\"color:#E1E4E8\">(<\/span><\/span>\n<span class=\"line\"><span style=\"color:#9ECBFF\">        '&#x3C;span>%s %s&#x3C;\/span>'<\/span><span style=\"color:#E1E4E8\">,<\/span><\/span>\n<span class=\"line\"><span style=\"color:#E1E4E8\">        $icon,<\/span><\/span>\n<span class=\"line\"><span style=\"color:#B392F0\">        esc_html<\/span><span style=\"color:#E1E4E8\">( $atts[<\/span><span style=\"color:#9ECBFF\">'text'<\/span><span style=\"color:#E1E4E8\">] )<\/span><\/span>\n<span class=\"line\"><span style=\"color:#E1E4E8\">    );<\/span><\/span>\n<span class=\"line\"><span style=\"color:#E1E4E8\">}<\/span><\/span><\/code><\/pre><\/div>\n\n\n\n<div class=\"wp-block-kevinbatdorf-code-block-pro\" data-code-block-pro-font-family=\"Code-Pro-JetBrains-Mono\" style=\"font-size:.875rem;font-family:Code-Pro-JetBrains-Mono,ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;line-height:1.25rem;--cbp-tab-width:2;tab-size:var(--cbp-tab-width, 2)\"><span style=\"display:block;padding:16px 0 0 16px;margin-bottom:-1px;width:100%;text-align:left;background-color:#24292e\"><svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"54\" height=\"14\" viewBox=\"0 0 54 14\"><g fill=\"none\" fill-rule=\"evenodd\" transform=\"translate(1 1)\"><circle cx=\"6\" cy=\"6\" r=\"6\" fill=\"#FF5F56\" stroke=\"#E0443E\" stroke-width=\".5\"><\/circle><circle cx=\"26\" cy=\"6\" r=\"6\" fill=\"#FFBD2E\" stroke=\"#DEA123\" stroke-width=\".5\"><\/circle><circle cx=\"46\" cy=\"6\" r=\"6\" fill=\"#27C93F\" stroke=\"#1AAB29\" stroke-width=\".5\"><\/circle><\/g><\/svg><\/span><span role=\"button\" tabindex=\"0\" style=\"color:#e1e4e8;display:none\" aria-label=\"Copy\" class=\"code-block-pro-copy-button\"><pre class=\"code-block-pro-copy-button-pre\" aria-hidden=\"true\"><textarea class=\"code-block-pro-copy-button-textarea\" tabindex=\"-1\" aria-hidden=\"true\" readonly>[myplugin_icon name=&quot;heart&quot; text=&quot;Hello World&quot;]\n\n[myplugin_icon name=&quot;star&quot; text=&quot;\u03a0\u03c1\u03bf\u03c4\u03b5\u03b9\u03bd\u03cc\u03bc\u03b5\u03bd\u03bf \u03ac\u03c1\u03b8\u03c1\u03bf&quot; size=&quot;32&quot;]\n\n[myplugin_icon name=&quot;bookmark&quot; text=&quot;\u0391\u03c0\u03bf\u03b8\u03ae\u03ba\u03b5\u03c5\u03c3\u03b7 \u03b3\u03b9\u03b1 \u03b1\u03c1\u03b3\u03cc\u03c4\u03b5\u03c1\u03b1&quot; size=&quot;20&quot;]\n<\/textarea><\/pre><svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" style=\"width:24px;height:24px\" fill=\"none\" viewBox=\"0 0 24 24\" stroke=\"currentColor\" stroke-width=\"2\"><path class=\"with-check\" stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2m-6 9l2 2 4-4\"><\/path><path class=\"without-check\" stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2\"><\/path><\/svg><\/span><pre class=\"shiki github-dark\" style=\"background-color:#24292e;color:#e1e4e8\" tabindex=\"0\"><code><span class=\"line\"><span>[myplugin_icon name=\"heart\" text=\"Hello World\"]<\/span><\/span>\n<span class=\"line\"><span><\/span><\/span>\n<span class=\"line\"><span>[myplugin_icon name=\"star\" text=\"\u03a0\u03c1\u03bf\u03c4\u03b5\u03b9\u03bd\u03cc\u03bc\u03b5\u03bd\u03bf \u03ac\u03c1\u03b8\u03c1\u03bf\" size=\"32\"]<\/span><\/span>\n<span class=\"line\"><span><\/span><\/span>\n<span class=\"line\"><span>[myplugin_icon name=\"bookmark\" text=\"\u0391\u03c0\u03bf\u03b8\u03ae\u03ba\u03b5\u03c5\u03c3\u03b7 \u03b3\u03b9\u03b1 \u03b1\u03c1\u03b3\u03cc\u03c4\u03b5\u03c1\u03b1\" size=\"20\"]<\/span><\/span><\/code><\/pre><\/div>\n\n\n\n<p>\u03a4\u03bf shortcode \u03b5\u03bc\u03c6\u03b1\u03bd\u03af\u03b6\u03b5\u03b9 \u03c4\u03bf icon \u03b4\u03af\u03c0\u03bb\u03b1 \u03c3\u03c4\u03bf \u03ba\u03b5\u03af\u03bc\u03b5\u03bd\u03bf, \u03c3\u03c4\u03bf \u03bc\u03ad\u03b3\u03b5\u03b8\u03bf\u03c2 \u03c0\u03bf\u03c5 \u03bf\u03c1\u03af\u03b6\u03b5\u03b9 \u03c4\u03bf <code>size<\/code>. \u0395\u03c6\u03cc\u03c3\u03bf\u03bd \u03c4\u03b1 SVG \u03c7\u03c1\u03b7\u03c3\u03b9\u03bc\u03bf\u03c0\u03bf\u03b9\u03bf\u03cd\u03bd <code>currentColor<\/code>, \u03ba\u03bb\u03b7\u03c1\u03bf\u03bd\u03bf\u03bc\u03bf\u03cd\u03bd \u03b1\u03c5\u03c4\u03cc\u03bc\u03b1\u03c4\u03b1 \u03c4\u03bf \u03c7\u03c1\u03ce\u03bc\u03b1 \u03c4\u03bf\u03c5 \u03ba\u03b5\u03b9\u03bc\u03ad\u03bd\u03bf\u03c5 \u03c0\u03bf\u03c5 \u03c4\u03b1 \u03c0\u03b5\u03c1\u03b9\u03b2\u03ac\u03bb\u03bb\u03b5\u03b9.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\">\u03a7\u03c1\u03b7\u03c3\u03b9\u03bc\u03bf\u03c0\u03bf\u03b9\u03ae\u03c3\u03c4\u03b5 custom icon \u03c3\u03b5 register_block_type()<\/h3>\n\n\n\n<p>\u039c\u03c0\u03bf\u03c1\u03b5\u03af\u03c4\u03b5 \u03bd\u03b1 \u03b1\u03bd\u03c4\u03b9\u03ba\u03b1\u03c4\u03b1\u03c3\u03c4\u03ae\u03c3\u03b5\u03c4\u03b5 \u03c4\u03bf \u03c0\u03c1\u03bf\u03b5\u03c0\u03b9\u03bb\u03b5\u03b3\u03bc\u03ad\u03bd\u03bf Dashicon \u03c3\u03b5 \u03ba\u03ac\u03b8\u03b5 block \u03c0\u03bf\u03c5 \u03b4\u03b7\u03bb\u03ce\u03bd\u03b5\u03c4\u03b5. \u0391\u03bd\u03c4\u03af \u03b3\u03b9\u03b1 \u03ad\u03bd\u03b1 \u03cc\u03bd\u03bf\u03bc\u03b1 Dashicon \u03cc\u03c0\u03c9\u03c2 \u03c4\u03bf <code>warning<\/code>, \u03c0\u03b5\u03c1\u03ac\u03c3\u03c4\u03b5 \u03c4\u03bf \u03c0\u03bb\u03ae\u03c1\u03b5\u03c2 \u03cc\u03bd\u03bf\u03bc\u03b1 \u03c4\u03bf\u03c5 custom icon \u03c3\u03c4\u03bf \u03ba\u03bb\u03b5\u03b9\u03b4\u03af <code>icon<\/code>.<\/p>\n\n\n\n<div class=\"wp-block-kevinbatdorf-code-block-pro\" data-code-block-pro-font-family=\"Code-Pro-JetBrains-Mono\" style=\"font-size:.875rem;font-family:Code-Pro-JetBrains-Mono,ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;line-height:1.25rem;--cbp-tab-width:2;tab-size:var(--cbp-tab-width, 2)\"><span style=\"display:block;padding:16px 0 0 16px;margin-bottom:-1px;width:100%;text-align:left;background-color:#24292e\"><svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"54\" height=\"14\" viewBox=\"0 0 54 14\"><g fill=\"none\" fill-rule=\"evenodd\" transform=\"translate(1 1)\"><circle cx=\"6\" cy=\"6\" r=\"6\" fill=\"#FF5F56\" stroke=\"#E0443E\" stroke-width=\".5\"><\/circle><circle cx=\"26\" cy=\"6\" r=\"6\" fill=\"#FFBD2E\" stroke=\"#DEA123\" stroke-width=\".5\"><\/circle><circle cx=\"46\" cy=\"6\" r=\"6\" fill=\"#27C93F\" stroke=\"#1AAB29\" stroke-width=\".5\"><\/circle><\/g><\/svg><\/span><span role=\"button\" tabindex=\"0\" style=\"color:#e1e4e8;display:none\" aria-label=\"Copy\" class=\"code-block-pro-copy-button\"><pre class=\"code-block-pro-copy-button-pre\" aria-hidden=\"true\"><textarea class=\"code-block-pro-copy-button-textarea\" tabindex=\"-1\" aria-hidden=\"true\" readonly>'icon' =&gt; 'warning', \/\/ \u03a7\u03c1\u03b7\u03c3\u03b9\u03bc\u03bf\u03c0\u03bf\u03b9\u03b5\u03af Dashicon\n\n'icon' =&gt; 'myplugin\/star', \/\/ \u03a7\u03c1\u03b7\u03c3\u03b9\u03bc\u03bf\u03c0\u03bf\u03b9\u03b5\u03af registered custom icon\n<\/textarea><\/pre><svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" style=\"width:24px;height:24px\" fill=\"none\" viewBox=\"0 0 24 24\" stroke=\"currentColor\" stroke-width=\"2\"><path class=\"with-check\" stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2m-6 9l2 2 4-4\"><\/path><path class=\"without-check\" stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2\"><\/path><\/svg><\/span><pre class=\"shiki github-dark\" style=\"background-color:#24292e;color:#e1e4e8\" tabindex=\"0\"><code><span class=\"line\"><span style=\"color:#9ECBFF\">'icon'<\/span><span style=\"color:#F97583\"> =><\/span><span style=\"color:#9ECBFF\"> 'warning'<\/span><span style=\"color:#E1E4E8\">, <\/span><span style=\"color:#6A737D\">\/\/ \u03a7\u03c1\u03b7\u03c3\u03b9\u03bc\u03bf\u03c0\u03bf\u03b9\u03b5\u03af Dashicon<\/span><\/span>\n<span class=\"line\"><\/span>\n<span class=\"line\"><span style=\"color:#9ECBFF\">'icon'<\/span><span style=\"color:#F97583\"> =><\/span><span style=\"color:#9ECBFF\"> 'myplugin\/star'<\/span><span style=\"color:#E1E4E8\">, <\/span><span style=\"color:#6A737D\">\/\/ \u03a7\u03c1\u03b7\u03c3\u03b9\u03bc\u03bf\u03c0\u03bf\u03b9\u03b5\u03af registered custom icon<\/span><\/span><\/code><\/pre><\/div>\n\n\n\n<p>\u039f block inserter \u03b8\u03b1 \u03b5\u03bc\u03c6\u03b1\u03bd\u03af\u03c3\u03b5\u03b9 \u03c4\u03bf SVG \u03c4\u03b7\u03c2 \u03c3\u03c5\u03bb\u03bb\u03bf\u03b3\u03ae\u03c2 \u03b1\u03bd\u03c4\u03af \u03b3\u03b9\u03b1 \u03b3\u03b5\u03bd\u03b9\u03ba\u03cc Dashicon. \u0397 \u03c0\u03c1\u03bf\u03c3\u03ad\u03b3\u03b3\u03b9\u03c3\u03b7 \u03bb\u03b5\u03b9\u03c4\u03bf\u03c5\u03c1\u03b3\u03b5\u03af \u03c4\u03cc\u03c3\u03bf \u03c3\u03b5 blocks \u03c0\u03bf\u03c5 \u03b4\u03b7\u03bb\u03ce\u03bd\u03b5\u03c4\u03b5 \u03bc\u03b5 JavaScript \u03cc\u03c3\u03bf \u03ba\u03b1\u03b9 \u03c3\u03b5 blocks \u03bc\u03cc\u03bd\u03bf \u03bc\u03b5 PHP.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\">\u0394\u03ce\u03c3\u03c4\u03b5 \u03c3\u03c4\u03b1 SVG \u03c3\u03c9\u03c3\u03c4\u03cc \u03c7\u03c1\u03ce\u03bc\u03b1 \u03ba\u03b1\u03b9 \u03c3\u03c5\u03bc\u03c0\u03b5\u03c1\u03b9\u03c6\u03bf\u03c1\u03ac<\/h2>\n\n\n\n<p>\u03a7\u03c1\u03b7\u03c3\u03b9\u03bc\u03bf\u03c0\u03bf\u03b9\u03ae\u03c3\u03c4\u03b5 <code>stroke=&quot;currentColor&quot;<\/code> \u03ae <code>fill=&quot;currentColor&quot;<\/code> \u03b1\u03bd\u03c4\u03af \u03b3\u03b9\u03b1 \u03c3\u03c4\u03b1\u03b8\u03b5\u03c1\u03cc \u03c7\u03c1\u03ce\u03bc\u03b1. \u0388\u03bd\u03b1 icon \u03bc\u03ad\u03c3\u03b1 \u03c3\u03b5 \u03ba\u03cc\u03ba\u03ba\u03b9\u03bd\u03bf \u03ba\u03b5\u03af\u03bc\u03b5\u03bd\u03bf \u03b8\u03b1 \u03b3\u03af\u03bd\u03b5\u03b9 \u03ba\u03cc\u03ba\u03ba\u03b9\u03bd\u03bf, \u03c3\u03b5 dark theme \u03b8\u03b1 \u03b1\u03ba\u03bf\u03bb\u03bf\u03c5\u03b8\u03ae\u03c3\u03b5\u03b9 \u03c4\u03bf \u03b1\u03bd\u03c4\u03af\u03c3\u03c4\u03bf\u03b9\u03c7\u03bf \u03c7\u03c1\u03ce\u03bc\u03b1 \u03ba\u03b1\u03b9 \u03bc\u03ad\u03c3\u03b1 \u03c3\u03b5 link \u03b8\u03b1 \u03c4\u03b1\u03b9\u03c1\u03b9\u03ac\u03be\u03b5\u03b9 \u03bc\u03b5 \u03c4\u03bf link. \u039c\u03b5 \u03b1\u03c5\u03c4\u03cc\u03bd \u03c4\u03bf\u03bd \u03c4\u03c1\u03cc\u03c0\u03bf \u03c4\u03bf SVG \u03c3\u03c5\u03bc\u03c0\u03b5\u03c1\u03b9\u03c6\u03ad\u03c1\u03b5\u03c4\u03b1\u03b9 \u03c3\u03b1\u03bd \u03ba\u03b5\u03af\u03bc\u03b5\u03bd\u03bf \u03ba\u03b1\u03b9 \u03c0\u03c1\u03bf\u03c3\u03b1\u03c1\u03bc\u03cc\u03b6\u03b5\u03c4\u03b1\u03b9 \u03c3\u03c4\u03bf theme.<\/p>\n\n\n\n<div class=\"wp-block-kevinbatdorf-code-block-pro\" data-code-block-pro-font-family=\"Code-Pro-JetBrains-Mono\" style=\"font-size:.875rem;font-family:Code-Pro-JetBrains-Mono,ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;line-height:1.25rem;--cbp-tab-width:2;tab-size:var(--cbp-tab-width, 2)\"><span style=\"display:block;padding:16px 0 0 16px;margin-bottom:-1px;width:100%;text-align:left;background-color:#24292e\"><svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"54\" height=\"14\" viewBox=\"0 0 54 14\"><g fill=\"none\" fill-rule=\"evenodd\" transform=\"translate(1 1)\"><circle cx=\"6\" cy=\"6\" r=\"6\" fill=\"#FF5F56\" stroke=\"#E0443E\" stroke-width=\".5\"><\/circle><circle cx=\"26\" cy=\"6\" r=\"6\" fill=\"#FFBD2E\" stroke=\"#DEA123\" stroke-width=\".5\"><\/circle><circle cx=\"46\" cy=\"6\" r=\"6\" fill=\"#27C93F\" stroke=\"#1AAB29\" stroke-width=\".5\"><\/circle><\/g><\/svg><\/span><span role=\"button\" tabindex=\"0\" style=\"color:#e1e4e8;display:none\" aria-label=\"Copy\" class=\"code-block-pro-copy-button\"><pre class=\"code-block-pro-copy-button-pre\" aria-hidden=\"true\"><textarea class=\"code-block-pro-copy-button-textarea\" tabindex=\"-1\" aria-hidden=\"true\" readonly>&lt;!-- \u039c\u03b7 \u03c7\u03c1\u03b7\u03c3\u03b9\u03bc\u03bf\u03c0\u03bf\u03b9\u03b5\u03af\u03c4\u03b5 \u03c3\u03c4\u03b1\u03b8\u03b5\u03c1\u03cc \u03c7\u03c1\u03ce\u03bc\u03b1: \u03c4\u03bf icon \u03b8\u03b1 \u03bc\u03ad\u03bd\u03b5\u03b9 \u03c0\u03ac\u03bd\u03c4\u03b1 \u03ba\u03cc\u03ba\u03ba\u03b9\u03bd\u03bf --&gt;\n&lt;svg viewBox=&quot;0 0 24 24&quot; stroke=&quot;#dc2626&quot; stroke-width=&quot;2&quot;&gt;\n    &lt;path d=&quot;...&quot;\/&gt;\n&lt;\/svg&gt;\n<\/textarea><\/pre><svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" style=\"width:24px;height:24px\" fill=\"none\" viewBox=\"0 0 24 24\" stroke=\"currentColor\" stroke-width=\"2\"><path class=\"with-check\" stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2m-6 9l2 2 4-4\"><\/path><path class=\"without-check\" stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2\"><\/path><\/svg><\/span><pre class=\"shiki github-dark\" style=\"background-color:#24292e;color:#e1e4e8\" tabindex=\"0\"><code><span class=\"line\"><span style=\"color:#6A737D\">&#x3C;!-- \u039c\u03b7 \u03c7\u03c1\u03b7\u03c3\u03b9\u03bc\u03bf\u03c0\u03bf\u03b9\u03b5\u03af\u03c4\u03b5 \u03c3\u03c4\u03b1\u03b8\u03b5\u03c1\u03cc \u03c7\u03c1\u03ce\u03bc\u03b1: \u03c4\u03bf icon \u03b8\u03b1 \u03bc\u03ad\u03bd\u03b5\u03b9 \u03c0\u03ac\u03bd\u03c4\u03b1 \u03ba\u03cc\u03ba\u03ba\u03b9\u03bd\u03bf --><\/span><\/span>\n<span class=\"line\"><span style=\"color:#E1E4E8\">&#x3C;<\/span><span style=\"color:#85E89D\">svg<\/span><span style=\"color:#B392F0\"> viewBox<\/span><span style=\"color:#E1E4E8\">=<\/span><span style=\"color:#9ECBFF\">\"0 0 24 24\"<\/span><span style=\"color:#B392F0\"> stroke<\/span><span style=\"color:#E1E4E8\">=<\/span><span style=\"color:#9ECBFF\">\"#dc2626\"<\/span><span style=\"color:#B392F0\"> stroke-width<\/span><span style=\"color:#E1E4E8\">=<\/span><span style=\"color:#9ECBFF\">\"2\"<\/span><span style=\"color:#E1E4E8\">><\/span><\/span>\n<span class=\"line\"><span style=\"color:#E1E4E8\">    &#x3C;<\/span><span style=\"color:#85E89D\">path<\/span><span style=\"color:#B392F0\"> d<\/span><span style=\"color:#E1E4E8\">=<\/span><span style=\"color:#9ECBFF\">\"...\"<\/span><span style=\"color:#E1E4E8\">\/><\/span><\/span>\n<span class=\"line\"><span style=\"color:#E1E4E8\">&#x3C;\/<\/span><span style=\"color:#85E89D\">svg<\/span><span style=\"color:#E1E4E8\">><\/span><\/span><\/code><\/pre><\/div>\n\n\n\n<p>\u038c\u03c4\u03b1\u03bd \u03ad\u03bd\u03b1 icon \u03c0\u03c1\u03ad\u03c0\u03b5\u03b9 \u03bd\u03b1 \u03ad\u03c7\u03b5\u03b9 \u03c3\u03c5\u03b3\u03ba\u03b5\u03ba\u03c1\u03b9\u03bc\u03ad\u03bd\u03bf \u03c7\u03c1\u03ce\u03bc\u03b1, \u03cc\u03c0\u03c9\u03c2 \u03ad\u03bd\u03b1 brand mark \u03ae \u03b4\u03b5\u03af\u03ba\u03c4\u03b7\u03c2 \u03ba\u03b1\u03c4\u03ac\u03c3\u03c4\u03b1\u03c3\u03b7\u03c2, \u03b5\u03c0\u03b9\u03b2\u03ac\u03bb\u03b5\u03c4\u03ad \u03c4\u03bf \u03b1\u03c0\u03cc CSS. \u0395\u03c0\u03b5\u03b9\u03b4\u03ae \u03c4\u03bf SVG \u03b4\u03b9\u03b1\u03b2\u03ac\u03b6\u03b5\u03b9 \u03c4\u03bf <code>currentColor<\/code>, \u03b7 \u03b9\u03b4\u03b9\u03cc\u03c4\u03b7\u03c4\u03b1 <code>color<\/code> \u03c3\u03c4\u03bf SVG \u03bc\u03b5\u03c4\u03b1\u03c6\u03ad\u03c1\u03b5\u03c4\u03b1\u03b9 \u03c3\u03c4\u03bf <code>stroke<\/code> \u03ae \u03c3\u03c4\u03bf <code>fill<\/code>.<\/p>\n\n\n\n<div class=\"wp-block-kevinbatdorf-code-block-pro\" data-code-block-pro-font-family=\"Code-Pro-JetBrains-Mono\" style=\"font-size:.875rem;font-family:Code-Pro-JetBrains-Mono,ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;line-height:1.25rem;--cbp-tab-width:2;tab-size:var(--cbp-tab-width, 2)\"><span style=\"display:block;padding:16px 0 0 16px;margin-bottom:-1px;width:100%;text-align:left;background-color:#24292e\"><svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"54\" height=\"14\" viewBox=\"0 0 54 14\"><g fill=\"none\" fill-rule=\"evenodd\" transform=\"translate(1 1)\"><circle cx=\"6\" cy=\"6\" r=\"6\" fill=\"#FF5F56\" stroke=\"#E0443E\" stroke-width=\".5\"><\/circle><circle cx=\"26\" cy=\"6\" r=\"6\" fill=\"#FFBD2E\" stroke=\"#DEA123\" stroke-width=\".5\"><\/circle><circle cx=\"46\" cy=\"6\" r=\"6\" fill=\"#27C93F\" stroke=\"#1AAB29\" stroke-width=\".5\"><\/circle><\/g><\/svg><\/span><span role=\"button\" tabindex=\"0\" style=\"color:#e1e4e8;display:none\" aria-label=\"Copy\" class=\"code-block-pro-copy-button\"><pre class=\"code-block-pro-copy-button-pre\" aria-hidden=\"true\"><textarea class=\"code-block-pro-copy-button-textarea\" tabindex=\"-1\" aria-hidden=\"true\" readonly>.featured-icon {\n    color: #f59e0b; \/* Amber, \u03b1\u03bd\u03b5\u03be\u03ac\u03c1\u03c4\u03b7\u03c4\u03b1 \u03b1\u03c0\u03cc \u03c4\u03bf \u03b3\u03cd\u03c1\u03c9 \u03ba\u03b5\u03af\u03bc\u03b5\u03bd\u03bf *\/\n}\n<\/textarea><\/pre><svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" style=\"width:24px;height:24px\" fill=\"none\" viewBox=\"0 0 24 24\" stroke=\"currentColor\" stroke-width=\"2\"><path class=\"with-check\" stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2m-6 9l2 2 4-4\"><\/path><path class=\"without-check\" stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2\"><\/path><\/svg><\/span><pre class=\"shiki github-dark\" style=\"background-color:#24292e;color:#e1e4e8\" tabindex=\"0\"><code><span class=\"line\"><span style=\"color:#B392F0\">.featured-icon<\/span><span style=\"color:#E1E4E8\"> {<\/span><\/span>\n<span class=\"line\"><span style=\"color:#79B8FF\">    color<\/span><span style=\"color:#E1E4E8\">: <\/span><span style=\"color:#79B8FF\">#f59e0b<\/span><span style=\"color:#E1E4E8\">; <\/span><span style=\"color:#6A737D\">\/* Amber, \u03b1\u03bd\u03b5\u03be\u03ac\u03c1\u03c4\u03b7\u03c4\u03b1 \u03b1\u03c0\u03cc \u03c4\u03bf \u03b3\u03cd\u03c1\u03c9 \u03ba\u03b5\u03af\u03bc\u03b5\u03bd\u03bf *\/<\/span><\/span>\n<span class=\"line\"><span style=\"color:#E1E4E8\">}<\/span><\/span><\/code><\/pre><\/div>\n\n\n\n<p>\u0393\u03b9\u03b1 icons \u03c0\u03bf\u03c5 \u03b1\u03c0\u03bf\u03b4\u03af\u03b4\u03b5\u03c4\u03b5 \u03bc\u03b5 shortcode \u03ae \u03bc\u03b5 <code>wp_get_icon()<\/code>, \u03c4\u03bf <code>size<\/code> \u03ba\u03b1\u03bb\u03cd\u03c0\u03c4\u03b5\u03b9 \u03c4\u03bf \u03bc\u03ad\u03b3\u03b5\u03b8\u03bf\u03c2 \u03c3\u03b5 pixels. \u03a7\u03c1\u03b7\u03c3\u03b9\u03bc\u03bf\u03c0\u03bf\u03b9\u03ae\u03c3\u03c4\u03b5 CSS \u03cc\u03c4\u03b1\u03bd \u03b8\u03ad\u03bb\u03b5\u03c4\u03b5 \u03c3\u03c4\u03b1\u03b8\u03b5\u03c1\u03cc \u03bc\u03ad\u03b3\u03b5\u03b8\u03bf\u03c2 \u03c3\u03b5 \u03c0\u03bf\u03bb\u03bb\u03ac \u03c3\u03b7\u03bc\u03b5\u03af\u03b1 \u03ae \u03ba\u03b1\u03c4\u03ac\u03c3\u03c4\u03b1\u03c3\u03b7 \u03cc\u03c0\u03c9\u03c2 hover, focus \u03ba\u03b1\u03b9 active. \u03a4\u03bf CSS \u03b5\u03af\u03bd\u03b1\u03b9 \u03b5\u03c0\u03af\u03c3\u03b7\u03c2 \u03b7 \u03ba\u03b1\u03c4\u03ac\u03bb\u03bb\u03b7\u03bb\u03b7 \u03b5\u03c0\u03b9\u03bb\u03bf\u03b3\u03ae \u03cc\u03c4\u03b1\u03bd \u03b8\u03ad\u03bb\u03b5\u03c4\u03b5 \u03bd\u03b1 \u03c3\u03c4\u03bf\u03c7\u03b5\u03cd\u03c3\u03b5\u03c4\u03b5 icons \u03c4\u03bf\u03c5 editor, \u03cc\u03c0\u03bf\u03c5 \u03b4\u03b5\u03bd \u03c0\u03b5\u03c1\u03bd\u03ac\u03c4\u03b5 \u03c4\u03bf \u03cc\u03c1\u03b9\u03c3\u03bc\u03b1 <code>class<\/code>.<\/p>\n\n\n\n<div class=\"wp-block-kevinbatdorf-code-block-pro\" data-code-block-pro-font-family=\"Code-Pro-JetBrains-Mono\" style=\"font-size:.875rem;font-family:Code-Pro-JetBrains-Mono,ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;line-height:1.25rem;--cbp-tab-width:2;tab-size:var(--cbp-tab-width, 2)\"><span style=\"display:block;padding:16px 0 0 16px;margin-bottom:-1px;width:100%;text-align:left;background-color:#24292e\"><svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"54\" height=\"14\" viewBox=\"0 0 54 14\"><g fill=\"none\" fill-rule=\"evenodd\" transform=\"translate(1 1)\"><circle cx=\"6\" cy=\"6\" r=\"6\" fill=\"#FF5F56\" stroke=\"#E0443E\" stroke-width=\".5\"><\/circle><circle cx=\"26\" cy=\"6\" r=\"6\" fill=\"#FFBD2E\" stroke=\"#DEA123\" stroke-width=\".5\"><\/circle><circle cx=\"46\" cy=\"6\" r=\"6\" fill=\"#27C93F\" stroke=\"#1AAB29\" stroke-width=\".5\"><\/circle><\/g><\/svg><\/span><span role=\"button\" tabindex=\"0\" style=\"color:#e1e4e8;display:none\" aria-label=\"Copy\" class=\"code-block-pro-copy-button\"><pre class=\"code-block-pro-copy-button-pre\" aria-hidden=\"true\"><textarea class=\"code-block-pro-copy-button-textarea\" tabindex=\"-1\" aria-hidden=\"true\" readonly>.myplugin-icon-inline svg {\n    transition: transform 0.15s ease-in-out;\n}\n\n.myplugin-icon-inline:hover svg {\n    transform: scale(1.1);\n}\n<\/textarea><\/pre><svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" style=\"width:24px;height:24px\" fill=\"none\" viewBox=\"0 0 24 24\" stroke=\"currentColor\" stroke-width=\"2\"><path class=\"with-check\" stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2m-6 9l2 2 4-4\"><\/path><path class=\"without-check\" stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2\"><\/path><\/svg><\/span><pre class=\"shiki github-dark\" style=\"background-color:#24292e;color:#e1e4e8\" tabindex=\"0\"><code><span class=\"line\"><span style=\"color:#B392F0\">.myplugin-icon-inline<\/span><span style=\"color:#85E89D\"> svg<\/span><span style=\"color:#E1E4E8\"> {<\/span><\/span>\n<span class=\"line\"><span style=\"color:#79B8FF\">    transition<\/span><span style=\"color:#E1E4E8\">: transform <\/span><span style=\"color:#79B8FF\">0.15<\/span><span style=\"color:#F97583\">s<\/span><span style=\"color:#79B8FF\"> ease-in-out<\/span><span style=\"color:#E1E4E8\">;<\/span><\/span>\n<span class=\"line\"><span style=\"color:#E1E4E8\">}<\/span><\/span>\n<span class=\"line\"><\/span>\n<span class=\"line\"><span style=\"color:#B392F0\">.myplugin-icon-inline:hover<\/span><span style=\"color:#85E89D\"> svg<\/span><span style=\"color:#E1E4E8\"> {<\/span><\/span>\n<span class=\"line\"><span style=\"color:#79B8FF\">    transform<\/span><span style=\"color:#E1E4E8\">: <\/span><span style=\"color:#79B8FF\">scale<\/span><span style=\"color:#E1E4E8\">(<\/span><span style=\"color:#79B8FF\">1.1<\/span><span style=\"color:#E1E4E8\">);<\/span><\/span>\n<span class=\"line\"><span style=\"color:#E1E4E8\">}<\/span><\/span><\/code><\/pre><\/div>\n\n\n\n<h2 class=\"wp-block-heading\">\u0391\u03c6\u03b1\u03b9\u03c1\u03ad\u03c3\u03c4\u03b5 icons \u03ba\u03b1\u03b9 \u03c3\u03c5\u03bb\u03bb\u03bf\u03b3\u03ad\u03c2<\/h2>\n\n\n\n<p>\u039a\u03b1\u03c4\u03ac \u03c4\u03b7\u03bd \u03b1\u03bd\u03ac\u03c0\u03c4\u03c5\u03be\u03b7 \u03ae \u03cc\u03c4\u03b1\u03bd \u03bc\u03b9\u03b1 \u03b5\u03bd\u03b7\u03bc\u03ad\u03c1\u03c9\u03c3\u03b7 plugin \u03ba\u03b1\u03c4\u03b1\u03c1\u03b3\u03b5\u03af \u03ad\u03bd\u03b1 icon, \u03b1\u03c6\u03b1\u03b9\u03c1\u03ad\u03c3\u03c4\u03b5 \u03ad\u03bd\u03b1 \u03c3\u03c5\u03b3\u03ba\u03b5\u03ba\u03c1\u03b9\u03bc\u03ad\u03bd\u03bf \u03cc\u03bd\u03bf\u03bc\u03b1 \u03bc\u03b5 \u03c4\u03b7\u03bd <code>wp_unregister_icon()<\/code>. \u03a4\u03bf icon \u03b8\u03b1 \u03b5\u03be\u03b1\u03c6\u03b1\u03bd\u03b9\u03c3\u03c4\u03b5\u03af \u03b1\u03c0\u03cc \u03c4\u03bf\u03bd picker \u03c3\u03c4\u03bf \u03b5\u03c0\u03cc\u03bc\u03b5\u03bd\u03bf request.<\/p>\n\n\n\n<div class=\"wp-block-kevinbatdorf-code-block-pro\" data-code-block-pro-font-family=\"Code-Pro-JetBrains-Mono\" style=\"font-size:.875rem;font-family:Code-Pro-JetBrains-Mono,ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;line-height:1.25rem;--cbp-tab-width:2;tab-size:var(--cbp-tab-width, 2)\"><span style=\"display:block;padding:16px 0 0 16px;margin-bottom:-1px;width:100%;text-align:left;background-color:#24292e\"><svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"54\" height=\"14\" viewBox=\"0 0 54 14\"><g fill=\"none\" fill-rule=\"evenodd\" transform=\"translate(1 1)\"><circle cx=\"6\" cy=\"6\" r=\"6\" fill=\"#FF5F56\" stroke=\"#E0443E\" stroke-width=\".5\"><\/circle><circle cx=\"26\" cy=\"6\" r=\"6\" fill=\"#FFBD2E\" stroke=\"#DEA123\" stroke-width=\".5\"><\/circle><circle cx=\"46\" cy=\"6\" r=\"6\" fill=\"#27C93F\" stroke=\"#1AAB29\" stroke-width=\".5\"><\/circle><\/g><\/svg><\/span><span role=\"button\" tabindex=\"0\" style=\"color:#e1e4e8;display:none\" aria-label=\"Copy\" class=\"code-block-pro-copy-button\"><pre class=\"code-block-pro-copy-button-pre\" aria-hidden=\"true\"><textarea class=\"code-block-pro-copy-button-textarea\" tabindex=\"-1\" aria-hidden=\"true\" readonly>wp_unregister_icon( 'myplugin\/bookmark' );\n<\/textarea><\/pre><svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" style=\"width:24px;height:24px\" fill=\"none\" viewBox=\"0 0 24 24\" stroke=\"currentColor\" stroke-width=\"2\"><path class=\"with-check\" stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2m-6 9l2 2 4-4\"><\/path><path class=\"without-check\" stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2\"><\/path><\/svg><\/span><pre class=\"shiki github-dark\" style=\"background-color:#24292e;color:#e1e4e8\" tabindex=\"0\"><code><span class=\"line\"><span style=\"color:#B392F0\">wp_unregister_icon<\/span><span style=\"color:#E1E4E8\">( <\/span><span style=\"color:#9ECBFF\">'myplugin\/bookmark'<\/span><span style=\"color:#E1E4E8\"> );<\/span><\/span><\/code><\/pre><\/div>\n\n\n\n<p>\u03a0\u03c1\u03bf\u03c3\u03ad\u03be\u03c4\u03b5 \u03cc\u03c4\u03b9 \u03ad\u03bd\u03b1 <code>core\/icon<\/code> block \u03c0\u03bf\u03c5 \u03ad\u03c7\u03b5\u03b9 \u03ae\u03b4\u03b7 \u03b1\u03c0\u03bf\u03b8\u03b7\u03ba\u03b5\u03cd\u03c3\u03b5\u03b9 \u03b1\u03c5\u03c4\u03cc \u03c4\u03bf icon \u03b8\u03b1 \u03b1\u03c0\u03bf\u03b4\u03af\u03b4\u03b5\u03b9 \u03ba\u03b5\u03bd\u03cc \u03c0\u03b5\u03c1\u03b9\u03b5\u03c7\u03cc\u03bc\u03b5\u03bd\u03bf. \u03a4\u03bf WordPress \u03b4\u03b5\u03bd \u03be\u03b1\u03bd\u03b1\u03b3\u03c1\u03ac\u03c6\u03b5\u03b9 \u03c4\u03bf \u03b1\u03c0\u03bf\u03b8\u03b7\u03ba\u03b5\u03c5\u03bc\u03ad\u03bd\u03bf \u03c0\u03b5\u03c1\u03b9\u03b5\u03c7\u03cc\u03bc\u03b5\u03bd\u03bf \u03c4\u03c9\u03bd \u03ac\u03c1\u03b8\u03c1\u03c9\u03bd \u03cc\u03c4\u03b1\u03bd \u03b1\u03c6\u03b1\u03b9\u03c1\u03b5\u03af\u03c4\u03b5 \u03ad\u03bd\u03b1 icon.<\/p>\n\n\n\n<p>\u039a\u03b1\u03c4\u03ac \u03c4\u03b7\u03bd \u03b1\u03c0\u03b5\u03bd\u03b5\u03c1\u03b3\u03bf\u03c0\u03bf\u03af\u03b7\u03c3\u03b7 \u03c4\u03bf\u03c5 plugin, \u03b1\u03c6\u03b1\u03b9\u03c1\u03ad\u03c3\u03c4\u03b5 \u03bf\u03bb\u03cc\u03ba\u03bb\u03b7\u03c1\u03b7 \u03c4\u03b7 \u03c3\u03c5\u03bb\u03bb\u03bf\u03b3\u03ae. \u0397 <code>wp_unregister_icon_collection()<\/code> \u03b1\u03c6\u03b1\u03b9\u03c1\u03b5\u03af \u03bc\u03b1\u03b6\u03af \u03cc\u03bb\u03b1 \u03c4\u03b1 icons \u03c4\u03b7\u03c2, \u03ac\u03c1\u03b1 \u03b4\u03b5\u03bd \u03c7\u03c1\u03b5\u03b9\u03ac\u03b6\u03b5\u03c4\u03b1\u03b9 \u03bd\u03b1 \u03ba\u03ac\u03bd\u03b5\u03c4\u03b5 loop \u03b3\u03b9\u03b1 \u03ba\u03b1\u03b8\u03ad\u03bd\u03b1 \u03be\u03b5\u03c7\u03c9\u03c1\u03b9\u03c3\u03c4\u03ac.<\/p>\n\n\n\n<div class=\"wp-block-kevinbatdorf-code-block-pro\" data-code-block-pro-font-family=\"Code-Pro-JetBrains-Mono\" style=\"font-size:.875rem;font-family:Code-Pro-JetBrains-Mono,ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;line-height:1.25rem;--cbp-tab-width:2;tab-size:var(--cbp-tab-width, 2)\"><span style=\"display:block;padding:16px 0 0 16px;margin-bottom:-1px;width:100%;text-align:left;background-color:#24292e\"><svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"54\" height=\"14\" viewBox=\"0 0 54 14\"><g fill=\"none\" fill-rule=\"evenodd\" transform=\"translate(1 1)\"><circle cx=\"6\" cy=\"6\" r=\"6\" fill=\"#FF5F56\" stroke=\"#E0443E\" stroke-width=\".5\"><\/circle><circle cx=\"26\" cy=\"6\" r=\"6\" fill=\"#FFBD2E\" stroke=\"#DEA123\" stroke-width=\".5\"><\/circle><circle cx=\"46\" cy=\"6\" r=\"6\" fill=\"#27C93F\" stroke=\"#1AAB29\" stroke-width=\".5\"><\/circle><\/g><\/svg><\/span><span role=\"button\" tabindex=\"0\" style=\"color:#e1e4e8;display:none\" aria-label=\"Copy\" class=\"code-block-pro-copy-button\"><pre class=\"code-block-pro-copy-button-pre\" aria-hidden=\"true\"><textarea class=\"code-block-pro-copy-button-textarea\" tabindex=\"-1\" aria-hidden=\"true\" readonly>register_deactivation_hook( __FILE__, 'myplugin_unregister_icons' );\n\nfunction myplugin_unregister_icons() {\n    wp_unregister_icon_collection( 'myplugin' );\n}\n<\/textarea><\/pre><svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" style=\"width:24px;height:24px\" fill=\"none\" viewBox=\"0 0 24 24\" stroke=\"currentColor\" stroke-width=\"2\"><path class=\"with-check\" stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2m-6 9l2 2 4-4\"><\/path><path class=\"without-check\" stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2\"><\/path><\/svg><\/span><pre class=\"shiki github-dark\" style=\"background-color:#24292e;color:#e1e4e8\" tabindex=\"0\"><code><span class=\"line\"><span style=\"color:#B392F0\">register_deactivation_hook<\/span><span style=\"color:#E1E4E8\">( <\/span><span style=\"color:#79B8FF\">__FILE__<\/span><span style=\"color:#E1E4E8\">, <\/span><span style=\"color:#9ECBFF\">'myplugin_unregister_icons'<\/span><span style=\"color:#E1E4E8\"> );<\/span><\/span>\n<span class=\"line\"><\/span>\n<span class=\"line\"><span style=\"color:#F97583\">function<\/span><span style=\"color:#B392F0\"> myplugin_unregister_icons<\/span><span style=\"color:#E1E4E8\">() {<\/span><\/span>\n<span class=\"line\"><span style=\"color:#B392F0\">    wp_unregister_icon_collection<\/span><span style=\"color:#E1E4E8\">( <\/span><span style=\"color:#9ECBFF\">'myplugin'<\/span><span style=\"color:#E1E4E8\"> );<\/span><\/span>\n<span class=\"line\"><span style=\"color:#E1E4E8\">}<\/span><\/span><\/code><\/pre><\/div>\n\n\n\n<h2 class=\"wp-block-heading\">\u03a3\u03c5\u03c7\u03bd\u03ad\u03c2 \u03b5\u03c1\u03c9\u03c4\u03ae\u03c3\u03b5\u03b9\u03c2<\/h2>\n\n\n\n<h3 class=\"wp-block-heading\">\u03a0\u03c1\u03ad\u03c0\u03b5\u03b9 \u03bd\u03b1 \u03b4\u03b7\u03bb\u03ce\u03c3\u03c9 \u03c3\u03c5\u03bb\u03bb\u03bf\u03b3\u03ae \u03c0\u03c1\u03b9\u03bd \u03b1\u03c0\u03cc \u03c4\u03b1 icons;<\/h3>\n\n\n\n<p>\u039d\u03b1\u03b9. \u03a4\u03b1 icons \u03c0\u03c1\u03ad\u03c0\u03b5\u03b9 \u03bd\u03b1 \u03b1\u03bd\u03ae\u03ba\u03bf\u03c5\u03bd \u03c3\u03b5 \u03c5\u03c0\u03ac\u03c1\u03c7\u03bf\u03c5\u03c3\u03b1 \u03c3\u03c5\u03bb\u03bb\u03bf\u03b3\u03ae, \u03b1\u03bb\u03bb\u03b9\u03ce\u03c2 \u03b4\u03b5\u03bd \u03b5\u03bc\u03c6\u03b1\u03bd\u03af\u03b6\u03bf\u03bd\u03c4\u03b1\u03b9 \u03c3\u03c4\u03bf\u03bd picker. \u0394\u03b7\u03bb\u03ce\u03c3\u03c4\u03b5 \u03c4\u03b7 \u03c3\u03c5\u03bb\u03bb\u03bf\u03b3\u03ae \u03c3\u03c4\u03bf <code>init<\/code> \u03bc\u03b5 \u03c4\u03b7\u03bd \u03c0\u03c1\u03bf\u03b5\u03c0\u03b9\u03bb\u03b5\u03b3\u03bc\u03ad\u03bd\u03b7 \u03c0\u03c1\u03bf\u03c4\u03b5\u03c1\u03b1\u03b9\u03cc\u03c4\u03b7\u03c4\u03b1 \u03ba\u03b1\u03b9 \u03c4\u03b1 icons \u03c3\u03b5 \u03c5\u03c8\u03b7\u03bb\u03cc\u03c4\u03b5\u03c1\u03b7 \u03c0\u03c1\u03bf\u03c4\u03b5\u03c1\u03b1\u03b9\u03cc\u03c4\u03b7\u03c4\u03b1, \u03cc\u03c0\u03c9\u03c2 <code>20<\/code>.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\">\u039c\u03c0\u03bf\u03c1\u03ce \u03bd\u03b1 \u03c3\u03c5\u03bd\u03b4\u03c5\u03ac\u03c3\u03c9 content \u03ba\u03b1\u03b9 file_path \u03c3\u03c4\u03b7\u03bd \u03af\u03b4\u03b9\u03b1 \u03c3\u03c5\u03bb\u03bb\u03bf\u03b3\u03ae;<\/h3>\n\n\n\n<p>\u039d\u03b1\u03b9. \u039a\u03ac\u03b8\u03b5 \u03ba\u03bb\u03ae\u03c3\u03b7 <code>wp_register_icon()<\/code> \u03b5\u03af\u03bd\u03b1\u03b9 \u03b1\u03bd\u03b5\u03be\u03ac\u03c1\u03c4\u03b7\u03c4\u03b7. \u03a7\u03c1\u03b7\u03c3\u03b9\u03bc\u03bf\u03c0\u03bf\u03b9\u03ae\u03c3\u03c4\u03b5 <code>content<\/code> \u03b3\u03b9\u03b1 \u03ad\u03bd\u03b1 \u03ae \u03b4\u03cd\u03bf icons \u03ba\u03b1\u03b9 <code>file_path<\/code> \u03b3\u03b9\u03b1 \u03c4\u03b1 \u03c5\u03c0\u03cc\u03bb\u03bf\u03b9\u03c0\u03b1\u00b7 \u03bc\u03b5\u03c4\u03ac \u03c4\u03b7\u03bd \u03ba\u03b1\u03c4\u03b1\u03c7\u03ce\u03c1\u03b9\u03c3\u03b7, \u03c4\u03bf WordPress \u03c4\u03b1 \u03c7\u03b5\u03b9\u03c1\u03af\u03b6\u03b5\u03c4\u03b1\u03b9 \u03bc\u03b5 \u03c4\u03bf\u03bd \u03af\u03b4\u03b9\u03bf \u03c4\u03c1\u03cc\u03c0\u03bf.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\">\u039b\u03b5\u03b9\u03c4\u03bf\u03c5\u03c1\u03b3\u03bf\u03cd\u03bd \u03c4\u03b1 custom icons \u03c9\u03c2 icons block;<\/h3>\n\n\n\n<p>\u039d\u03b1\u03b9. \u03a0\u03b5\u03c1\u03ac\u03c3\u03c4\u03b5 \u03c4\u03bf registered \u03cc\u03bd\u03bf\u03bc\u03b1, \u03cc\u03c0\u03c9\u03c2 <code>'myplugin\/star'<\/code>, \u03c3\u03c4\u03bf \u03ba\u03bb\u03b5\u03b9\u03b4\u03af <code>icon<\/code> \u03c4\u03bf\u03c5 <code>register_block_type()<\/code>. \u039f inserter \u03b5\u03bc\u03c6\u03b1\u03bd\u03af\u03b6\u03b5\u03b9 \u03c4\u03bf custom SVG \u03b1\u03bd\u03c4\u03af \u03b3\u03b9\u03b1 Dashicon, \u03c4\u03cc\u03c3\u03bf \u03c3\u03b5 JavaScript-registered blocks \u03cc\u03c3\u03bf \u03ba\u03b1\u03b9 \u03c3\u03b5 blocks \u03bc\u03cc\u03bd\u03bf \u03bc\u03b5 PHP.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\">\u0397 wp_get_icon() \u03b5\u03c0\u03b9\u03c3\u03c4\u03c1\u03ad\u03c6\u03b5\u03b9 HTML \u03ae string;<\/h3>\n\n\n\n<p>\u0397 <code>wp_get_icon()<\/code> \u03b5\u03c0\u03b9\u03c3\u03c4\u03c1\u03ad\u03c6\u03b5\u03b9 \u03c4\u03bf SVG \u03c9\u03c2 string. \u039c\u03c0\u03bf\u03c1\u03b5\u03af\u03c4\u03b5 \u03bd\u03b1 \u03c4\u03bf \u03b5\u03bc\u03c6\u03b1\u03bd\u03af\u03c3\u03b5\u03c4\u03b5 \u03bc\u03b5 <code>echo<\/code> \u03ae \u03bd\u03b1 \u03c4\u03bf \u03c4\u03c5\u03bb\u03af\u03be\u03b5\u03c4\u03b5 \u03c3\u03c4\u03bf \u03b4\u03b9\u03ba\u03cc \u03c3\u03b1\u03c2 HTML. \u03a4\u03bf \u03b4\u03b5\u03cd\u03c4\u03b5\u03c1\u03bf array, <code>$args<\/code>, \u03b4\u03ad\u03c7\u03b5\u03c4\u03b1\u03b9 <code>size<\/code>, <code>class<\/code>, <code>label<\/code> \u03b3\u03b9\u03b1 \u03c4\u03bf <code>aria-label<\/code> \u03ba\u03b1\u03b9 <code>title<\/code>.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\">\u03a0\u03bf\u03b9\u03b1 attributes \u03c0\u03c1\u03ad\u03c0\u03b5\u03b9 \u03bd\u03b1 \u03b1\u03c6\u03b1\u03b9\u03c1\u03ad\u03c3\u03c9 \u03b1\u03c0\u03cc \u03ad\u03bd\u03b1 SVG;<\/h3>\n\n\n\n<p>\u0391\u03c6\u03b1\u03b9\u03c1\u03ad\u03c3\u03c4\u03b5 \u03c3\u03c4\u03b1\u03b8\u03b5\u03c1\u03ac \u03c7\u03c1\u03ce\u03bc\u03b1\u03c4\u03b1 <code>fill<\/code> \u03ba\u03b1\u03b9 <code>stroke<\/code>, \u03ba\u03b1\u03b8\u03ce\u03c2 \u03ba\u03b1\u03b9 \u03c4\u03b1 <code>width<\/code> \u03ba\u03b1\u03b9 <code>height<\/code> \u03b1\u03c0\u03cc \u03c4\u03bf root <code>&lt;svg&gt;<\/code>, \u03b1\u03bb\u03bb\u03ac \u03ba\u03c1\u03b1\u03c4\u03ae\u03c3\u03c4\u03b5 \u03c4\u03bf <code>viewBox<\/code>. \u0391\u03c6\u03b1\u03b9\u03c1\u03ad\u03c3\u03c4\u03b5 \u03b5\u03c0\u03af\u03c3\u03b7\u03c2 blocks <code>&lt;style&gt;<\/code>, scripts \u03ba\u03b1\u03b9 \u03bf\u03c4\u03b9\u03b4\u03ae\u03c0\u03bf\u03c4\u03b5 \u03c0\u03b5\u03c1\u03b9\u03c4\u03c4\u03cc. \u039a\u03c1\u03b1\u03c4\u03ae\u03c3\u03c4\u03b5 \u03c4\u03b1 \u03b4\u03bf\u03bc\u03b9\u03ba\u03ac attributes \u03ba\u03b1\u03b9 \u03c7\u03c1\u03b7\u03c3\u03b9\u03bc\u03bf\u03c0\u03bf\u03b9\u03ae\u03c3\u03c4\u03b5 <code>currentColor<\/code> \u03b3\u03b9\u03b1 \u03b1\u03bd\u03b1\u03c6\u03bf\u03c1\u03ad\u03c2 \u03c7\u03c1\u03ce\u03bc\u03b1\u03c4\u03bf\u03c2.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\">\u039c\u03c0\u03bf\u03c1\u03ce \u03bd\u03b1 \u03b4\u03b7\u03bb\u03ce\u03c3\u03c9 icons \u03b1\u03c0\u03cc theme \u03b1\u03bd\u03c4\u03af \u03b3\u03b9\u03b1 plugin;<\/h3>\n\n\n\n<p>\u039d\u03b1\u03b9. \u0397 \u03af\u03b4\u03b9\u03b1 \u03ba\u03bb\u03ae\u03c3\u03b7 <code>wp_register_icon()<\/code> \u03bb\u03b5\u03b9\u03c4\u03bf\u03c5\u03c1\u03b3\u03b5\u03af \u03c3\u03c4\u03bf <code>functions.php<\/code> \u03b5\u03bd\u03cc\u03c2 theme, \u03bc\u03b5 \u03c4\u03bf <code>get_stylesheet_directory()<\/code> \u03b3\u03b9\u03b1 \u03c4\u03bf file path. \u03a4\u03b1 icons \u03cc\u03bc\u03c9\u03c2 \u03b8\u03b1 \u03b5\u03be\u03b1\u03c6\u03b1\u03bd\u03b9\u03c3\u03c4\u03bf\u03cd\u03bd \u03cc\u03c4\u03b1\u03bd \u03b1\u03bb\u03bb\u03ac\u03be\u03b5\u03c4\u03b5 theme.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\">\u03a4\u03b9 \u03b3\u03af\u03bd\u03b5\u03c4\u03b1\u03b9 \u03cc\u03c4\u03b1\u03bd \u03b4\u03cd\u03bf \u03c3\u03c5\u03bb\u03bb\u03bf\u03b3\u03ad\u03c2 \u03ad\u03c7\u03bf\u03c5\u03bd icon \u03bc\u03b5 \u03c4\u03bf \u03af\u03b4\u03b9\u03bf \u03cc\u03bd\u03bf\u03bc\u03b1;<\/h3>\n\n\n\n<p>\u039f\u03b9 \u03c3\u03c5\u03bb\u03bb\u03bf\u03b3\u03ad\u03c2 \u03bb\u03b5\u03b9\u03c4\u03bf\u03c5\u03c1\u03b3\u03bf\u03cd\u03bd \u03c9\u03c2 namespace. \u03a4\u03b1 <code>myplugin\/heart<\/code> \u03ba\u03b1\u03b9 <code>anotherplugin\/heart<\/code> \u03c3\u03c5\u03bd\u03c5\u03c0\u03ac\u03c1\u03c7\u03bf\u03c5\u03bd \u03c7\u03c9\u03c1\u03af\u03c2 \u03c3\u03cd\u03b3\u03ba\u03c1\u03bf\u03c5\u03c3\u03b7, \u03b5\u03c0\u03b5\u03b9\u03b4\u03ae \u03bc\u03bf\u03bd\u03b1\u03b4\u03b9\u03ba\u03cc \u03b5\u03af\u03bd\u03b1\u03b9 \u03c4\u03bf \u03c0\u03bb\u03ae\u03c1\u03b5\u03c2 \u03cc\u03bd\u03bf\u03bc\u03b1 \u03c0\u03bf\u03c5 \u03c0\u03b5\u03c1\u03b9\u03bb\u03b1\u03bc\u03b2\u03ac\u03bd\u03b5\u03b9 \u03c4\u03bf \u03c0\u03c1\u03cc\u03b8\u03b5\u03bc\u03b1 \u03c4\u03b7\u03c2 \u03c3\u03c5\u03bb\u03bb\u03bf\u03b3\u03ae\u03c2.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\">\u039a\u03b1\u03b8\u03b1\u03c1\u03af\u03b6\u03b5\u03b9 \u03c4\u03bf WordPress \u03c4\u03b1 SVG \u03ba\u03b1\u03c4\u03ac \u03c4\u03b7\u03bd \u03ba\u03b1\u03c4\u03b1\u03c7\u03ce\u03c1\u03b9\u03c3\u03b7;<\/h3>\n\n\n\n<p>\u038c\u03c7\u03b9. \u03a4\u03bf WordPress \u03b4\u03b5\u03bd \u03b1\u03bb\u03bb\u03ac\u03b6\u03b5\u03b9 \u03c4\u03bf SVG \u03ba\u03b1\u03c4\u03ac \u03c4\u03b7\u03bd \u03ba\u03b1\u03c4\u03b1\u03c7\u03ce\u03c1\u03b9\u03c3\u03b7: \u03c3\u03b5\u03c1\u03b2\u03af\u03c1\u03b5\u03b9 \u03b1\u03ba\u03c1\u03b9\u03b2\u03ce\u03c2 \u03c4\u03bf string \u03c0\u03bf\u03c5 \u03b4\u03ce\u03c3\u03b1\u03c4\u03b5 \u03ae \u03c4\u03bf \u03c0\u03b5\u03c1\u03b9\u03b5\u03c7\u03cc\u03bc\u03b5\u03bd\u03bf \u03c4\u03bf\u03c5 \u03b1\u03c1\u03c7\u03b5\u03af\u03bf\u03c5 \u03c0\u03bf\u03c5 \u03b4\u03b5\u03af\u03be\u03b1\u03c4\u03b5. \u039a\u03b1\u03b8\u03b1\u03c1\u03af\u03c3\u03c4\u03b5 \u03c4\u03b1 SVG \u03c0\u03c1\u03b9\u03bd \u03c4\u03b1 \u03b4\u03b9\u03b1\u03bd\u03b5\u03af\u03bc\u03b5\u03c4\u03b5 \u03ba\u03b1\u03b9 \u03b1\u03c6\u03b1\u03b9\u03c1\u03ad\u03c3\u03c4\u03b5 scripts, \u03b5\u03be\u03c9\u03c4\u03b5\u03c1\u03b9\u03ba\u03ad\u03c2 \u03b1\u03bd\u03b1\u03c6\u03bf\u03c1\u03ad\u03c2 \u03ba\u03b1\u03b9 \u03ba\u03ac\u03b8\u03b5 \u03bc\u03b7 \u03b1\u03c0\u03b1\u03c1\u03b1\u03af\u03c4\u03b7\u03c4\u03bf \u03c3\u03c4\u03bf\u03b9\u03c7\u03b5\u03af\u03bf.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\">\u0395\u03bd\u03c3\u03c9\u03bc\u03b1\u03c4\u03ce\u03c3\u03c4\u03b5 \u03c4\u03b7 \u03c3\u03c5\u03bb\u03bb\u03bf\u03b3\u03ae \u03c3\u03c4\u03bf plugin \u03c3\u03b1\u03c2<\/h2>\n\n\n\n<p>\u0394\u03b7\u03bb\u03ce\u03c3\u03c4\u03b5 \u03c0\u03c1\u03ce\u03c4\u03b1 \u03c4\u03b7 \u03c3\u03c5\u03bb\u03bb\u03bf\u03b3\u03ae, \u03c0\u03c1\u03bf\u03c4\u03b9\u03bc\u03ae\u03c3\u03c4\u03b5 <code>file_path<\/code> \u03ba\u03b1\u03b9 \u03c4\u03b7 \u03bc\u03b1\u03b6\u03b9\u03ba\u03ae \u03ba\u03b1\u03c4\u03b1\u03c7\u03ce\u03c1\u03b9\u03c3\u03b7 \u03bc\u03b5 <code>glob()<\/code> \u03cc\u03c4\u03b1\u03bd \u03c3\u03c5\u03bd\u03c4\u03b7\u03c1\u03b5\u03af\u03c4\u03b5 \u03b2\u03b9\u03b2\u03bb\u03b9\u03bf\u03b8\u03ae\u03ba\u03b7 SVG, \u03ba\u03b1\u03b9 \u03ba\u03c1\u03b1\u03c4\u03ae\u03c3\u03c4\u03b5 <code>currentColor<\/code> \u03c3\u03c4\u03b1 \u03b1\u03c1\u03c7\u03b5\u03af\u03b1 \u03c3\u03b1\u03c2. \u039c\u03b5 \u03bc\u03af\u03b1 \u03ba\u03b1\u03c4\u03b1\u03c7\u03ce\u03c1\u03b9\u03c3\u03b7, \u03c4\u03bf \u03af\u03b4\u03b9\u03bf icon \u03bc\u03c0\u03bf\u03c1\u03b5\u03af \u03bd\u03b1 \u03c4\u03c1\u03bf\u03c6\u03bf\u03b4\u03bf\u03c4\u03b5\u03af \u03c4\u03bf\u03bd block editor, \u03c4\u03b1 PHP templates, \u03c4\u03bf REST API \u03ba\u03b1\u03b9 \u03c4\u03bf icon \u03b5\u03bd\u03cc\u03c2 custom block \u03c7\u03c9\u03c1\u03af\u03c2 JavaScript build step.<\/p>\n\n\n<div class=\"references-section\">\n                <h2>\u0391\u03bd\u03b1\u03c6\u03bf\u03c1\u03ad\u03c2 \/ \u03a0\u03b7\u03b3\u03ad\u03c2<\/h2>\n                <ul class=\"references-list\"><li><a href=\"https:\/\/wpvibes.com\/blog\/wordpress-custom-icons\/\" target=\"_blank\" rel=\"noopener noreferrer\">Custom SVG Icons: An Exciting WordPress 7.1 Feature<\/a><\/li><\/ul>\n            <\/div>","protected":false},"excerpt":{"rendered":"<p>\u03a4\u03bf WordPress 7.1 \u03c6\u03ad\u03c1\u03bd\u03b5\u03b9 API \u03b3\u03b9\u03b1 custom SVG icons \u03c7\u03c9\u03c1\u03af\u03c2 JavaScript build step. \u0394\u03b5\u03af\u03c4\u03b5 \u03c0\u03ce\u03c2 \u03b4\u03b7\u03bb\u03ce\u03bd\u03b5\u03c4\u03b5 \u03c3\u03c5\u03bb\u03bb\u03bf\u03b3\u03ad\u03c2, \u03c6\u03bf\u03c1\u03c4\u03ce\u03bd\u03b5\u03c4\u03b5 SVG \u03b1\u03c0\u03cc \u03b1\u03c1\u03c7\u03b5\u03af\u03b1 \u03ba\u03b1\u03b9 \u03c4\u03b1 \u03c7\u03c1\u03b7\u03c3\u03b9\u03bc\u03bf\u03c0\u03bf\u03b9\u03b5\u03af\u03c4\u03b5 \u03c3\u03b5 blocks \u03ba\u03b1\u03b9 PHP.<\/p>\n","protected":false},"author":68,"featured_media":256,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[2],"tags":[137,26,52,74,10],"class_list":["post-259","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-wordpress","tag-block-editor","tag-php","tag-rest-api","tag-svg","tag-wordpress"],"_links":{"self":[{"href":"https:\/\/helloblog.io\/el\/wp-json\/wp\/v2\/posts\/259","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/helloblog.io\/el\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/helloblog.io\/el\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/helloblog.io\/el\/wp-json\/wp\/v2\/users\/68"}],"replies":[{"embeddable":true,"href":"https:\/\/helloblog.io\/el\/wp-json\/wp\/v2\/comments?post=259"}],"version-history":[{"count":0,"href":"https:\/\/helloblog.io\/el\/wp-json\/wp\/v2\/posts\/259\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/helloblog.io\/el\/wp-json\/wp\/v2\/media\/256"}],"wp:attachment":[{"href":"https:\/\/helloblog.io\/el\/wp-json\/wp\/v2\/media?parent=259"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/helloblog.io\/el\/wp-json\/wp\/v2\/categories?post=259"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/helloblog.io\/el\/wp-json\/wp\/v2\/tags?post=259"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}