Как создать favicon (иконку сайта) и установить его на WordPress

Favicon — иконка вашего сайта.

2

Как создать favicon

Favicon можно нарисовать самому или сделать из любой картинки или выбрать уже готовый. Чтобы нарисовать самому, вы можете использовать любой редактор изображений, будь то Photoshop или Paint, также можно нарисовать и на специальном сайте, их много, я рисовал на favicon.cc, здесь же можно и любую картинку переформатировать в фавикон, т.е. в формат .ico. Хотите на русском? Тогда favicon.ru. Стандартный размер изображения для favicon 16×16 пикселей, однако при таком раскладе многие переформатированные в фавикон картинки могут быть просто непонятны, т.е. будет просто какое-то разноцветное пятно, тогда можно сделать фавикон бОльшего размера, например 24×24 или 32×32 пикселя. Фавикон такого формата можно сделать вот здесь.

3

Как загрузить favicon и установить его на WordPress

Загружаем фавикон на WordPress, для этого в кабинете наводим курсор на «Медиафайлы», затем жмём «Добавить новый»:

4

Далее жмём «Выберите файлы» и выбираете ваш фавикон, т.е. файл формата .ico , у меня такой файл носит название «favicon.ico».

Когда файл загрузился, жмём «Изменить» :

5

Теперь копируем и куда-нибудь сохраняем ссылку на файл, которая находится справа, она нам понадобится позже

6

Дальше «Внешний вид» —> «Редактор»

7

Жмём «Заголовок (header.php)»

8

Теперь, после <head> (см. рис. ниже) , вставляем вот это:

<link rel="icon" href= "Ссылка на файл" type="image/x-icon" />
<link rel="shortcut icon"href= "Ссылка на файл" type="image/x-icon" />

Там где написано «Ссылка на файл», вместо этого надо вставить вашу ссылку на файл, которую вы ранее сохранили, помните? Вот как это выглядит у меня:

9

Теперь снизу жмём «Обновить файл» и всё, ваш favicon готов, любуйтесь!

Эта статья была опубликована в категории Уроки автором Zheka. Bookmark the permalink.

5 ответа на “Как создать favicon (иконку сайта) и установить его на WordPress

  1. Лучше сохранять favicon в корне сайта. Потому что поисковые роботы всегда туда смотрят и копятся ошибки 404 из-за того, что её там нет, а еще тогда не придётся прописывать её в код header.

Добавить комментарий

Ваш e-mail не будет опубликован. Обязательные поля помечены *

Можно использовать следующие HTML-теги и атрибуты: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <s> <strike> <strong>