Содержание статьи
Не нужно устанавливать сторонние плагины. Подключение значка можно реализовать вручную через хук wp_head
. Добавьте в файл functions.php
следующую конструкцию:
function add_site_icon() {
echo \'<link rel=\"icon\" href=\"\' . get_stylesheet_directory_uri() . \'/favicon.ico\" />\';
}
add_action(\'wp_head\', \'add_site_icon\');
Работает без зависимости от темы. Файл favicon.ico должен находиться в корне активного шаблона. Путь можно изменить, если ресурсы хранятся в другом месте.
Иконка для панели управления задается отдельно. Используйте хук admin_head
и аналогичную вставку:
function admin_favicon() {
echo \'<link rel=\"icon\" href=\"\' . get_stylesheet_directory_uri() . \'/admin-favicon.ico\" />\';
}
add_action(\'admin_head\', \'admin_favicon\');
Внимание! Обычная иконка не подставляется в интерфейс администратора автоматически – нужно прописывать вручную.
Файл для панели управления может быть отличен от общего значка. Это особенно полезно при работе с мультисайтом или кастомной админкой. Нужен чёткий визуальный ориентир? Создавайте разные иконки.
При использовании кастомного плагина или фреймворка для темы, может потребоваться дополнительный фильтр или перегрузка стандартной логики.
С версии 4.3 появилась опция добавления через кастомайзер. Но она не влияет на иконку в панели управления. Ловушка. Разрыв между интерфейсами. Никакого единого источника.
Важно помнить: браузеры кэшируют значок. При замене файла принудительно очистите кэш или измените имя файла.
Что делать при отсутствии поддержки формата .ico? Используйте .png с указанием размеров:
<link rel=\"icon\" type=\"image/png\" sizes=\"32x32\" href=\"/path/to/favicon-32x32.png\">
Нельзя надеяться на автоматизацию. WordPress не предлагает полной универсальности в этих деталях. Нужно руками. Без иллюзий. Только прямое управление.
Поддержка Retina? Отдельный файл 192×192. А ещё можно прописать apple-touch-icon – если есть смысл.
Добавление favicon через настройки темы WordPress
Перейдите в раздел Внешний вид → Настроить. Найдите пункт «Иконка сайта». Не видите? Значит, тема не поддерживает этот функционал. Придется действовать через фильтры или дочернюю тему.
Если пункт доступен – нажмите. Загрузите изображение размером не меньше 512×512 пикселей. Формат – PNG. JPG – допустим, но без прозрачности. SVG – не поддерживается по умолчанию. Это раздражает, но такова специфика ядра.
Важно! Размер менее 512×512 приведёт к нечеткости в закладках и на мобильных экранах.
После загрузки нажмите «Опубликовать». Изменения вступят в силу немедленно. Проверить можно через источник страницы: ищите <link rel=\"icon\" href=\"...\" />
.
Не обновилось? Кэш. Очистите браузер и сторонние плагины. Проблема осталась? Используется плагин кэширования – сбросьте и его. Иногда помогает смена темы и возврат обратно.
Раздражает? Понимаю. Некоторые темы, особенно кастомные, игнорируют стандартные хуки WordPress. Тогда вручную:
add_action(\'wp_head\', function() {
echo \'<link rel=\"icon\" href=\"\' . get_stylesheet_directory_uri() . \'/wp-content/uploads/2025/05/favicon.ico\" type=\"image/x-icon\">\';
});
Расположите иконку в папке темы. Не используйте внешние CDN – они блокируются в админке по политике безопасности.
Внимание! Если работаете в мультисайте – потребуется отдельная иконка на каждый поддомен или отдельный фильтр
get_site_icon_url
.
Проверка – Ctrl+U. Поиск по слову icon
. Ищите дубликаты. Бывает, темы вставляют свою иконку поверх той, что вы задали вручную. Удалите хук через remove_action
– и порядок.
Установка favicon вручную через файл functions.php и папку темы
Положите изображение формата .ico, .png или .svg в корень активной темы. Название строго: favicon.ico
или иное, но тогда путь указывается явно. Расширение .ico – приоритетное, браузеры ожидают его первым.
Внимание! Автоматически ничего не подключается. Нужен прямой вызов через хук
wp_head
.
Добавьте в functions.php
код:
function custom_site_icon() {
echo \'<link rel=\"icon\" href=\"\' . get_stylesheet_directory_uri() . \'/favicon.ico\" type=\"image/x-icon\">\';
echo \'<link rel=\"shortcut icon\" href=\"\' . get_stylesheet_directory_uri() . \'/favicon.ico\" type=\"image/x-icon\">\';
}
add_action(\'wp_head\', \'custom_site_icon\');
Проверяйте путь. Если используете дочернюю тему – get_stylesheet_directory_uri()
. Если основную – get_template_directory_uri()
.
- Размер: 32×32 или 48×48 пикселей. Лучше – многослойный .ico.
- Формат SVG не всегда корректно отображается в Safari и IE.
- Не загружайте через медиабиблиотеку. Только физически в папку.
Важно помнить: WordPress может переопределить отображение, если ранее был установлен значок через кастомайзер. Удалите его в панели настроек внешнего вида.
На страницах консоли значок не изменится. Для этого потребуется фильтр admin_head
и отдельный вызов. Пример:
function admin_custom_icon() {
echo \'<link rel=\"icon\" href=\"\' . get_stylesheet_directory_uri() . \'/favicon.ico\" type=\"image/x-icon\">\';
}
add_action(\'admin_head\', \'admin_custom_icon\');
Кэш браузера безжалостен. Обновление может не сработать. Пропишите уникальный параметр:
/favicon.ico?v=2
Малейшая опечатка – значок не загрузится. Никаких сообщений, тишина. Проверяйте вручную через DevTools.
Вопрос – зачем через functions.php
, если можно просто вставить в header.php
? Ответ – контроль. И масштабируемость. Подключение через хук – корректно, безопасно, учитывает child themes и future updates.
Настройка отдельного favicon для панели администратора WordPress
Создайте файл-значок, отличающийся от основного интерфейса. Сохраните его в директории темы или в подкаталоге /assets текущей оболочки.
Далее – хук admin_head. Подключение выполняется через файл functions.php
или отдельный модуль:
add_action(\'admin_head\', function() {
echo \'<link rel=\"icon\" type=\"image/png\" href=\"\' . get_stylesheet_directory_uri() . \'/assets/admin-icon.png\">\';
});
Формат изображения – PNG или ICO. Размер – 32×32. Поддержка SVG в административной части нестабильна, браузеры ведут себя непредсказуемо. Не рискуйте.
Внимание! Не используйте тот же файл, что на фронте. Кэш может помешать увидеть изменения. Очистите его принудительно или проверьте в режиме инкогнито.
Роль пользователя значения не имеет. Эмблема будет одинаковой для всех, у кого есть доступ к интерфейсу управления.
Если используется кастомная тема администрирования – например, через Adminimize или собственный CSS – учтите приоритеты стилей. Иногда link-тег с favicon сбрасывается, если не обернуть в wp_admin_css
.
add_action(\'admin_enqueue_scripts\', function() {
add_action(\'admin_head\', function() {
echo \'<link rel=\"icon\" type=\"image/png\" href=\"\' . plugin_dir_url(__FILE__) . \'custom/admin-fav.png\">\';
});
});
Важно помнить: при использовании мультисайта фавикон подгружается глобально. Придётся настраивать через
is_network_admin()
иis_user_admin()
для разделения.
Не пробуйте вставлять напрямую в admin-footer.php
ядра – любое обновление уничтожит результат. Только хуки. Только через тему или подключаемый плагин.
Никаких CDN. Даже минимальная задержка – и браузер вернётся к стандартной иконке. Быстродействие критично.
Проверка работоспособности – через DevTools, вкладка Network. Убедитесь, что адрес изображения соответствует настройкам. Иначе – снова кэш, снова бой.