Favicon в WordPress — установка фавикон на сайт

Просмотров: 750

Приветствую вас, дорогие друзья! Как установить фавикон на Вордпресс? Favicon для WordPress - установка Favicon на сайт WordPress без плагина, инструкция находится здесь, но так, как у многих возникают трудности с этим, сделать процесс более лёгким, вам, как обычно помогут специальные плагины.

Для справки: Фавиконка — это небольшая картинка, которая отображается в сниппете в результатах поиска Яндекса, рядом с адресом сайта в адресной строке браузера, около названия сайта в избранном или в закладках браузера.

favicon в wordpress
Иконки сайта представляют ваш сайт на вкладках браузера, в избранном меню и на главном экране мобильных устройств

Прежде чем перейти к обзору плагинов, нам нужно прежде всего подготовить иконку, то есть, создать Favicon для своего сайта. Сделать это можно с помощью популярного бесплатного сервиса favicon.ru.

Бесплатно создать фавикон favicon ru

Создать фавикон онлайн
Создать иконку-фавикон для сайта

Здесь, на сайте вы можете нарисовать свою собственную иконку или же, что самое лёгкое, это сделать Favicon из изображения. Загружаете картинку и на выходе получаете готовый файл с нужным расширением ico. Прежде чем скачать готовый Favicon посмотрите как она будет выглядеть в реальном разрешение. После того, как вы скачали готовый фавикон - иконку можно переходить к выбору подходящего для вас плагина.

Да и ещё, для тех кто не знает. Есть официальные иконки WordPress, как например у меня. Если вам необходим официальный логотип WordPress, чтобы показать, что ваш блог работает на самой популярной платформе, то можно на этой странице - https://wordpress.org/about/logos/ - скачать себе иконку нужного цвета (синею или чёрную) и размера, а потом установить её на свой сайт.

Официальный WordPress логотип
Официальная иконка WordPress для веб-сайта

Плагин PhpSword Favicon Manager

Фавикон для сайта
Иконка сайта favicon

Данный плагин позволяет установить на сайт или блог две иконки - фавикон и выбирать между ними, какую отображать иконку в браузере. А так же, можно включать или отключать фавикон на сайте. PhpSword Favicon Manager очень простой и легкий в использовании. Установить и активировать фавикон менеджер можно стандартным способом, через поиск по плагинам. Вводите его название, устанавливаете, активируете и в вашей админпанели появится новый раздел - PhpSword Favicon. Нажмёте его и перейдёте на страницу загрузки и установки фавиконки на ваш сайт. Обратите внимание: перед загрузкой Favicon на сайт: Стандартные размеры Favicon: 16x16, 32x32, 48x48, 96x96, 180x180 или 192x192; Формат иконки фавикон: .png, .gif или .ico Размер: максимальная 25 Kb или менее, чтобы минимизировать время загрузки сайта.

Как установить favicon на wordpress
Загрузка и установка на сайт WordPress иконки - фавикон

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

Favicon by RealFaviconGenerator - создать и установить свой Favicon

Favicon by RealFaviconGenerator - создать и установить свой значок сайта для всех платформ
Favicon by RealFaviconGenerator - создать и установить свой значок сайта

Плагин более функционален, чем предыдущий. С помощью этого модуля можно создать Favicon из любой картинки, а также генерировать иконку для мобильных браузеров iPhone / Ipad, устройств Android. После установки и активации плагина переходите сразу: Внешний вид - Favicon:

Загрузка и создание иконки фавикона
Загрузка картинки на сайт

Далее, выберете из своей библиотеки медиафайлов нужную картинку (загрузить квадратную картинку, по крайней мере, 70x70, рекомендуется: 260x260 или более), затем нажимаете на кнопку Generate Favicon и вас перебросит на онлайн сервис realfavicongenerator, где вы можете настроить, по своему желанию, все нужные иконки:

Сервис для создания Favicon
Генератор Favicon

Здесь, придётся воспользоваться переводом браузера, сервис на английском языке, но визуально и так всё понятно. После всех настроек нажимаете кнопочку "Generate your Favicons and HTML code" и вас перебросит назад в вашу админку сайта. Где можете посмотреть результат, то есть, ваш текущий Favicon:

Текущий Favicon на сайте
Текущий Favicon

А если кликнуть по кнопке Check your Favicon, то можно проверить их на сервисе, как иконки будут выглядеть на различных устройствах:

Поверка иконок на сервисе
Поверка иконок

Ну вот, дамы и господа, пожалуй и всё на сегодня. Надеюсь, было вам полезно. А я прощаюсь с вами, совсем не надолго. Удачи и до скорой встречи.


2 комментария к “Favicon в WordPress — установка фавикон на сайт”

  1. Здравствуйте! Подскажите как сделать чтобы в колонке правый садбар, надписи были белыми как у вашего сайта, на моём синие. Если можно пришлите скиншот, какие коды нужны и где стоят.Спасибо!

    Ответить
    • Открываете файл Таблица стилей (style.css) ищите код (Ctrl+F):
      #header h2 {
      color: #3A6B9C;
      и #3A6B9C меняете на белый. 🙂

      Ответить

Оставьте комментарий