Создание иконки сайта (favicon)

Рад приветствовать читателей моего блога!

Сегодня я расскажу о том, как создать иконку сайта (так называемый favicon), которая придаст индивидуальность вашему ресурсу.

Ищешь заработок в Интернете? Записывайся на бесплатный онлайн курс «СПЕЦИАЛИСТ ПО ИНТЕРНЕТ-РЕКЛАМЕ» и получи удаленную профессию рекламщика в Яндекс Директ за 10 дней!

Что такое favicon?

Favicon представляет из себя значок веб-сайта, отображаемый браузером во вкладках, в закладках при добавлении туда сайта, в адресной строке левее URL сайта и в других элементах интерфейса.

Само слово favicon образовано из двух других, а именно FAVorites ICON, что переводится на русский язык как «значок для избранного». Чтобы вы наглядно могли оценить, что из себя представляет иконка сайта favicon, размещаю скриншот, на котором стрелками обозначены иконки разных интернет-ресурсов:

Создание иконки сайта (favicon)

Думаю, что теперь понятно, что из себя представляет favicon и можно переходить к рассмотрению вопроса о его создании.

Создание иконки сайта (favicon)

При создании иконки для сайта первым делом нужно определиться с изображением, которое будет использоваться в качестве нее. Предлагаю выбрать в качестве данного изображения что-то схожее по смыслу с тематикой вашего сайта/блога.

Далее это изображение нужно создать с помощью графического редактора, например Photoshop. Можно также воспользоваться сайтом http://www.favicon.cc, на котором есть возможность создать свой, либо скачать уже существующий favicon в рубрике Top Rated Favicons.

В любом случае, в результате должен получиться файл с изображением размером 16×16 или 32×32 пиксела с расширением gif или png. После этого переименовываем его в favicon.ico и загружаем с помощью FTP-клиента на хостинг в корень (или в любое другое место, главное запомнить путь к файлу) вашего сайта.

Теперь, когда выбранная для вашего сайта иконка уже загружена на хостинг, осталось лишь найти в файле header.php вашего шаблона WordPress тег <head></head> и перед закрывающим тегом </head> (с использованием текстового редактора, рекомендую использовать notepad++ по FTP, либо в админ-панели найти пункт Внешний видРедакторheader.php) вставить следующий код, отвечающий за отображение этой самой иконки сайта:

<link href="http://имя сайта/путь к файлу favicon.ico/favicon.ico" rel="shortcut icon" type="image/png" />

Сохраняем изменения, обновляем страницу и наблюдаем появившуюся иконку вашего сайта/блога.

Если иконка не отображается, то проверьте правильность написания пути к ней. Не размещайте файл favicon.ico сильно глубоко, лучше всего разместить его в корне сайта на хостинге.

На этом создание иконки сайта (favicon) для сайта/блога на WordPress завершено!

Подписывайтесь на обновления моего блога, чтобы не пропустить публикацию новых статей!

До скорых встреч. С уважением, Владимир Денисов!

Также стоит прочитать:

Красивая форма подписки feedburner для WordPress... Всем привет! Сегодня поменял внешний вид формы подписки на обновления моего...блога, реализованной через такой сервис Google, как feedburner. Именно по этой...причине в данной статье я расскажу о создании красивой формы подписки feedburner...для WordPress.
Картинки в комментариях. Плагин Comment Images... Здравствуйте, читатели моего блога! Речь в данной статье пойдет о плагине для...WordPress, который позволяет вставлять изображения в комментарии. Разумеется,...это не единственный способ выполнения данной операции, ведь уже размещенное в...интернете изображение можно вставить в комментарий с использованием ссылки не...него. Однако, для этого изображение должно быть размещено в интернете, а...какое-либо стороннее изображение, к примеру, с жесткого диска вашего компьютера,...добавить не удастся. В этом случае на помощь приходит плагин.
Галерея изображений стандартными средствами WordPr... Всем привет! В сегодняшней статье я хочу затронуть вопрос создания простой...галереи изображений для WordPress стандартными средствами данной CMS.
Простой способ изменить фон для WordPress сайта!... Всем привет! Сегодняшняя статья будет наиболее интересна новичкам, которые...хотят изменить или установить фон для своего сайта/блога на WordPress, ведь в...ней я расскажу об одном быстром и простом способе сделать фон для своего...интернет-ресурса.
Всплывающие картинки в WordPress без плагина... Всем привет! Про то, как сделать всплывающие картинки в WordPress я уже писал в...одной из своих статей, но там речь шла о...применении специального плагина. Логично будет рассмотреть способ получения...аналогичного результата без установки дополнительных плагинов. Именно об этом мы...и поговорим в рамках сегодняшней статьи.

Комментарии 1

  • Мне вот интересно, если изменяется расширение пиктограммы — нужно ли как-то изменять код интеграции, для правильной интерпретации кода браузером?

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

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

Этот сайт использует Akismet для борьбы со спамом. Узнайте как обрабатываются ваши данные комментариев.