Как сделать иконку (фавикон, favicon) и установить на сайт ?

Рубрика: ДЛЯ БЛОГА

Здравствуйте, уважаемые читатели блога Internet-Working.ru! Сегодня Мы поговорим об иконках favicon (фавикон). Узнаем как создавать фавикон и научимся устанавливать его на свой сайт (блог).

Что такое favicon (фавикон) ?

У многих наверное возник вопрос: Что такое favicon (фавикон), о чём это он? Фавикон - это иконка (картинка), которая располагается перед адресом сайта. Вы можете увидеть её в своём браузере. У меня она выглядит так:

Это прикольная вещь, которая, Я считаю, должна быть у каждого сайта (блога). Фавикон устанавливают для того, чтобы отличаться и выделяться среди других сайтов. При поиске какой либо информации пользователь Интернета первым делом обратит внимание на сайт с фавиконом, нежели без него, так как он будет выделяться. И соответственно, чем красочнее favicon, тем больше желания возникает у пользователей перейти именно на этот сайт. Ну как-то так 🙂

Создаём favicon (фавикон) своими руками

Давайте попробуем создать фавикон. Для этого существует специальный сервис - favicon.cc. Выглядит он так:

Переходим на этот сайт и просто рисуем фавикон, который Вы хотите. Здесь достаточное количество различных инструментов, для создания красочного фавикона. Можно менять цвет.

Если Вам не нравится определённая область, которую Вы нарисовали - её можно стереть, используя специальный инструмент. Для этого ставим галочку возле слова "transparent" и "клацаем" по клеточкам, которые необходимо убрать:

Очень удобной функцией в этом сервисе является то, что во время рисования Вы можете сразу видеть результат своей работы. Для этого опускаемся в Раздел "Preview":

Итак, Вы нарисовали фавикон. Теперь сохраняем его на свой компьютер. Для это жмём на кнопку "Download Favicon":

Если Вы не обладаете навыками художника и у Вас всё-таки не получается нарисовать красивый favicon (фавикон), Вы можете сделать его уже из готового изображения. Для этого Нам понадобится сервис favicon.ru

Переходим на сайт и под словами "Сделать favicon из изображения", жмём на кнопку "Выберите файл":

Загружаем уже сохранённое на компьютере изображение формата jpg, из которого Вы хотите сделать фавикон и жмём кнопку "СКАЧАТЬ FAVICON":

Также на данном сервисе Вы можете заказать favicon у профессионалов, нажав на кнопку "ЗАКАЗАТЬ":

Я не пользовался этой услугой, думаю она платная. Лучше Я Вам предложу воспользоваться следующими сервисами с уже готовыми иконками:

favicon.cc - переходим в раздел "Лучшие Favicons"
audit4web.ru - имеет большой архив иконок.
dryicons.com - иконки на любой вкус.

Устанавливаем favicon (фавикон) на сайт

Итак, у нас есть favicon. Теперь необходимо прикрепить его к своему сайту. Для этого выполняем следующие действия:

Копируем созданный Вами фавикон - favicon.ico в корневую папку Вашего сайта (блога). То есть туда где находятся папки wp-content, wp-admin и т.д. У меня эта папка называется public_html :

Далее открываем файл header.php и прописываем в этом файле между тегом <head> и </head> следующий код:

<link href="http://адрес_сайта/favicon.ico" rel="shortcut icon" type="image/x-icon" /> 
<link href="http://адрес_сайта/favicon.ico" rel="icon" type="image/x-icon" />

Понятно, что вместо слов адрес сайта пишем адрес своего блога (сайта). То есть вот так: