ThemesWP — создаем вместе сайты на WordPress. Шаблоны, плагины, новости и уроки про WordPress Ещё один сайт на WordPress
Привет, друзья! В этом уроке поговорим о favicon (фавиконке) – обязательном элементе хорошего сайта. Favicon – это маленькая квадратная картинка (традиционные размеры в пикселах – 16х16 и 32х32), выполняющая роль ярлыка сайта. Отображается браузерами вверху вкладки перед названием страницы (вебресурса), в строке перед адресом сайта и в других местах интерфейса. Фавиконки предназначены для упрощения идентификации сайта пользователями. Поэтому изображение, используемое в качестве Favicon, должно быть заметным и запоминающимся. Среди открытых в браузере вкладок пользователь должен с первого взгляда увидеть ваш сайт.
Фавиконку можно нарисовать в графическом редакторе на компьютере или создать в одном из онлайн-сервисов.
Кстати, многие вебмастера рисуют Favicon в формате .ico и считают, что файлы с другими расширениями как фавиконки работать не будут. Это не так. Сохраните изображение в формате .png, «назначьте» его фавиконом, и все браузеры (кроме «древних» версий Internet Explorer) его определят и покажут пользователям.
Я делаю фавиконки в Photoshop. Часто использую часть логотипа или первые буквы из названия сайта. Нарисованную на прозрачном фоне картинку уменьшаю до размера 128х128 пикселов и сохраняю в формате .png. Уменьшать Favicon до размеров 16х16 или 32х32 пикселов не обязательно – WordPress сделает это автоматически.
Алгоритм установки в WordPress Favicon
1. Загрузите файл favicon.png в корневой каталог активированного на сайте шаблона (темы). Внимание! Файл фавиконки обязательно должен называться favicon!
2. Перейдите в Редактор шаблона через раздел Внешний вид боковой панели слева административной панели.
3. В списке файлов справа нажмите Заголовок (или header.php).
4. Если вы загрузили на сайт фавикон с расширением .png, скопируйте опубликованный ниже код и разместите его в коде шаблона (в большом поле) под тегом <head>:
<link rel="shortcut icon" href="<?php echo get_stylesheet_directory_uri(); ?>/favicon.png" />
5. Если вы загрузили на сайт фавикон с расширением .ico, добавьте в код шаблона (ниже тега <head>) следующее:
<link rel="shortcut icon" href="<?php echo get_stylesheet_directory_uri(); ?>/favicon.ico" />
6. Нажмите Обновить файл.
Готово! Favicon установлен на ваш сайт. Как видите, его создание и установка в WordPress не воруют много времени и не нуждаются в специальных навыках. За подобную простоту «в эксплуатации» я и люблю WordPress!
Описанный в уроке способ установки фавиконки не единственный. Но я использую только этот, потому что нравится скорость его воплощения в жизнь.
Если что-то не получилось при создании и добавлении Favicon на сайт, напишите в комментариях. Будем решать вашу проблему вместе!
