{"id":244,"date":"2026-08-14T14:01:14","date_gmt":"2026-08-14T12:01:14","guid":{"rendered":"https:\/\/helloblog.io\/bg\/sobstveni-svg-ikoni-v-wordpress-7-1\/"},"modified":"2026-08-14T14:01:14","modified_gmt":"2026-08-14T12:01:14","slug":"sobstveni-svg-ikoni-v-wordpress-7-1","status":"publish","type":"post","link":"https:\/\/helloblog.io\/bg\/sobstveni-svg-ikoni-v-wordpress-7-1\/","title":{"rendered":"\u0421\u043e\u0431\u0441\u0442\u0432\u0435\u043d\u0438 SVG \u0438\u043a\u043e\u043d\u0438 \u0432 WordPress 7.1: \u043f\u0440\u0430\u043a\u0442\u0438\u0447\u0435\u0441\u043a\u043e \u0440\u044a\u043a\u043e\u0432\u043e\u0434\u0441\u0442\u0432\u043e"},"content":{"rendered":"\n<p>WordPress 7.1 \u0434\u043e\u0431\u0430\u0432\u044f \u043f\u0443\u0431\u043b\u0438\u0447\u0435\u043d API \u0437\u0430 \u0441\u043e\u0431\u0441\u0442\u0432\u0435\u043d\u0438 SVG \u0438\u043a\u043e\u043d\u0438. \u0412\u043c\u0435\u0441\u0442\u043e JavaScript, build \u043f\u0440\u043e\u0446\u0435\u0441 \u0438\u043b\u0438 \u043d\u0435\u0441\u0438\u0433\u0443\u0440\u043d\u043e \u0437\u0430\u043e\u0431\u0438\u043a\u043e\u043b\u043d\u043e \u0440\u0435\u0448\u0435\u043d\u0438\u0435, \u043c\u043e\u0436\u0435\u0448 \u0434\u0430 \u0440\u0435\u0433\u0438\u0441\u0442\u0440\u0438\u0440\u0430\u0448 \u0438\u043a\u043e\u043d\u0438 \u043e\u0442 \u0440\u0430\u0437\u0448\u0438\u0440\u0435\u043d\u0438\u0435 \u0438 \u0434\u0430 \u0433\u0438 \u0438\u0437\u043f\u043e\u043b\u0437\u0432\u0430\u0448 \u0432 \u0438\u0437\u0431\u043e\u0440\u0430 \u043d\u0430 \u0431\u043b\u043e\u043a\u0430 <code>core\/icon<\/code>, \u0432 PHP \u0448\u0430\u0431\u043b\u043e\u043d\u0438 \u0438 \u043f\u0440\u0435\u0437 REST API.<\/p>\n\n\n\n<p>\u0429\u0435 \u0441\u044a\u0437\u0434\u0430\u0434\u0435\u043c \u043c\u0430\u043b\u043a\u043e \u0440\u0430\u0437\u0448\u0438\u0440\u0435\u043d\u0438\u0435 <code>myplugin-custom-icons<\/code>: \u0442\u043e \u0434\u043e\u0431\u0430\u0432\u044f \u043a\u043e\u043b\u0435\u043a\u0446\u0438\u044f, \u0440\u0435\u0433\u0438\u0441\u0442\u0440\u0438\u0440\u0430 \u0441\u044a\u0440\u0446\u0435 \u0434\u0438\u0440\u0435\u043a\u0442\u043d\u043e \u043e\u0442 SVG \u043a\u043e\u0434, \u0437\u0432\u0435\u0437\u0434\u0430 \u0438 \u043e\u0442\u043c\u0435\u0442\u043a\u0430 \u043e\u0442 \u0444\u0430\u0439\u043b\u043e\u0432\u0435, \u0430\u0432\u0442\u043e\u043c\u0430\u0442\u0438\u0447\u043d\u043e \u0437\u0430\u0440\u0435\u0436\u0434\u0430 \u0446\u044f\u043b\u0430 \u043f\u0430\u043f\u043a\u0430 \u0441 \u0438\u043a\u043e\u043d\u0438 \u0438 \u043f\u0440\u0435\u0434\u043b\u0430\u0433\u0430 \u043a\u0440\u0430\u0442\u044a\u043a \u043a\u043e\u0434 \u0437\u0430 \u0441\u044a\u0434\u044a\u0440\u0436\u0430\u043d\u0438\u0435\u0442\u043e. \u0429\u0435 \u0432\u0438\u0434\u0438\u0448 \u0438 \u043a\u0430\u043a \u0441\u044a\u0449\u0430\u0442\u0430 \u0438\u043a\u043e\u043d\u0430 \u0432\u043b\u0438\u0437\u0430 \u043a\u0430\u0442\u043e \u0438\u043a\u043e\u043d\u0430 \u043d\u0430 \u0441\u043e\u0431\u0441\u0442\u0432\u0435\u043d \u0431\u043b\u043e\u043a \u0431\u0435\u0437 build \u0441\u0442\u044a\u043f\u043a\u0430.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\">\u041a\u0430\u043a\u0432\u043e \u0449\u0435 \u0441\u044a\u0437\u0434\u0430\u0434\u0435\u0448<\/h2>\n\n\n\n<ul class=\"wp-block-list\">\n\n<li>\u0420\u0430\u0437\u0448\u0438\u0440\u0435\u043d\u0438\u0435 <code>myplugin-custom-icons<\/code> \u0441 \u043a\u043e\u043b\u0435\u043a\u0446\u0438\u044f \u0438\u043a\u043e\u043d\u0438 <code>myplugin<\/code>.<\/li>\n\n\n<li>\u0422\u0440\u0438 \u0433\u043e\u0442\u043e\u0432\u0438 \u0438\u043a\u043e\u043d\u0438: \u0441\u044a\u0440\u0446\u0435 \u0447\u0440\u0435\u0437 \u0432\u0433\u0440\u0430\u0434\u0435\u043d SVG, \u043f\u043b\u044e\u0441 \u0437\u0432\u0435\u0437\u0434\u0430 \u0438 \u043e\u0442\u043c\u0435\u0442\u043a\u0430 \u043e\u0442 <code>.svg<\/code> \u0444\u0430\u0439\u043b\u043e\u0432\u0435.<\/li>\n\n\n<li>\u0428\u0430\u0431\u043b\u043e\u043d \u0437\u0430 \u043c\u0430\u0441\u043e\u0432\u0430 \u0440\u0435\u0433\u0438\u0441\u0442\u0440\u0430\u0446\u0438\u044f, \u043a\u043e\u0439\u0442\u043e \u0447\u0435\u0442\u0435 \u0432\u0441\u0435\u043a\u0438 SVG \u0444\u0430\u0439\u043b \u0432 \u043f\u0430\u043f\u043a\u0430.<\/li>\n\n\n<li>\u041a\u0440\u0430\u0442\u044a\u043a \u043a\u043e\u0434, \u0441 \u043a\u043e\u0439\u0442\u043e \u0432\u043c\u044a\u043a\u0432\u0430\u0448 \u0440\u0435\u0433\u0438\u0441\u0442\u0440\u0438\u0440\u0430\u043d\u0430 \u0438\u043a\u043e\u043d\u0430 \u0432 \u043f\u0443\u0431\u043b\u0438\u043a\u0430\u0446\u0438\u0438.<\/li>\n\n\n<li>\u0418\u043a\u043e\u043d\u0430 \u0437\u0430 \u0441\u043e\u0431\u0441\u0442\u0432\u0435\u043d \u0431\u043b\u043e\u043a \u0447\u0440\u0435\u0437 <code>register_block_type()<\/code>.<\/li>\n\n\n<li>\u0418\u043d\u0442\u0435\u0433\u0440\u0430\u0446\u0438\u044f \u0432 \u0440\u0435\u0434\u0430\u043a\u0442\u043e\u0440\u0430, PHP \u0438 REST API \u043e\u0442 \u0435\u0434\u043d\u0430 \u0440\u0435\u0433\u0438\u0441\u0442\u0440\u0430\u0446\u0438\u044f.<\/li>\n\n<\/ul>\n\n\n\n<h2 class=\"wp-block-heading\">\u041a\u0430\u043a\u0432\u043e \u0442\u0438 \u0442\u0440\u044f\u0431\u0432\u0430<\/h2>\n\n\n\n<p>\u0420\u0430\u0431\u043e\u0442\u0438 \u0441 WordPress 7.1 \u0438\u043b\u0438 \u043f\u043e-\u043d\u043e\u0432\u0430 \u0432\u0435\u0440\u0441\u0438\u044f; \u0437\u0430 \u0440\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u043a\u0430 \u0441\u0442\u0430\u0432\u0430 \u0438 7.1 RC. \u041f\u043e\u0434\u0433\u043e\u0442\u0432\u0438 \u043d\u044f\u043a\u043e\u043b\u043a\u043e SVG \u0444\u0430\u0439\u043b\u0430, \u043b\u043e\u043a\u0430\u043b\u043d\u0430 \u0441\u0440\u0435\u0434\u0430 \u043a\u0430\u0442\u043e LocalWP, WordPress Studio \u0438\u043b\u0438 <code>wp-env<\/code> \u0438 \u0431\u0430\u0437\u043e\u0432\u0438 \u043f\u043e\u0437\u043d\u0430\u043d\u0438\u044f \u043f\u043e PHP. \u0412\u0435\u0440\u0441\u0438\u044f 7.1 \u0435 \u043f\u043b\u0430\u043d\u0438\u0440\u0430\u043d\u0430 \u0437\u0430 19 \u0430\u0432\u0433\u0443\u0441\u0442 2026 \u0433.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\">API-\u0442\u043e \u043d\u0430\u043a\u0440\u0430\u0442\u043a\u043e<\/h2>\n\n\n\n<p>API-\u0442\u043e \u0438\u043c\u0430 \u0442\u0440\u0438 \u043e\u0441\u043d\u043e\u0432\u043d\u0438 \u0444\u0443\u043d\u043a\u0446\u0438\u0438. <code>wp_register_icon_collection( $name, $args )<\/code> \u0441\u044a\u0437\u0434\u0430\u0432\u0430 \u0438\u043c\u0435\u043d\u0443\u0432\u0430\u043d\u0430 \u0433\u0440\u0443\u043f\u0430, <code>wp_register_icon( $name, $args )<\/code> \u0434\u043e\u0431\u0430\u0432\u044f \u043e\u0442\u0434\u0435\u043b\u043d\u0430 \u0438\u043a\u043e\u043d\u0430, \u0430 <code>wp_get_icon( $name, $args )<\/code> \u0432\u0440\u044a\u0449\u0430 SVG \u043d\u0438\u0437\u0430 \u0437\u0430 \u0432\u0438\u0437\u0443\u0430\u043b\u0438\u0437\u0438\u0440\u0430\u043d\u0435 \u0432 PHP.<\/p>\n\n\n\n<p>\u0412\u0441\u044f\u043a\u0430 \u0438\u043a\u043e\u043d\u0430 \u043f\u0440\u0438\u043d\u0430\u0434\u043b\u0435\u0436\u0438 \u043a\u044a\u043c \u043a\u043e\u043b\u0435\u043a\u0446\u0438\u044f. \u0418\u043c\u0435\u0442\u043e \u045d \u0441\u0442\u0430\u0432\u0430 \u043f\u0440\u0435\u0444\u0438\u043a\u0441 \u2013 \u043d\u0430\u043f\u0440\u0438\u043c\u0435\u0440 <code>core\/plus<\/code> \u0438 <code>myplugin\/plus<\/code> \u0441\u0430 \u0440\u0430\u0437\u043b\u0438\u0447\u043d\u0438 \u0437\u0430\u043f\u0438\u0441\u0438. \u0422\u043e\u0432\u0430 \u043f\u0440\u0435\u0434\u043e\u0442\u0432\u0440\u0430\u0442\u044f\u0432\u0430 \u043a\u043e\u043d\u0444\u043b\u0438\u043a\u0442\u0438\u0442\u0435 \u0441 \u0438\u043a\u043e\u043d\u0438\u0442\u0435 \u043e\u0442 \u044f\u0434\u0440\u043e\u0442\u043e \u043d\u0430 WordPress \u0438 \u0441 \u0434\u0440\u0443\u0433\u0438 \u0440\u0430\u0437\u0448\u0438\u0440\u0435\u043d\u0438\u044f.<\/p>\n\n\n\n<p>\u041f\u0440\u0438 \u0440\u0435\u0433\u0438\u0441\u0442\u0440\u0430\u0446\u0438\u044f\u0442\u0430 \u043f\u043e\u0434\u0430\u0432\u0430\u0448 SVG \u043f\u043e \u0435\u0434\u0438\u043d \u043e\u0442 \u0434\u0432\u0430 \u043d\u0430\u0447\u0438\u043d\u0430: <code>content<\/code> \u0441\u044a\u0434\u044a\u0440\u0436\u0430 SVG markup \u043a\u0430\u0442\u043e \u043d\u0438\u0437 \u0432 PHP, \u0430 <code>file_path<\/code> \u0441\u043e\u0447\u0438 \u0430\u0431\u0441\u043e\u043b\u044e\u0442\u043d\u0438\u044f \u043f\u044a\u0442 \u043a\u044a\u043c <code>.svg<\/code> \u0444\u0430\u0439\u043b. \u041d\u0435 \u043a\u043e\u043c\u0431\u0438\u043d\u0438\u0440\u0430\u0439 \u0434\u0432\u0430\u0442\u0430 \u0430\u0440\u0433\u0443\u043c\u0435\u043d\u0442\u0430 \u0437\u0430 \u0435\u0434\u043d\u0430 \u0438\u043a\u043e\u043d\u0430. <code>content<\/code> \u0435 \u0443\u0434\u043e\u0431\u0435\u043d \u0437\u0430 \u0435\u0434\u043d\u0430-\u0434\u0432\u0435 \u0438\u043a\u043e\u043d\u0438, \u0434\u043e\u043a\u0430\u0442\u043e <code>file_path<\/code> \u0435 \u043f\u043e-\u043f\u043e\u0434\u0445\u043e\u0434\u044f\u0449 \u0437\u0430 \u0431\u0438\u0431\u043b\u0438\u043e\u0442\u0435\u043a\u0430 \u0432\u044a\u0432 \u0444\u0430\u0439\u043b\u043e\u0432\u0430 \u043f\u0430\u043f\u043a\u0430.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\">1. \u0421\u044a\u0437\u0434\u0430\u0439 \u0440\u0430\u0437\u0448\u0438\u0440\u0435\u043d\u0438\u0435\u0442\u043e \u0438 \u043a\u043e\u043b\u0435\u043a\u0446\u0438\u044f\u0442\u0430<\/h2>\n\n\n\n<p>\u041f\u044a\u0440\u0432\u043e \u0440\u0435\u0433\u0438\u0441\u0442\u0440\u0438\u0440\u0430\u0439 \u043a\u043e\u043b\u0435\u043a\u0446\u0438\u044f\u0442\u0430. \u0410\u043a\u043e \u0434\u043e\u0431\u0430\u0432\u0438\u0448 \u0438\u043a\u043e\u043d\u0430 \u043a\u044a\u043c \u043d\u0435\u0441\u044a\u0449\u0435\u0441\u0442\u0432\u0443\u0432\u0430\u0449\u0430 \u043a\u043e\u043b\u0435\u043a\u0446\u0438\u044f, \u0442\u044f \u043d\u044f\u043c\u0430 \u0434\u0430 \u0441\u0435 \u043f\u043e\u044f\u0432\u0438 \u0432 \u0438\u0437\u0431\u043e\u0440\u0430 \u043d\u0430 \u0438\u043a\u043e\u043d\u0438 \u0438 WordPress \u043d\u044f\u043c\u0430 \u0434\u0430 \u043f\u043e\u043a\u0430\u0436\u0435 \u0433\u0440\u0435\u0448\u043a\u0430.<\/p>\n\n\n\n<p>\u0421\u044a\u0437\u0434\u0430\u0439 \u0441\u043b\u0435\u0434\u043d\u0430\u0442\u0430 \u0441\u0442\u0440\u0443\u043a\u0442\u0443\u0440\u0430 \u0432 <code>wp-content\/plugins\/<\/code>:<\/p>\n\n\n<a href=\"https:\/\/github.com\/webtechhardik\/wpviibes-custom-icons\" class=\"download-card\" download>\n                <span class=\"download-icon\"><i class=\"fa-duotone fa-file-arrow-down\"><\/i><\/span>\n                <span class=\"download-info\">\n                    <span class=\"download-title\">\u0421\u0442\u0440\u0443\u043a\u0442\u0443\u0440\u0430 \u043d\u0430 \u0440\u0430\u0437\u0448\u0438\u0440\u0435\u043d\u0438\u0435\u0442\u043e<\/span>\n                    <span class=\"download-meta\"><span class=\"download-filename\">\/wp-content\/plugins\/myplugin-custom-icons\/<\/span><span class=\"download-size\">.<\/span><\/span>\n                <\/span>\n                <span class=\"download-action\"><i class=\"fa-duotone fa-arrow-down-to-line\"><\/i><\/span>\n            <\/a>\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>\u0414\u043e\u0431\u0430\u0432\u0438 \u0433\u043b\u0430\u0432\u043d\u0438\u044f \u0444\u0430\u0439\u043b <code>myplugin-custom-icons.php<\/code>. \u041a\u043e\u043b\u0435\u043a\u0446\u0438\u044f\u0442\u0430 \u0441\u0435 \u0437\u0430\u043a\u0430\u0447\u0430 \u043a\u044a\u043c <code>init<\/code> \u0441 \u043f\u0440\u0438\u043e\u0440\u0438\u0442\u0435\u0442 \u043f\u043e \u043f\u043e\u0434\u0440\u0430\u0437\u0431\u0438\u0440\u0430\u043d\u0435 \u2013 10.<\/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: Register custom SVG icons for 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: Register custom SVG icons for 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>\u041f\u0440\u0435\u0444\u0438\u043a\u0441\u044a\u0442 \u043d\u0430 \u0432\u0441\u0438\u0447\u043a\u0438 \u0441\u043b\u0435\u0434\u0432\u0430\u0449\u0438 \u0438\u043a\u043e\u043d\u0438 \u0449\u0435 \u0431\u044a\u0434\u0435 <code>myplugin<\/code>: \u043d\u0430\u043f\u0440\u0438\u043c\u0435\u0440 <code>myplugin\/heart<\/code> \u0438 <code>myplugin\/star<\/code>. \u0421\u0442\u043e\u0439\u043d\u043e\u0441\u0442\u0442\u0430 \u043d\u0430 <code>label<\/code> \u0441\u0442\u0430\u0432\u0430 \u0437\u0430\u0433\u043b\u0430\u0432\u0438\u0435 \u043d\u0430 \u0441\u0435\u043a\u0446\u0438\u044f\u0442\u0430 \u0432 \u0438\u0437\u0431\u043e\u0440\u0430 \u043d\u0430 \u0438\u043a\u043e\u043d\u0438. \u0410\u043a\u0442\u0438\u0432\u0438\u0440\u0430\u0439 \u0440\u0430\u0437\u0448\u0438\u0440\u0435\u043d\u0438\u0435\u0442\u043e \u043e\u0442 \u201e\u0420\u0430\u0437\u0448\u0438\u0440\u0435\u043d\u0438\u044f \u2192 \u0418\u043d\u0441\u0442\u0430\u043b\u0438\u0440\u0430\u043d\u0438 \u0440\u0430\u0437\u0448\u0438\u0440\u0435\u043d\u0438\u044f\u201c; \u043a\u043e\u043b\u0435\u043a\u0446\u0438\u044f\u0442\u0430 \u043e\u0449\u0435 \u043d\u044f\u043c\u0430 \u0434\u0430 \u0441\u0435 \u0432\u0438\u0436\u0434\u0430, \u0437\u0430\u0449\u043e\u0442\u043e \u043d\u0435 \u0441\u044a\u0434\u044a\u0440\u0436\u0430 \u0438\u043a\u043e\u043d\u0438.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\">2. \u0420\u0435\u0433\u0438\u0441\u0442\u0440\u0438\u0440\u0430\u0439 SVG \u0438\u043a\u043e\u043d\u0438 \u043f\u043e \u0434\u0432\u0430 \u043d\u0430\u0447\u0438\u043d\u0430<\/h2>\n\n\n\n<p>\u041c\u043e\u0436\u0435\u0448 \u0434\u0430 \u0441\u043c\u0435\u0441\u0432\u0430\u0448 \u0432\u0433\u0440\u0430\u0434\u0435\u043d\u0438 SVG \u043d\u0438\u0437\u043e\u0432\u0435 \u0438 SVG \u0444\u0430\u0439\u043b\u043e\u0432\u0435 \u0432 \u0435\u0434\u043d\u0430 \u043a\u043e\u043b\u0435\u043a\u0446\u0438\u044f. \u0412 \u0442\u043e\u0437\u0438 \u043f\u0440\u0438\u043c\u0435\u0440 \u0441\u044a\u0440\u0446\u0435\u0442\u043e \u0435 \u0432 PHP \u0444\u0430\u0439\u043b\u0430, \u0430 \u0437\u0432\u0435\u0437\u0434\u0430\u0442\u0430 \u0438 \u043e\u0442\u043c\u0435\u0442\u043a\u0430\u0442\u0430 \u0441\u0430 \u043d\u0430 \u0434\u0438\u0441\u043a\u0430.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\">\u0418\u043a\u043e\u043d\u0430 \u0447\u0440\u0435\u0437 <code>content<\/code><\/h3>\n\n\n\n<p>\u0412\u0433\u0440\u0430\u0434\u0435\u043d\u0438\u044f\u0442 SVG \u0435 \u043f\u0440\u0430\u043a\u0442\u0438\u0447\u0435\u043d, \u043a\u043e\u0433\u0430\u0442\u043e \u043f\u043e\u0434\u0434\u044a\u0440\u0436\u0430\u0448 \u0441\u0430\u043c\u043e \u0435\u0434\u043d\u0430 \u0438\u043b\u0438 \u0434\u0432\u0435 \u0438\u043a\u043e\u043d\u0438 \u0438 \u043d\u0435 \u0438\u0441\u043a\u0430\u0448 \u0434\u043e\u043f\u044a\u043b\u043d\u0438\u0442\u0435\u043b\u043d\u0438 \u0444\u0430\u0439\u043b\u043e\u0432\u0435. \u0420\u0435\u0433\u0438\u0441\u0442\u0440\u0438\u0440\u0430\u0439 \u0433\u043e \u0441 \u043f\u0440\u0438\u043e\u0440\u0438\u0442\u0435\u0442 20, \u0442\u0430\u043a\u0430 \u0447\u0435 \u043a\u043e\u043b\u0435\u043a\u0446\u0438\u044f\u0442\u0430 \u0432\u0435\u0447\u0435 \u0434\u0430 \u0441\u044a\u0449\u0435\u0441\u0442\u0432\u0443\u0432\u0430.<\/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>\u0418\u043c\u0435\u0442\u043e \u0441\u043b\u0435\u0434\u0432\u0430 \u0444\u043e\u0440\u043c\u0430\u0442\u0430 <code>collection\/icon-slug<\/code>, \u0430 <code>label<\/code> \u0441\u0435 \u043f\u043e\u043a\u0430\u0437\u0432\u0430 \u0432 picker-\u0430. \u0410\u0442\u0440\u0438\u0431\u0443\u0442\u044a\u0442 <code>stroke=&quot;currentColor&quot;<\/code> \u043a\u0430\u0440\u0430 SVG \u0434\u0430 \u043d\u0430\u0441\u043b\u0435\u0434\u0438 \u0446\u0432\u0435\u0442\u0430 \u043d\u0430 \u043e\u043a\u043e\u043b\u043d\u0438\u044f \u0442\u0435\u043a\u0441\u0442, \u0432\u043c\u0435\u0441\u0442\u043e \u0434\u0430 \u043d\u0430\u043b\u0430\u0433\u0430 \u0446\u0432\u044f\u0442.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\">\u0418\u043a\u043e\u043d\u0438 \u0447\u0440\u0435\u0437 <code>file_path<\/code><\/h3>\n\n\n\n<p>\u0417\u0430\u043f\u0438\u0448\u0438 \u0441\u043b\u0435\u0434\u043d\u0438\u0442\u0435 \u0444\u0430\u0439\u043b\u043e\u0432\u0435 \u0432 \u043f\u0430\u043f\u043a\u0430\u0442\u0430 <code>icons\/<\/code>. \u041f\u0440\u0438 \u0442\u043e\u0437\u0438 \u0432\u0430\u0440\u0438\u0430\u043d\u0442 WordPress \u0447\u0435\u0442\u0435 \u0444\u0430\u0439\u043b\u0430, \u043a\u043e\u0433\u0430\u0442\u043e \u043c\u0443 \u043f\u043e\u0442\u0440\u044f\u0431\u0432\u0430.<\/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>\u041e\u0442\u0432\u043e\u0440\u0438 \u0431\u043b\u043e\u043a\u0430 <code>core\/icon<\/code> \u0432 \u0440\u0435\u0434\u0430\u043a\u0442\u043e\u0440\u0430. \u0429\u0435 \u0432\u0438\u0434\u0438\u0448 \u0441\u0435\u043a\u0446\u0438\u044f MyPlugin \u0441 Heart, Star \u0438 Bookmark. \u0410\u043a\u043e \u043d\u044f\u043a\u043e\u044f \u0438\u043a\u043e\u043d\u0430 \u043b\u0438\u043f\u0441\u0432\u0430, \u043f\u043e\u0447\u0442\u0438 \u0432\u0438\u043d\u0430\u0433\u0438 \u043f\u0440\u0438\u0447\u0438\u043d\u0430\u0442\u0430 \u0435 \u0433\u0440\u0435\u0448\u043d\u0438\u044f\u0442 \u0440\u0435\u0434: \u0440\u0435\u0433\u0438\u0441\u0442\u0440\u0438\u0440\u0430\u0439 \u043a\u043e\u043b\u0435\u043a\u0446\u0438\u044f\u0442\u0430 \u043d\u0430 \u0441\u0442\u0430\u043d\u0434\u0430\u0440\u0442\u043d\u0438\u044f \u043f\u0440\u0438\u043e\u0440\u0438\u0442\u0435\u0442 \u0438 \u0438\u043a\u043e\u043d\u0438\u0442\u0435 \u043d\u0430 20.<\/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\/21\/2026\/08\/custom-icons-added-tab-in-wordpress.webp\" alt=\"\u0418\u0437\u0431\u043e\u0440\u044a\u0442 \u043d\u0430 \u0438\u043a\u043e\u043d\u0438 \u0432 WordPress \u043f\u043e\u043a\u0430\u0437\u0432\u0430 \u0434\u043e\u0431\u0430\u0432\u0435\u043d\u0430 \u043a\u043e\u043b\u0435\u043a\u0446\u0438\u044f \u0441 \u043f\u043e\u0442\u0440\u0435\u0431\u0438\u0442\u0435\u043b\u0441\u043a\u0438 SVG \u0438\u043a\u043e\u043d\u0438\" class=\"wp-image-242\" srcset=\"https:\/\/helloblog.io\/app\/uploads\/sites\/21\/2026\/08\/custom-icons-added-tab-in-wordpress.webp 1712w, https:\/\/helloblog.io\/app\/uploads\/sites\/21\/2026\/08\/custom-icons-added-tab-in-wordpress-300x105.webp 300w, https:\/\/helloblog.io\/app\/uploads\/sites\/21\/2026\/08\/custom-icons-added-tab-in-wordpress-1024x360.webp 1024w, https:\/\/helloblog.io\/app\/uploads\/sites\/21\/2026\/08\/custom-icons-added-tab-in-wordpress-768x270.webp 768w, https:\/\/helloblog.io\/app\/uploads\/sites\/21\/2026\/08\/custom-icons-added-tab-in-wordpress-1536x540.webp 1536w, https:\/\/helloblog.io\/app\/uploads\/sites\/21\/2026\/08\/custom-icons-added-tab-in-wordpress-400x141.webp 400w\" sizes=\"auto, (max-width: 1712px) 100vw, 1712px\" \/><figcaption class=\"wp-element-caption\">\u0414\u043e\u0431\u0430\u0432\u0435\u043d\u0430 \u043a\u043e\u043b\u0435\u043a\u0446\u0438\u044f \u0432 \u0438\u0437\u0431\u043e\u0440\u0430 \u043d\u0430 \u0438\u043a\u043e\u043d\u0438. \u2014 <em>Forr\u00e1s: WPVibes<\/em><\/figcaption><\/figure>\n\n\n\n<h2 class=\"wp-block-heading\">3. \u0417\u0430\u0440\u0435\u0436\u0434\u0430\u0439 \u0430\u0432\u0442\u043e\u043c\u0430\u0442\u0438\u0447\u043d\u043e \u0446\u044f\u043b\u0430 \u043f\u0430\u043f\u043a\u0430<\/h2>\n\n\n\n<p>\u0420\u044a\u0447\u043d\u0430\u0442\u0430 \u0440\u0435\u0433\u0438\u0441\u0442\u0440\u0430\u0446\u0438\u044f \u043d\u0435 \u0435 \u0443\u0434\u043e\u0431\u043d\u0430 \u0437\u0430 \u0431\u0438\u0431\u043b\u0438\u043e\u0442\u0435\u043a\u0430 \u043e\u0442 \u0434\u0435\u0441\u0435\u0442\u043a\u0438 \u0438\u043a\u043e\u043d\u0438. \u0412\u043c\u0435\u0441\u0442\u043e \u0442\u043e\u0432\u0430 \u043e\u0431\u0445\u043e\u0436\u0434\u0430\u0439 \u043f\u0430\u043f\u043a\u0430\u0442\u0430 \u0438 \u0434\u043e\u0431\u0430\u0432\u044f\u0439 \u0432\u0441\u0435\u043a\u0438 SVG \u043f\u0440\u0438 \u0441\u043b\u0435\u0434\u0432\u0430\u0449\u0430\u0442\u0430 \u0437\u0430\u044f\u0432\u043a\u0430. \u0417\u0430\u043c\u0435\u043d\u0438 \u0444\u0443\u043d\u043a\u0446\u0438\u044f\u0442\u0430 <code>myplugin_register_file_icons()<\/code> \u0441 \u0442\u0430\u0437\u0438 \u0432\u0435\u0440\u0441\u0438\u044f.<\/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><code>glob( $icons_dir . '*.svg' )<\/code> \u0432\u0440\u044a\u0449\u0430 \u0432\u0441\u0438\u0447\u043a\u0438 SVG \u0444\u0430\u0439\u043b\u043e\u0432\u0435 \u0432 \u043f\u0430\u043f\u043a\u0430\u0442\u0430. <code>basename( $file_path, '.svg' )<\/code> \u043f\u0440\u0435\u043c\u0430\u0445\u0432\u0430 \u0440\u0430\u0437\u0448\u0438\u0440\u0435\u043d\u0438\u0435\u0442\u043e \u2013 <code>advanced-button.svg<\/code> \u0441\u0442\u0430\u0432\u0430 <code>advanced-button<\/code> \u2013 \u0430 <code>ucwords( str_replace( '-', ' ', $slug ) )<\/code> \u0433\u043e \u043f\u0440\u0435\u0432\u0440\u044a\u0449\u0430 \u0432 \u0447\u0435\u0442\u0438\u043c \u0435\u0442\u0438\u043a\u0435\u0442 \u201eAdvanced Button\u201c. \u0426\u0438\u043a\u044a\u043b\u044a\u0442 \u0434\u043e\u0431\u0430\u0432\u044f \u0432\u0441\u044f\u043a\u0430 \u0438\u043a\u043e\u043d\u0430 \u043a\u044a\u043c <code>myplugin\/<\/code>.<\/p>\n\n\n\n<p>\u041a\u043e\u043f\u0438\u0440\u0430\u0439 \u043d\u043e\u0432 SVG \u0432 \u043f\u0430\u043f\u043a\u0430\u0442\u0430, \u043e\u0431\u043d\u043e\u0432\u0438 \u0440\u0435\u0434\u0430\u043a\u0442\u043e\u0440\u0430 \u0438 \u0442\u043e\u0439 \u0449\u0435 \u0441\u0435 \u043f\u043e\u044f\u0432\u0438 \u0432 picker-\u0430 \u0431\u0435\u0437 \u043f\u0440\u043e\u043c\u044f\u043d\u0430 \u043f\u043e PHP \u043a\u043e\u0434\u0430. \u0428\u0430\u0431\u043b\u043e\u043d\u044a\u0442 \u0440\u0430\u0431\u043e\u0442\u0438 \u0435\u0434\u043d\u0430\u043a\u0432\u043e \u0437\u0430 star \u0438 bookmark, \u043a\u0430\u043a\u0442\u043e \u0438 \u0437\u0430 \u0441\u0442\u043e\u0442\u0438\u0446\u0438 \u0434\u043e\u043f\u044a\u043b\u043d\u0438\u0442\u0435\u043b\u043d\u0438 \u0444\u0430\u0439\u043b\u043e\u0432\u0435; \u0441\u044a\u0440\u0446\u0435\u0442\u043e \u043e\u0442 \u043f\u0440\u0435\u0434\u0438\u0448\u043d\u0430\u0442\u0430 \u0441\u0442\u044a\u043f\u043a\u0430 \u043e\u0441\u0442\u0430\u0432\u0430 \u0440\u0435\u0433\u0438\u0441\u0442\u0440\u0438\u0440\u0430\u043d\u043e \u0447\u0440\u0435\u0437 <code>content<\/code>.<\/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\/21\/2026\/08\/multiple-custom-icons-added-wordpress.webp\" alt=\"\u041a\u043e\u043b\u0435\u043a\u0446\u0438\u044f \u0441 \u043c\u043d\u043e\u0436\u0435\u0441\u0442\u0432\u043e \u043f\u043e\u0442\u0440\u0435\u0431\u0438\u0442\u0435\u043b\u0441\u043a\u0438 SVG \u0438\u043a\u043e\u043d\u0438 \u0432 \u0438\u0437\u0431\u043e\u0440\u0430 \u043d\u0430 \u0431\u043b\u043e\u043a\u043e\u0432\u0435\" class=\"wp-image-243\" srcset=\"https:\/\/helloblog.io\/app\/uploads\/sites\/21\/2026\/08\/multiple-custom-icons-added-wordpress.webp 1207w, https:\/\/helloblog.io\/app\/uploads\/sites\/21\/2026\/08\/multiple-custom-icons-added-wordpress-300x85.webp 300w, https:\/\/helloblog.io\/app\/uploads\/sites\/21\/2026\/08\/multiple-custom-icons-added-wordpress-1024x289.webp 1024w, https:\/\/helloblog.io\/app\/uploads\/sites\/21\/2026\/08\/multiple-custom-icons-added-wordpress-768x217.webp 768w, https:\/\/helloblog.io\/app\/uploads\/sites\/21\/2026\/08\/multiple-custom-icons-added-wordpress-400x113.webp 400w\" sizes=\"auto, (max-width: 1207px) 100vw, 1207px\" \/><figcaption class=\"wp-element-caption\">\u0410\u0432\u0442\u043e\u043c\u0430\u0442\u0438\u0447\u043d\u043e \u0440\u0435\u0433\u0438\u0441\u0442\u0440\u0438\u0440\u0430\u043d\u0438 SVG \u0444\u0430\u0439\u043b\u043e\u0432\u0435 \u0432 \u043a\u043e\u043b\u0435\u043a\u0446\u0438\u044f\u0442\u0430. \u2014 <em>Forr\u00e1s: WPVibes<\/em><\/figcaption><\/figure>\n\n\n\n<h2 class=\"wp-block-heading\">4. \u0418\u0437\u043f\u043e\u043b\u0437\u0432\u0430\u0439 \u0438\u043a\u043e\u043d\u0438\u0442\u0435 \u043d\u0430 \u0442\u0440\u0438 \u043c\u0435\u0441\u0442\u0430<\/h2>\n\n\n\n<h3 class=\"wp-block-heading\">\u0412 \u0431\u043b\u043e\u043a\u0430 <code>core\/icon<\/code> \u0438 \u043f\u0440\u0435\u0437 REST API<\/h3>\n\n\n\n<p>Picker-\u044a\u0442 \u043d\u0430 <code>core\/icon<\/code> \u043f\u043e\u043a\u0430\u0437\u0432\u0430 \u0430\u0432\u0442\u043e\u043c\u0430\u0442\u0438\u0447\u043d\u043e \u0432\u0441\u044f\u043a\u0430 \u0440\u0435\u0433\u0438\u0441\u0442\u0440\u0438\u0440\u0430\u043d\u0430 \u043a\u043e\u043b\u0435\u043a\u0446\u0438\u044f. \u041f\u043e\u0442\u0440\u0435\u0431\u0438\u0442\u0435\u043b\u044f\u0442 \u0438\u0437\u0431\u0438\u0440\u0430 \u0438\u043a\u043e\u043d\u0430\u0442\u0430, \u0432\u043c\u044a\u043a\u0432\u0430 \u0431\u043b\u043e\u043a\u0430 \u0438 \u0442\u044f \u0441\u0435 \u0432\u0438\u0437\u0443\u0430\u043b\u0438\u0437\u0438\u0440\u0430 \u043d\u0430 \u0441\u0430\u0439\u0442\u0430 \u0431\u0435\u0437 \u0434\u043e\u043f\u044a\u043b\u043d\u0438\u0442\u0435\u043b\u0435\u043d \u043a\u043e\u0434.<\/p>\n\n\n\n<p>\u0420\u0435\u0433\u0438\u0441\u0442\u044a\u0440\u044a\u0442 \u0435 \u043d\u0430\u043b\u0438\u0447\u0435\u043d \u0438 \u0437\u0430 \u0432\u044a\u043d\u0448\u043d\u0438 \u0438\u043d\u0441\u0442\u0440\u0443\u043c\u0435\u043d\u0442\u0438 \u043f\u0440\u0435\u0437 endpoint-\u0430 <code>\/wp-json\/wp\/v2\/icons<\/code>. \u041a\u043e\u043b\u0435\u043a\u0446\u0438\u0438\u0442\u0435 \u0441\u0430 \u0434\u043e\u0441\u0442\u044a\u043f\u043d\u0438 \u043e\u0442 \u043f\u0440\u0438\u0434\u0440\u0443\u0436\u0430\u0432\u0430\u0449\u0438\u044f <code>\/wp-json\/wp\/v2\/icon-collections<\/code> endpoint, \u0432\u043a\u043b\u044e\u0447\u0438\u0442\u0435\u043b\u043d\u043e \u0437\u0430 \u0438\u043d\u0441\u0442\u0440\u0443\u043c\u0435\u043d\u0442\u0438, \u043a\u043e\u0438\u0442\u043e \u0447\u0435\u0442\u0430\u0442 \u0434\u0430\u043d\u043d\u0438 \u043e\u0442 WordPress.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\">\u0412 PHP \u0447\u0440\u0435\u0437 <code>wp_get_icon()<\/code><\/h3>\n\n\n\n<p><code>wp_get_icon()<\/code> \u0432\u0440\u044a\u0449\u0430 SVG \u043a\u0430\u0442\u043e \u043d\u0438\u0437. \u041c\u043e\u0436\u0435\u0448 \u0434\u0438\u0440\u0435\u043a\u0442\u043d\u043e \u0434\u0430 \u0433\u043e \u0438\u0437\u0432\u0435\u0434\u0435\u0448:<\/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>\u0412 \u0448\u0430\u0431\u043b\u043e\u043d \u043f\u043e\u0434\u0430\u0439 \u0432\u0442\u043e\u0440\u0438 \u043c\u0430\u0441\u0438\u0432, \u0430\u043a\u043e \u0442\u0440\u044f\u0431\u0432\u0430 \u0434\u0430 \u0437\u0430\u0434\u0430\u0434\u0435\u0448 \u0440\u0430\u0437\u043c\u0435\u0440, CSS \u043a\u043b\u0430\u0441 \u0438 \u0434\u043e\u0441\u0442\u044a\u043f\u043d\u043e \u0438\u043c\u0435.<\/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; __( 'Featured', '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\">'Featured'<\/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<ul class=\"wp-block-list\">\n\n<li><code>size<\/code> \u0437\u0430\u0434\u0430\u0432\u0430 <code>width<\/code> \u0438 <code>height<\/code> \u043d\u0430 SVG \u0432 \u043f\u0438\u043a\u0441\u0435\u043b\u0438.<\/li>\n\n\n<li><code>class<\/code> \u0434\u043e\u0431\u0430\u0432\u044f CSS \u043a\u043b\u0430\u0441 \u043a\u044a\u043c SVG \u0435\u043b\u0435\u043c\u0435\u043d\u0442\u0430.<\/li>\n\n\n<li><code>label<\/code> \u0437\u0430\u0434\u0430\u0432\u0430 <code>aria-label<\/code> \u0437\u0430 \u0435\u043a\u0440\u0430\u043d\u043d\u0438 \u0447\u0435\u0442\u0446\u0438.<\/li>\n\n<\/ul>\n\n\n\n<p>\u0424\u0443\u043d\u043a\u0446\u0438\u044f\u0442\u0430 \u043f\u0440\u0438\u0435\u043c\u0430 \u0438 <code>title<\/code> \u0432 \u043c\u0430\u0441\u0438\u0432\u0430 <code>$args<\/code>. \u0422\u044a\u0439 \u043a\u0430\u0442\u043e \u0432\u0440\u044a\u0449\u0430 \u043d\u0438\u0437, \u043c\u043e\u0436\u0435\u0448 \u0434\u0430 \u0433\u043e \u043e\u0431\u0432\u0438\u0435\u0448 \u0438 \u0432 \u0441\u043e\u0431\u0441\u0442\u0432\u0435\u043d HTML.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\">\u041a\u0440\u0430\u0442\u044a\u043a \u043a\u043e\u0434 \u0437\u0430 \u043f\u0443\u0431\u043b\u0438\u043a\u0430\u0446\u0438\u0438<\/h3>\n\n\n\n<p>\u0421\u043b\u0435\u0434\u043d\u0438\u044f\u0442 \u043a\u0440\u0430\u0442\u044a\u043a \u043a\u043e\u0434 <code>myplugin_icon<\/code> \u0432\u043c\u044a\u043a\u0432\u0430 \u0438\u0437\u0431\u0440\u0430\u043d\u0430 \u0438\u043a\u043e\u043d\u0430 \u0434\u043e \u0442\u0435\u043a\u0441\u0442 \u0432 \u043f\u0443\u0431\u043b\u0438\u043a\u0430\u0446\u0438\u044f, \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u0430 \u0438\u043b\u0438 \u0434\u0436\u0430\u0434\u0436\u0430. \u0422\u043e\u0439 \u0432\u0430\u043b\u0438\u0434\u0438\u0440\u0430 \u0438\u043c\u0435\u0442\u043e, \u0440\u0430\u0437\u043c\u0435\u0440\u0430 \u0438 CSS \u043a\u043b\u0430\u0441\u0430, \u0430 \u043f\u0440\u0438 \u043b\u0438\u043f\u0441\u0432\u0430\u0449\u0430 \u0438\u043a\u043e\u043d\u0430 \u043d\u0435 \u0432\u0440\u044a\u0449\u0430 \u043d\u0438\u0449\u043e.<\/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;Featured post&quot; size=&quot;32&quot;]\n\n[myplugin_icon name=&quot;bookmark&quot; text=&quot;Save for later&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=\"Featured post\" size=\"32\"]<\/span><\/span>\n<span class=\"line\"><span><\/span><\/span>\n<span class=\"line\"><span>[myplugin_icon name=\"bookmark\" text=\"Save for later\" size=\"20\"]<\/span><\/span><\/code><\/pre><\/div>\n\n\n\n<p>\u0418\u043a\u043e\u043d\u0430\u0442\u0430 \u0449\u0435 \u0441\u0442\u043e\u0438 \u0434\u043e \u0442\u0435\u043a\u0441\u0442\u0430 \u0441 \u0440\u0430\u0437\u043c\u0435\u0440\u0430 \u043e\u0442 \u0430\u0442\u0440\u0438\u0431\u0443\u0442\u0430 <code>size<\/code>. \u041f\u043e\u043d\u0435\u0436\u0435 SVG \u0438\u0437\u043f\u043e\u043b\u0437\u0432\u0430 <code>currentColor<\/code>, \u0442\u043e\u0439 \u0430\u0432\u0442\u043e\u043c\u0430\u0442\u0438\u0447\u043d\u043e \u0432\u0437\u0435\u043c\u0430 \u0446\u0432\u0435\u0442\u0430 \u043d\u0430 \u043e\u043a\u043e\u043b\u043d\u0438\u044f \u0442\u0435\u043a\u0441\u0442.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\">\u041a\u0430\u0442\u043e \u0438\u043a\u043e\u043d\u0430 \u043d\u0430 \u0441\u043e\u0431\u0441\u0442\u0432\u0435\u043d \u0431\u043b\u043e\u043a<\/h3>\n\n\n\n<p>\u0420\u0435\u0433\u0438\u0441\u0442\u0440\u0438\u0440\u0430\u043d\u0430 SVG \u0438\u043a\u043e\u043d\u0430 \u043c\u043e\u0436\u0435 \u0434\u0430 \u0437\u0430\u043c\u0435\u043d\u0438 \u0441\u0442\u0430\u043d\u0434\u0430\u0440\u0442\u043d\u0430\u0442\u0430 Dashicon \u0438\u043a\u043e\u043d\u0430 \u043d\u0430 \u0431\u043b\u043e\u043a. \u0412\u043c\u0435\u0441\u0442\u043e \u0442\u043e\u0432\u0430:<\/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', \/\/ \u0418\u0437\u043f\u043e\u043b\u0437\u0432\u0430 Dashicon\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\">\/\/ \u0418\u0437\u043f\u043e\u043b\u0437\u0432\u0430 Dashicon<\/span><\/span><\/code><\/pre><\/div>\n\n\n\n<p>\u043f\u043e\u0434\u0430\u0439 \u043f\u044a\u043b\u043d\u043e\u0442\u043e \u0438\u043c\u0435 \u043d\u0430 \u0442\u0432\u043e\u044f\u0442\u0430 \u0438\u043a\u043e\u043d\u0430:<\/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; 'myplugin\/star', \/\/ \u0418\u0437\u043f\u043e\u043b\u0437\u0432\u0430 \u0440\u0435\u0433\u0438\u0441\u0442\u0440\u0438\u0440\u0430\u043d\u0430 SVG \u0438\u043a\u043e\u043d\u0430\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\"> 'myplugin\/star'<\/span><span style=\"color:#E1E4E8\">, <\/span><span style=\"color:#6A737D\">\/\/ \u0418\u0437\u043f\u043e\u043b\u0437\u0432\u0430 \u0440\u0435\u0433\u0438\u0441\u0442\u0440\u0438\u0440\u0430\u043d\u0430 SVG \u0438\u043a\u043e\u043d\u0430<\/span><\/span><\/code><\/pre><\/div>\n\n\n\n<p>\u0412\u043c\u044a\u043a\u0432\u0430\u0447\u044a\u0442 \u043d\u0430 \u0431\u043b\u043e\u043a\u043e\u0432\u0435 \u0449\u0435 \u043f\u043e\u043a\u0430\u0436\u0435 SVG \u0438\u043a\u043e\u043d\u0430\u0442\u0430 \u0432\u043c\u0435\u0441\u0442\u043e \u043e\u0431\u0449\u0430 Dashicon. \u041f\u043e\u0434\u0445\u043e\u0434\u044a\u0442 \u0440\u0430\u0431\u043e\u0442\u0438 \u0438 \u0437\u0430 \u0431\u043b\u043e\u043a\u043e\u0432\u0435, \u0440\u0435\u0433\u0438\u0441\u0442\u0440\u0438\u0440\u0430\u043d\u0438 \u0441 JavaScript, \u0438 \u0437\u0430 \u0431\u043b\u043e\u043a\u043e\u0432\u0435 \u0441\u0430\u043c\u043e \u0441 PHP \u0447\u0440\u0435\u0437 <code>register_block_type()<\/code>. \u0415\u0434\u043d\u0430 \u0440\u0435\u0433\u0438\u0441\u0442\u0440\u0430\u0446\u0438\u044f \u043e\u0431\u0441\u043b\u0443\u0436\u0432\u0430 \u0440\u0435\u0434\u0430\u043a\u0442\u043e\u0440\u0430, PHP \u0438 REST API.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\">5. \u041e\u0444\u043e\u0440\u043c\u0438 \u0438\u043a\u043e\u043d\u0438\u0442\u0435 \u0441 CSS<\/h2>\n\n\n\n<p>SVG \u0438\u043a\u043e\u043d\u0438\u0442\u0435 \u0438\u0437\u0433\u043b\u0435\u0436\u0434\u0430\u0442 \u0435\u0441\u0442\u0435\u0441\u0442\u0432\u0435\u043d\u043e \u043f\u043e \u043f\u043e\u0434\u0440\u0430\u0437\u0431\u0438\u0440\u0430\u043d\u0435, \u043d\u043e \u0442\u0440\u044f\u0431\u0432\u0430 \u0434\u0430 \u0441\u043b\u0435\u0434\u0432\u0430\u0442 \u043a\u043e\u043d\u0442\u0435\u043a\u0441\u0442\u0430 \u0441\u0438: \u0434\u0430 \u043d\u0430\u0441\u043b\u0435\u0434\u044f\u0432\u0430\u0442 \u0446\u0432\u044f\u0442, \u0434\u0430 \u0441\u0435 \u043c\u0430\u0449\u0430\u0431\u0438\u0440\u0430\u0442 \u0441 \u0442\u0435\u043a\u0441\u0442\u0430 \u0438 \u0434\u0430 \u0440\u0435\u0430\u0433\u0438\u0440\u0430\u0442 \u043f\u0440\u0438 hover. \u041a\u043b\u0430\u0441\u044a\u0442 \u043e\u0442 <code>wp_get_icon()<\/code> \u0435 \u0434\u0438\u0440\u0435\u043a\u0442\u043d\u0430 CSS \u043a\u0443\u043a\u0430; \u0432 \u0440\u0435\u0434\u0430\u043a\u0442\u043e\u0440\u0430, \u043a\u044a\u0434\u0435\u0442\u043e \u0442\u043e\u0437\u0438 \u0430\u0440\u0433\u0443\u043c\u0435\u043d\u0442 \u043d\u0435 \u0443\u0447\u0430\u0441\u0442\u0432\u0430, \u0438\u0437\u043f\u043e\u043b\u0437\u0432\u0430\u0439 \u043a\u043b\u0430\u0441 \u043d\u0430 \u043e\u0431\u0432\u0438\u0432\u0430\u0449\u0438\u044f \u0435\u043b\u0435\u043c\u0435\u043d\u0442.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\">\u041d\u0430\u0441\u043b\u0435\u0434\u044f\u0432\u0430\u0439 \u0446\u0432\u0435\u0442\u0430 \u0441 <code>currentColor<\/code><\/h3>\n\n\n\n<p>\u0418\u0437\u043f\u043e\u043b\u0437\u0432\u0430\u0439 <code>stroke=&quot;currentColor&quot;<\/code> \u0438\u043b\u0438 <code>fill=&quot;currentColor&quot;<\/code>, \u0430 \u043d\u0435 \u0444\u0438\u043a\u0441\u0438\u0440\u0430\u043d\u0438 \u0446\u0432\u0435\u0442\u043e\u0432\u0435. \u0422\u0430\u043a\u0430 \u0438\u043a\u043e\u043d\u0430\u0442\u0430 \u0432 \u0447\u0435\u0440\u0432\u0435\u043d \u0442\u0435\u043a\u0441\u0442 \u0441\u0442\u0430\u0432\u0430 \u0447\u0435\u0440\u0432\u0435\u043d\u0430, \u0432 \u0442\u044a\u043c\u043d\u0430 \u0442\u0435\u043c\u0430 \u0441\u043b\u0435\u0434\u0432\u0430 \u0442\u0435\u043c\u0430\u0442\u0430, \u0430 \u0432 \u043b\u0438\u043d\u043a \u043f\u0440\u0438\u0435\u043c\u0430 \u0446\u0432\u0435\u0442\u0430 \u043d\u0430 \u043b\u0438\u043d\u043a\u0430 \u2013 \u0434\u044a\u0440\u0436\u0438 \u0441\u0435 \u043a\u0430\u0442\u043e \u0442\u0435\u043a\u0441\u0442.<\/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;!-- \u041d\u0435\u043f\u043e\u0434\u0445\u043e\u0434\u044f\u0449\u043e: \u0438\u043a\u043e\u043d\u0430\u0442\u0430 \u0432\u0438\u043d\u0430\u0433\u0438 \u0435 \u0447\u0435\u0440\u0432\u0435\u043d\u0430 --&gt;\n&lt;svg viewBox=&quot;0 0 24 24&quot;\n     stroke=&quot;#dc2626&quot;\n     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;!-- \u041d\u0435\u043f\u043e\u0434\u0445\u043e\u0434\u044f\u0449\u043e: \u0438\u043a\u043e\u043d\u0430\u0442\u0430 \u0432\u0438\u043d\u0430\u0433\u0438 \u0435 \u0447\u0435\u0440\u0432\u0435\u043d\u0430 --><\/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>\n<span class=\"line\"><span style=\"color:#B392F0\">     stroke<\/span><span style=\"color:#E1E4E8\">=<\/span><span style=\"color:#9ECBFF\">\"#dc2626\"<\/span><\/span>\n<span class=\"line\"><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>SVG \u0431\u0435\u0437 \u0444\u0438\u043a\u0441\u0438\u0440\u0430\u043d\u0438 \u0446\u0432\u0435\u0442\u043e\u0432\u0435 \u043f\u0430\u0441\u0432\u0430 \u043d\u0430 \u0432\u0441\u044f\u043a\u0430 \u0442\u0435\u043c\u0430. \u0418\u043a\u043e\u043d\u0430 \u0441 \u0442\u0432\u044a\u0440\u0434\u043e \u0437\u0430\u0434\u0430\u0434\u0435\u043d \u0446\u0432\u044f\u0442 \u0447\u0435\u0441\u0442\u043e \u0432\u043b\u0438\u0437\u0430 \u0432 \u043a\u043e\u043d\u0444\u043b\u0438\u043a\u0442 \u0441 \u043d\u0435\u044f.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\">\u041d\u0430\u043b\u043e\u0436\u0438 \u0446\u0432\u044f\u0442 \u043f\u0440\u0438 \u043d\u0443\u0436\u0434\u0430<\/h3>\n\n\n\n<p>\u0417\u0430 \u0431\u0440\u0430\u043d\u0434\u043e\u0432 \u0437\u043d\u0430\u043a \u0438\u043b\u0438 \u0438\u043d\u0434\u0438\u043a\u0430\u0442\u043e\u0440 \u0437\u0430 \u0441\u044a\u0441\u0442\u043e\u044f\u043d\u0438\u0435 \u043f\u043e\u043d\u044f\u043a\u043e\u0433\u0430 \u0446\u0432\u0435\u0442\u044a\u0442 \u0442\u0440\u044f\u0431\u0432\u0430 \u0434\u0430 \u043e\u0441\u0442\u0430\u043d\u0435 \u043a\u043e\u043d\u043a\u0440\u0435\u0442\u0435\u043d. \u0417\u0430\u0434\u0430\u0439 <code>color<\/code> \u043d\u0430 SVG \u043f\u0440\u0435\u0437 \u043a\u043b\u0430\u0441\u0430 \u043c\u0443; <code>currentColor<\/code> \u0449\u0435 \u0441\u0435 \u043f\u0440\u0435\u0445\u0432\u044a\u0440\u043b\u0438 \u043a\u044a\u043c <code>stroke<\/code> \u0438\u043b\u0438 <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; \/* \u041a\u0435\u0445\u043b\u0438\u0431\u0430\u0440\u0435\u043d \u0446\u0432\u044f\u0442 \u043d\u0435\u0437\u0430\u0432\u0438\u0441\u0438\u043c\u043e \u043e\u0442 \u0442\u0435\u043a\u0441\u0442\u0430 *\/\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\">\/* \u041a\u0435\u0445\u043b\u0438\u0431\u0430\u0440\u0435\u043d \u0446\u0432\u044f\u0442 \u043d\u0435\u0437\u0430\u0432\u0438\u0441\u0438\u043c\u043e \u043e\u0442 \u0442\u0435\u043a\u0441\u0442\u0430 *\/<\/span><\/span>\n<span class=\"line\"><span style=\"color:#E1E4E8\">}<\/span><\/span><\/code><\/pre><\/div>\n\n\n\n<h3 class=\"wp-block-heading\">\u0420\u0430\u0437\u043c\u0435\u0440 \u0438 hover \u0441\u044a\u0441\u0442\u043e\u044f\u043d\u0438\u044f<\/h3>\n\n\n\n<p>\u0410\u0440\u0433\u0443\u043c\u0435\u043d\u0442\u044a\u0442 <code>size<\/code> \u043a\u043e\u043d\u0442\u0440\u043e\u043b\u0438\u0440\u0430 \u0440\u0430\u0437\u043c\u0435\u0440\u0430 \u0432 \u043f\u0438\u043a\u0441\u0435\u043b\u0438 \u043f\u0440\u0438 shortcode \u0438 <code>wp_get_icon()<\/code>. \u0410\u043a\u043e \u0438\u0441\u043a\u0430\u0448 \u0440\u0430\u0437\u043c\u0435\u0440\u044a\u0442 \u0438 \u043f\u043e\u0432\u0435\u0434\u0435\u043d\u0438\u0435\u0442\u043e \u0434\u0430 \u0438\u0434\u0432\u0430\u0442 \u043e\u0442 CSS, \u0438\u0437\u043f\u043e\u043b\u0437\u0432\u0430\u0439 \u043d\u0430\u043f\u0440\u0438\u043c\u0435\u0440 \u0441\u043b\u0435\u0434\u043d\u043e\u0442\u043e \u043f\u0440\u0430\u0432\u0438\u043b\u043e:<\/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<ul class=\"wp-block-list\">\n\n<li>\u0418\u0437\u043f\u043e\u043b\u0437\u0432\u0430\u0439 <code>size<\/code> \u0432 <code>wp_get_icon()<\/code> \u0437\u0430 \u0435\u0434\u0438\u043d\u0438\u0447\u0435\u043d \u0441\u043b\u0443\u0447\u0430\u0439 \u0441 \u0442\u043e\u0447\u0435\u043d \u0440\u0430\u0437\u043c\u0435\u0440, \u043a\u043e\u0433\u0430\u0442\u043e \u043d\u0435 \u0441\u0438 \u0441\u0442\u0440\u0443\u0432\u0430 \u0434\u0430 \u043f\u0438\u0448\u0435\u0448 CSS.<\/li>\n\n\n<li>\u0418\u0437\u043f\u043e\u043b\u0437\u0432\u0430\u0439 CSS \u043a\u043b\u0430\u0441\u043e\u0432\u0435 \u2013 \u043f\u0440\u0435\u0437 <code>class<\/code> \u0438\u043b\u0438 \u0432\u044a\u0440\u0445\u0443 \u043e\u0431\u0432\u0438\u0432\u043a\u0430\u0442\u0430 \u2013 \u043a\u043e\u0433\u0430\u0442\u043e \u0438\u043a\u043e\u043d\u0430\u0442\u0430 \u0441\u0435 \u043f\u043e\u0432\u0442\u0430\u0440\u044f \u043d\u0430 \u043c\u043d\u043e\u0433\u043e \u043c\u0435\u0441\u0442\u0430, \u0442\u0440\u044f\u0431\u0432\u0430 \u0434\u0430 \u0435 \u043f\u043e\u0441\u043b\u0435\u0434\u043e\u0432\u0430\u0442\u0435\u043b\u043d\u0430 \u0438\u043b\u0438 \u0441\u0442\u0438\u043b\u044a\u0442 \u0437\u0430\u0432\u0438\u0441\u0438 \u043e\u0442 hover, focus, active \u0438 \u043a\u043e\u043d\u0442\u0435\u043a\u0441\u0442 \u043a\u0430\u0442\u043e \u043b\u0438\u043d\u043a \u0438\u043b\u0438 \u0437\u0430\u0433\u043b\u0430\u0432\u0438\u0435.<\/li>\n\n\n<li>\u041f\u0440\u0438 \u043a\u0440\u0430\u0442\u043a\u0438\u044f \u043a\u043e\u0434 \u043c\u043e\u0436\u0435\u0448 \u0434\u0430 \u043a\u043e\u0440\u0438\u0433\u0438\u0440\u0430\u0448 \u043e\u0442\u0434\u0435\u043b\u0435\u043d \u0441\u043b\u0443\u0447\u0430\u0439 \u0441 <code>size<\/code>, \u0430 \u0437\u0430 \u0435\u0434\u0438\u043d\u0435\u043d \u0441\u0442\u0438\u043b \u0432 \u0446\u0435\u043b\u0438\u044f \u0441\u0430\u0439\u0442 \u0434\u0430 \u0434\u043e\u0431\u0430\u0432\u0438\u0448 CSS \u043a\u044a\u043c <code>.myplugin-icon-inline svg<\/code>.<\/li>\n\n<\/ul>\n\n\n\n<h2 class=\"wp-block-heading\">6. \u041f\u0440\u0435\u043c\u0430\u0445\u0432\u0430\u0439 \u0438\u043a\u043e\u043d\u0438 \u0438 \u043a\u043e\u043b\u0435\u043a\u0446\u0438\u0438<\/h2>\n\n\n\n<p>WordPress 7.1 \u0438\u043c\u0430 \u0441\u044a\u043e\u0442\u0432\u0435\u0442\u043d\u0438 \u0444\u0443\u043d\u043a\u0446\u0438\u0438 \u0437\u0430 \u043e\u0442\u0440\u0435\u0433\u0438\u0441\u0442\u0440\u0438\u0440\u0430\u043d\u0435 \u043d\u0430 \u0435\u0434\u043d\u0430 \u0438\u043a\u043e\u043d\u0430 \u0438 \u043d\u0430 \u0446\u044f\u043b\u0430 \u043a\u043e\u043b\u0435\u043a\u0446\u0438\u044f.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\">\u041f\u0440\u0435\u043c\u0430\u0445\u043d\u0438 \u0435\u0434\u043d\u0430 \u0438\u043a\u043e\u043d\u0430<\/h3>\n\n\n\n<p>\u0422\u043e\u0432\u0430 \u0435 \u043f\u043e\u043b\u0435\u0437\u043d\u043e \u043f\u0440\u0438 \u0440\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u043a\u0430 \u0438\u043b\u0438 \u043a\u043e\u0433\u0430\u0442\u043e \u043e\u0431\u043d\u043e\u0432\u043b\u0435\u043d\u0438\u0435 \u043d\u0430 \u0440\u0430\u0437\u0448\u0438\u0440\u0435\u043d\u0438\u0435\u0442\u043e \u043f\u0440\u0435\u043c\u0430\u0445\u0432\u0430 \u0438\u043a\u043e\u043d\u0430.<\/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>\u041f\u0440\u0438 \u0441\u043b\u0435\u0434\u0432\u0430\u0449\u0430\u0442\u0430 \u0437\u0430\u044f\u0432\u043a\u0430 \u0438\u043a\u043e\u043d\u0430\u0442\u0430 \u0438\u0437\u0447\u0435\u0437\u0432\u0430 \u043e\u0442 picker-\u0430. \u0410\u043a\u043e \u0441\u044a\u0449\u0435\u0441\u0442\u0432\u0443\u0432\u0430\u0449\u0430 \u043f\u0443\u0431\u043b\u0438\u043a\u0430\u0446\u0438\u044f \u0432\u0435\u0447\u0435 \u044f \u0435 \u0432\u043c\u044a\u043a\u043d\u0430\u043b\u0430 \u0432 \u0431\u043b\u043e\u043a <code>core\/icon<\/code>, \u0431\u043b\u043e\u043a\u044a\u0442 \u0449\u0435 \u0441\u0435 \u0432\u0438\u0437\u0443\u0430\u043b\u0438\u0437\u0438\u0440\u0430 \u043f\u0440\u0430\u0437\u0435\u043d \u2013 WordPress \u043d\u0435 \u043f\u0440\u0435\u043d\u0430\u043f\u0438\u0441\u0432\u0430 \u0441\u044a\u0434\u044a\u0440\u0436\u0430\u043d\u0438\u0435\u0442\u043e \u043d\u0430 \u043f\u0443\u0431\u043b\u0438\u043a\u0430\u0446\u0438\u0438\u0442\u0435.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\">\u041f\u0440\u0435\u043c\u0430\u0445\u043d\u0438 \u043a\u043e\u043b\u0435\u043a\u0446\u0438\u044f\u0442\u0430 \u043f\u0440\u0438 \u0434\u0435\u0430\u043a\u0442\u0438\u0432\u0438\u0440\u0430\u043d\u0435<\/h3>\n\n\n\n<p>\u041a\u043e\u0433\u0430\u0442\u043e \u0434\u0435\u0430\u043a\u0442\u0438\u0432\u0438\u0440\u0430\u0448 \u0440\u0430\u0437\u0448\u0438\u0440\u0435\u043d\u0438\u0435\u0442\u043e, \u0438\u043a\u043e\u043d\u0438\u0442\u0435 \u043c\u0443 \u043d\u0435 \u0431\u0438\u0432\u0430 \u0434\u0430 \u043e\u0441\u0442\u0430\u0432\u0430\u0442 \u0432 picker-\u0430. \u041e\u0442\u0440\u0435\u0433\u0438\u0441\u0442\u0440\u0438\u0440\u0430\u0439 \u043a\u043e\u043b\u0435\u043a\u0446\u0438\u044f\u0442\u0430 \u0441 hook \u0437\u0430 \u0434\u0435\u0430\u043a\u0442\u0438\u0432\u0438\u0440\u0430\u043d\u0435; \u0442\u043e\u0432\u0430 \u043f\u0440\u0435\u043c\u0430\u0445\u0432\u0430 \u0432\u0441\u0438\u0447\u043a\u0438 \u043d\u0435\u0439\u043d\u0438 \u0438\u043a\u043e\u043d\u0438 \u0438 \u043d\u0435 \u0438\u0437\u0438\u0441\u043a\u0432\u0430 \u0446\u0438\u043a\u044a\u043b \u043f\u043e\u043e\u0442\u0434\u0435\u043b\u043d\u043e.<\/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\">\u0427\u0435\u0441\u0442\u0438 \u0432\u044a\u043f\u0440\u043e\u0441\u0438<\/h2>\n\n\n\n<h3 class=\"wp-block-heading\">\u0422\u0440\u044f\u0431\u0432\u0430 \u043b\u0438 \u043a\u043e\u043b\u0435\u043a\u0446\u0438\u044f\u0442\u0430 \u0434\u0430 \u0441\u0435 \u0440\u0435\u0433\u0438\u0441\u0442\u0440\u0438\u0440\u0430 \u043f\u0440\u0435\u0434\u0438 \u0438\u043a\u043e\u043d\u0438\u0442\u0435?<\/h3>\n\n\n\n<p>\u0414\u0430. \u0418\u043a\u043e\u043d\u0438\u0442\u0435 \u0442\u0440\u044f\u0431\u0432\u0430 \u0434\u0430 \u043f\u0440\u0438\u043d\u0430\u0434\u043b\u0435\u0436\u0430\u0442 \u043a\u044a\u043c \u0441\u044a\u0449\u0435\u0441\u0442\u0432\u0443\u0432\u0430\u0449\u0430 \u043a\u043e\u043b\u0435\u043a\u0446\u0438\u044f, \u0438\u043d\u0430\u0447\u0435 \u0442\u0438\u0445\u043e \u043d\u044f\u043c\u0430 \u0434\u0430 \u0441\u0435 \u043f\u043e\u043a\u0430\u0436\u0430\u0442 \u0432 picker-\u0430. \u0417\u0430\u043a\u0430\u0447\u0438 \u043a\u043e\u043b\u0435\u043a\u0446\u0438\u044f\u0442\u0430 \u043a\u044a\u043c <code>init<\/code> \u0441 \u043f\u0440\u0438\u043e\u0440\u0438\u0442\u0435\u0442\u0430 \u043f\u043e \u043f\u043e\u0434\u0440\u0430\u0437\u0431\u0438\u0440\u0430\u043d\u0435, \u0430 \u0438\u043a\u043e\u043d\u0438\u0442\u0435 \u0441 \u043f\u043e-\u0432\u0438\u0441\u043e\u043a, \u043d\u0430\u043f\u0440\u0438\u043c\u0435\u0440 20.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\">\u041c\u043e\u0433\u0430 \u043b\u0438 \u0434\u0430 \u0441\u043c\u0435\u0441\u0432\u0430\u043c <code>content<\/code> \u0438 <code>file_path<\/code> \u0432 \u0435\u0434\u043d\u0430 \u043a\u043e\u043b\u0435\u043a\u0446\u0438\u044f?<\/h3>\n\n\n\n<p>\u0414\u0430. \u0412\u0441\u0435\u043a\u0438 \u0438\u0437\u0432\u0438\u043a\u0432\u0430\u043d\u0435 \u043d\u0430 <code>wp_register_icon()<\/code> \u0435 \u0441\u0430\u043c\u043e\u0441\u0442\u043e\u044f\u0442\u0435\u043b\u043d\u043e. \u041f\u043e\u043b\u0437\u0432\u0430\u0439 <code>content<\/code> \u0437\u0430 \u0435\u0434\u043d\u0430-\u0434\u0432\u0435 \u0438\u043a\u043e\u043d\u0438, \u0430 <code>file_path<\/code> \u0437\u0430 \u043e\u0441\u0442\u0430\u043d\u0430\u043b\u0438\u0442\u0435; \u0441\u043b\u0435\u0434 \u0440\u0435\u0433\u0438\u0441\u0442\u0440\u0430\u0446\u0438\u044f\u0442\u0430 WordPress \u0433\u0438 \u0442\u0440\u0435\u0442\u0438\u0440\u0430 \u0435\u0434\u043d\u0430\u043a\u0432\u043e.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\">\u0420\u0430\u0431\u043e\u0442\u044f\u0442 \u043b\u0438 \u0438\u043a\u043e\u043d\u0438\u0442\u0435 \u043a\u0430\u0442\u043e \u0438\u043a\u043e\u043d\u0438 \u043d\u0430 \u0431\u043b\u043e\u043a \u0432 <code>register_block_type()<\/code>?<\/h3>\n\n\n\n<p>\u0414\u0430. \u041f\u043e\u0434\u0430\u0439 \u0440\u0435\u0433\u0438\u0441\u0442\u0440\u0438\u0440\u0430\u043d\u043e\u0442\u043e \u0438\u043c\u0435, \u043d\u0430\u043f\u0440\u0438\u043c\u0435\u0440 <code>'myplugin\/star'<\/code>, \u043d\u0430 \u043a\u043b\u044e\u0447\u0430 <code>icon<\/code>. \u0412\u043c\u044a\u043a\u0432\u0430\u0447\u044a\u0442 \u0449\u0435 \u043f\u043e\u043a\u0430\u0436\u0435 SVG \u0432\u043c\u0435\u0441\u0442\u043e Dashicon \u0438 \u0442\u043e\u0432\u0430 \u0432\u0430\u0436\u0438 \u043a\u0430\u043a\u0442\u043e \u0437\u0430 JavaScript \u0431\u043b\u043e\u043a\u043e\u0432\u0435, \u0442\u0430\u043a\u0430 \u0438 \u0437\u0430 \u0431\u043b\u043e\u043a\u043e\u0432\u0435 \u0441\u0430\u043c\u043e \u0441 PHP.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\">\u041a\u0430\u043a\u0432\u043e \u0432\u0440\u044a\u0449\u0430 <code>wp_get_icon()<\/code>?<\/h3>\n\n\n\n<p>\u0424\u0443\u043d\u043a\u0446\u0438\u044f\u0442\u0430 \u0432\u0440\u044a\u0449\u0430 SVG \u043a\u0430\u0442\u043e \u043d\u0438\u0437, \u043d\u0435 \u0433\u043e \u0438\u0437\u0432\u0435\u0436\u0434\u0430 \u0441\u0430\u043c\u0430. \u041c\u043e\u0436\u0435\u0448 \u0434\u0438\u0440\u0435\u043a\u0442\u043d\u043e \u0434\u0430 \u0433\u043e <code>echo<\/code>-\u043d\u0435\u0448 \u0438\u043b\u0438 \u0434\u0430 \u0433\u043e \u043f\u043e\u0441\u0442\u0430\u0432\u0438\u0448 \u0432 \u0441\u043e\u0431\u0441\u0442\u0432\u0435\u043d HTML. \u0412\u0442\u043e\u0440\u0438\u044f\u0442 \u043c\u0430\u0441\u0438\u0432 <code>$args<\/code> \u043f\u0440\u0438\u0435\u043c\u0430 <code>size<\/code>, <code>class<\/code>, <code>label<\/code> \u0437\u0430 <code>aria-label<\/code> \u0438 <code>title<\/code>.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\">\u041a\u0430\u043a\u0432\u043e \u0434\u0430 \u043f\u0440\u0435\u043c\u0430\u0445\u043d\u0430 \u043e\u0442 SVG \u043f\u0440\u0435\u0434\u0438 \u0440\u0435\u0433\u0438\u0441\u0442\u0440\u0430\u0446\u0438\u044f?<\/h3>\n\n\n\n<p>\u041f\u0440\u0435\u043c\u0430\u0445\u043d\u0438 \u0444\u0438\u043a\u0441\u0438\u0440\u0430\u043d\u0438 <code>fill<\/code> \u0438 <code>stroke<\/code> \u0446\u0432\u0435\u0442\u043e\u0432\u0435, \u043a\u0430\u043a\u0442\u043e \u0438 <code>width<\/code> \u0438 <code>height<\/code> \u043e\u0442 \u043e\u0441\u043d\u043e\u0432\u043d\u0438\u044f <code>&lt;svg&gt;<\/code> \u0435\u043b\u0435\u043c\u0435\u043d\u0442, \u043d\u043e \u0437\u0430\u043f\u0430\u0437\u0438 <code>viewBox<\/code>. \u041c\u0430\u0445\u043d\u0438 \u043e\u0449\u0435 \u0432\u0441\u0438\u0447\u043a\u0438 <code>&lt;style&gt;<\/code> \u0431\u043b\u043e\u043a\u043e\u0432\u0435 \u0438 \u0441\u043a\u0440\u0438\u043f\u0442\u043e\u0432\u0435; \u043e\u0441\u0442\u0430\u0432\u0438 \u0441\u0442\u0440\u0443\u043a\u0442\u0443\u0440\u043d\u0438\u0442\u0435 \u0430\u0442\u0440\u0438\u0431\u0443\u0442\u0438. \u0417\u0430 \u0446\u0432\u044f\u0442 \u0438\u0437\u043f\u043e\u043b\u0437\u0432\u0430\u0439 <code>currentColor<\/code>.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\">\u041c\u043e\u0433\u0430 \u043b\u0438 \u0434\u0430 \u0440\u0435\u0433\u0438\u0441\u0442\u0440\u0438\u0440\u0430\u043c \u0438\u043a\u043e\u043d\u0438 \u043e\u0442 \u0442\u0435\u043c\u0430?<\/h3>\n\n\n\n<p>\u0414\u0430. \u0421\u044a\u0449\u043e\u0442\u043e \u0438\u0437\u0432\u0438\u043a\u0432\u0430\u043d\u0435 \u043d\u0430 <code>wp_register_icon()<\/code> \u0440\u0430\u0431\u043e\u0442\u0438 \u0432\u044a\u0432 <code>functions.php<\/code> \u043d\u0430 \u0442\u0435\u043c\u0430, \u043a\u0430\u0442\u043e \u0437\u0430 \u043f\u044a\u0442\u044f \u0434\u043e \u0444\u0430\u0439\u043b\u0430 \u0438\u0437\u043f\u043e\u043b\u0437\u0432\u0430\u0448 <code>get_stylesheet_directory()<\/code>. \u041a\u043e\u043c\u043f\u0440\u043e\u043c\u0438\u0441\u044a\u0442 \u0435, \u0447\u0435 \u0438\u043a\u043e\u043d\u0438\u0442\u0435 \u0438\u0437\u0447\u0435\u0437\u0432\u0430\u0442, \u043a\u043e\u0433\u0430\u0442\u043e \u0441\u043c\u0435\u043d\u0438\u0448 \u0442\u0435\u043c\u0430\u0442\u0430.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\">\u041a\u0430\u043a\u0432\u043e \u0441\u0442\u0430\u0432\u0430, \u0430\u043a\u043e \u0434\u0432\u0435 \u043a\u043e\u043b\u0435\u043a\u0446\u0438\u0438 \u0438\u043c\u0430\u0442 \u0438\u043a\u043e\u043d\u0430 \u0441 \u0435\u0434\u043d\u0430\u043a\u0432\u043e \u0438\u043c\u0435?<\/h3>\n\n\n\n<p>\u041a\u043e\u043b\u0435\u043a\u0446\u0438\u0438\u0442\u0435 \u0434\u0435\u0439\u0441\u0442\u0432\u0430\u0442 \u043a\u0430\u0442\u043e namespace. <code>myplugin\/heart<\/code> \u0438 <code>otherplugin\/heart<\/code> \u0441\u044a\u0449\u0435\u0441\u0442\u0432\u0443\u0432\u0430\u0442 \u0435\u0434\u043d\u043e\u0432\u0440\u0435\u043c\u0435\u043d\u043d\u043e \u0431\u0435\u0437 \u043a\u043e\u043d\u0444\u043b\u0438\u043a\u0442, \u0437\u0430\u0449\u043e\u0442\u043e \u0443\u043d\u0438\u043a\u0430\u043b\u043d\u043e \u0435 \u0446\u044f\u043b\u043e\u0442\u043e \u0438\u043c\u0435 \u0441 \u043f\u0440\u0435\u0444\u0438\u043a\u0441\u0430 \u043d\u0430 \u043a\u043e\u043b\u0435\u043a\u0446\u0438\u044f\u0442\u0430.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\">WordPress \u0444\u0438\u043b\u0442\u0440\u0438\u0440\u0430 \u043b\u0438 SVG \u043f\u0440\u0438 \u0440\u0435\u0433\u0438\u0441\u0442\u0440\u0430\u0446\u0438\u044f?<\/h3>\n\n\n\n<p>\u041d\u0435. WordPress \u043d\u0435 \u043f\u0440\u043e\u043c\u0435\u043d\u044f SVG \u0441\u044a\u0434\u044a\u0440\u0436\u0430\u043d\u0438\u0435\u0442\u043e \u043f\u0440\u0438 \u0440\u0435\u0433\u0438\u0441\u0442\u0440\u0430\u0446\u0438\u044f: \u043f\u043e\u0434\u0430\u0434\u0435\u043d\u0438\u044f\u0442 \u043d\u0438\u0437 \u0438\u043b\u0438 \u0441\u044a\u0434\u044a\u0440\u0436\u0430\u043d\u0438\u0435\u0442\u043e \u043d\u0430 \u043f\u043e\u0441\u043e\u0447\u0435\u043d\u0438\u044f \u0444\u0430\u0439\u043b \u0441\u0435 \u0441\u0435\u0440\u0432\u0438\u0440\u0430 \u0442\u043e\u0447\u043d\u043e \u0442\u0430\u043a\u0430. \u041f\u043e\u0447\u0438\u0441\u0442\u0438 SVG \u0444\u0430\u0439\u043b\u043e\u0432\u0435\u0442\u0435 \u043f\u0440\u0435\u0434\u0438 \u043f\u0443\u0431\u043b\u0438\u043a\u0443\u0432\u0430\u043d\u0435 \u2013 \u043f\u0440\u0435\u043c\u0430\u0445\u043d\u0438 \u0441\u043a\u0440\u0438\u043f\u0442\u043e\u0432\u0435, \u0432\u044a\u043d\u0448\u043d\u0438 \u043f\u0440\u0435\u043f\u0440\u0430\u0442\u043a\u0438 \u0438 \u0432\u0441\u0438\u0447\u043a\u043e \u0438\u0437\u043b\u0438\u0448\u043d\u043e.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\">\u0421\u043b\u0435\u0434\u0432\u0430\u0449\u0430\u0442\u0430 \u0441\u0442\u044a\u043f\u043a\u0430<\/h2>\n\n\n\n<p>\u041f\u044a\u043b\u043d\u043e\u0442\u043e \u0440\u0430\u0437\u0448\u0438\u0440\u0435\u043d\u0438\u0435 \u0441 \u043f\u0440\u0438\u043c\u0435\u0440\u043d\u0438 SVG \u0444\u0430\u0439\u043b\u043e\u0432\u0435, README \u0438 \u043c\u0430\u0441\u043e\u0432\u0430\u0442\u0430 \u0440\u0435\u0433\u0438\u0441\u0442\u0440\u0430\u0446\u0438\u044f \u0435 \u0434\u043e\u0441\u0442\u044a\u043f\u043d\u043e \u0432 <a href=\"https:\/\/github.com\/webtechhardik\/wpviibes-custom-icons\">GitHub \u0445\u0440\u0430\u043d\u0438\u043b\u0438\u0449\u0435\u0442\u043e<\/a>. \u0421\u043b\u0435\u0434 \u043a\u0430\u0442\u043e WordPress 7.1 \u0435 \u043d\u0430\u043b\u0438\u0447\u0435\u043d \u0432 \u0441\u0440\u0435\u0434\u0430\u0442\u0430 \u0442\u0438, \u0440\u0435\u0433\u0438\u0441\u0442\u0440\u0438\u0440\u0430\u0439 \u043f\u044a\u0440\u0432\u043e \u043a\u043e\u043b\u0435\u043a\u0446\u0438\u044f\u0442\u0430, \u0434\u043e\u0431\u0430\u0432\u0438 SVG \u0444\u0430\u0439\u043b\u043e\u0432\u0435\u0442\u0435 \u0438 \u043f\u0440\u043e\u0432\u0435\u0440\u0438 \u0438\u043a\u043e\u043d\u0438\u0442\u0435 \u0435\u0434\u043d\u043e\u0432\u0440\u0435\u043c\u0435\u043d\u043d\u043e \u0432 <code>core\/icon<\/code>, \u0448\u0430\u0431\u043b\u043e\u043d\u0438\u0442\u0435 \u0438 \u0431\u043b\u043e\u043a\u0430 \u0442\u0438.<\/p>\n\n\n\n<p>\u0422\u043e\u0437\u0438 \u043c\u043e\u0434\u0435\u043b \u201e\u0440\u0435\u0433\u0438\u0441\u0442\u0440\u0438\u0440\u0430\u0439 \u0432\u0435\u0434\u043d\u044a\u0436, \u0438\u0437\u043f\u043e\u043b\u0437\u0432\u0430\u0439 \u043d\u0430\u0432\u0441\u044f\u043a\u044a\u0434\u0435\u201c \u0441\u044a\u0432\u043f\u0430\u0434\u0430 \u0441 \u043f\u043e\u0441\u043e\u043a\u0430\u0442\u0430 \u043d\u0430 API-\u0442\u0430\u0442\u0430 \u0432 WordPress, \u0432\u043a\u043b\u044e\u0447\u0438\u0442\u0435\u043b\u043d\u043e Abilities API \u0438 PHP-only \u0431\u043b\u043e\u043a\u043e\u0432\u0435\u0442\u0435: \u0440\u0435\u0433\u0438\u0441\u0442\u044a\u0440\u044a\u0442 \u0437\u0430\u0445\u0440\u0430\u043d\u0432\u0430 \u0440\u0435\u0434\u0430\u043a\u0442\u043e\u0440\u0430, PHP \u0441\u043b\u043e\u044f, REST API \u0438 \u0432\u044a\u043d\u0448\u043d\u0438 \u0438\u043d\u0441\u0442\u0440\u0443\u043c\u0435\u043d\u0442\u0438. \u0417\u0430 \u0440\u0430\u0437\u0448\u0438\u0440\u0435\u043d\u0438\u044f\u0442\u0430 \u0442\u043e\u0432\u0430 \u043e\u0437\u043d\u0430\u0447\u0430\u0432\u0430 \u0431\u0440\u0430\u043d\u0434\u0438\u0440\u0430\u043d\u043e \u0438\u0437\u0436\u0438\u0432\u044f\u0432\u0430\u043d\u0435 \u0432 \u0440\u0435\u0434\u0430\u043a\u0442\u043e\u0440\u0430 \u0431\u0435\u0437 JavaScript build \u0441\u0442\u044a\u043f\u043a\u0430.<\/p>\n\n\n<div class=\"references-section\">\n                <h2>\u041f\u0440\u0435\u043f\u0440\u0430\u0442\u043a\u0438 \/ \u0418\u0437\u0442\u043e\u0447\u043d\u0438\u0446\u0438<\/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><li><a href=\"https:\/\/wpvibes.com\/blog\/php-only-blocks-wordpress\/\" target=\"_blank\" rel=\"noopener noreferrer\">PHP-Only Blocks in WordPress 7.0: The Developer&#039;s Complete Guide<\/a><\/li><\/ul>\n            <\/div>","protected":false},"excerpt":{"rendered":"<p>\u0421\u043e\u0431\u0441\u0442\u0432\u0435\u043d\u0438\u0442\u0435 SVG \u0438\u043a\u043e\u043d\u0438 \u0432\u0435\u0447\u0435 \u043d\u0435 \u0438\u0437\u0438\u0441\u043a\u0432\u0430\u0442 JavaScript \u0438 build \u043f\u0440\u043e\u0446\u0435\u0441. \u0412\u0438\u0436 \u043a\u0430\u043a WordPress 7.1 \u0433\u0438 \u0440\u0435\u0433\u0438\u0441\u0442\u0440\u0438\u0440\u0430 \u0432\u0435\u0434\u043d\u044a\u0436 \u0438 \u0433\u0438 \u043f\u0440\u0430\u0432\u0438 \u0434\u043e\u0441\u0442\u044a\u043f\u043d\u0438 \u0432 \u0440\u0435\u0434\u0430\u043a\u0442\u043e\u0440\u0430, PHP \u0438 REST API.<\/p>\n","protected":false},"author":40,"featured_media":241,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[2],"tags":[15,65,136,127,134],"class_list":["post-244","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-wordpress","tag-php","tag-svg","tag-wordpress-7-1","tag-127","tag-134"],"_links":{"self":[{"href":"https:\/\/helloblog.io\/bg\/wp-json\/wp\/v2\/posts\/244","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/helloblog.io\/bg\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/helloblog.io\/bg\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/helloblog.io\/bg\/wp-json\/wp\/v2\/users\/40"}],"replies":[{"embeddable":true,"href":"https:\/\/helloblog.io\/bg\/wp-json\/wp\/v2\/comments?post=244"}],"version-history":[{"count":0,"href":"https:\/\/helloblog.io\/bg\/wp-json\/wp\/v2\/posts\/244\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/helloblog.io\/bg\/wp-json\/wp\/v2\/media\/241"}],"wp:attachment":[{"href":"https:\/\/helloblog.io\/bg\/wp-json\/wp\/v2\/media?parent=244"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/helloblog.io\/bg\/wp-json\/wp\/v2\/categories?post=244"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/helloblog.io\/bg\/wp-json\/wp\/v2\/tags?post=244"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}