13.12.2012

Фавикон в WordPress

Что ни говори, но Яндекс был и остается наиболее популярной поисковой системой в рунете. И тот, кто им пользуется, наверняка знает, что такое фавикон, ну или favicon.ico.

Фавикон - это маленькая иконка, располагающаяся рядом с названием сайта на странице выдачи Яндекса. Она же появляется на закладке в браузере, рядом с заголовком открытой страницы.

фавикон в выдаче яндекса
С помощью фавиконов удобно создавать в браузере панель закладок, вот типа такой:

панель закладок
 
Если вы всерьез заботитесь об уникальности и оригинальности своего сайта, для него обязательно надо создать фавикон.

Как это сделать?

Да все, как обычно, просто. Нужно создать картинку размером 16x16 пикселей. Сделать это можно в любом графическом редакторе. Я обычно рисую в Фотошопе, хотя, наверное, векторные редакторы тут более удобны. Сохраняю в формате jpg или gif, в зависимости от того, прозрачный фон у картинки или нет. Ну, а затем просто переименовываю картинку и даю ей имя favicon.ico.

Впрочем, в интернете есть масса сервисов, позволяющих создать фавикон онлайн

Например:

http://favicon.ru . На этом сайте вы можете просто взять и нарисовать себе иконку, а затем сохранить на свой компьютер.

Если вы не очень-то умеете рисовать, можно воспользоваться сервисом
http://www.cy-pr.com/tools/favicon/  - здесь фавикон создается из картинки, которую вы загрузите со своего компьютера.

http://www.favicon.by/ - на этом сайте можно создать анимированный фавикон.

Итак, фавикон создали.
Забрасываем картинку в корень сайта и в где-нибудь разделе < HEAD>  < /HEAD>  размещаем следующий код:

<link rel="shortcut icon" href="/favicon.ico"/>  
<link href="/favicon.ico" rel="icon" type="image/x-icon" />  

Однако, если ваш сайт создан на движке Wordpress, тут не так все просто.

Есть две основных возможности:
Первая - файлик favicon.ico в корне сайта.
Вторая - favicon.ico  внутри вашего шаблона, то есть в папке с названием шаблона.

В любом из этих случаев мы должны найти файл header.php. Для этого заходим в папку wp-content, затем в папку themes, там находим папку с названием своей темы и уже в ней файл header.php.

Там, перед закрывающим тегом < /HEAD> вставляем код, указанный выше, то есть
<link rel="shortcut icon" href="/favicon.ico"/>  
<link href="/favicon.ico" rel="icon" type="image/x-icon" />  

НО!

Необходимо заменить ссылку /favicon.ico  на другую:

Если фавикон лежит в корне сайта, заменяем на: 
< ?php bloginfo('home'); ?>/favicon.ico  

 

Если фавикон лежит к папке шаблона, заменяем на:
< ?php bloginfo('template_url'); ?>/favicon.ico 

Вот и все!
Если ваш фавикон почему-то не отобразился на закладке браузера, попробуйте нажать комбинацию клавиш Ctrl+F5 или
очистить кэш браузера.