Ваш промокод mojWPAds на плагин рекламы для WordPress >>

Как добавить фавикон для сайта

как добавить фавикон для сайтаВ данной статье мы поговорим о том, как добавить фавикон для сайта (иконка сайта в формате .ico).

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

Данная статья немного устарела. Читайте более свежую Фавикон сайта + для мобильников.

Вот пример фавикона разных сайтов, вкладки которых у меня открыты в браузере:

фавикон для сайта

Сделать фавикон для сайта вы можете сами: необходимо чтобы изображение было размером 16*16px, а так же имело расширение .ico. Добиться этого можно при помощи PhotoShop или любого другого графического редактора, который позволит сохранить файл в формате ico.

Кроме этого, для создания фавикона сайта Вы можете воспользоваться различными бесплатными сервисами, коих на данный момент представлено множество. Попробуйте в Google или Yandex поискать по фразе "сервис создания фавиконов".

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

Можете использовать и программы, которые помогут Вам нарисовать свой фавикон: Axialis IconWorkshop, AWicons Pro, Icon Master и т.д.

Когда фавикон для сайта готов, осталось сделать следующее:

  1. Закачать его на хостинг (обычно в корень сайта);
  2. Открыть файл шаблона header.php и вставить там ниже представленную строчку кода.

Если закачали в корень сайта, там где лежит файл wp-config.php и robots.txt, то прописываем так:

<link rel="shortcut icon" href="<?php bloginfo('home'); ?>/favicon.ico" />

Если же Вы закачали фавикон не в корень сайта, а в другую папку, то следует указать полный путь до него:

<link rel="shortcut icon" href="путь до фавикона/favicon.ico" />

После этого можете обновить страницу своего сайта в браузере и увидите фавикон на вкладке. Если сразу не появился, то нужно почистить кеш браузера (CTRL+F5 несколько раз).

В Яндекс favicon сайта появится спустя какое-то время, как пройдет очередной ап фавиконов (раз в месяц-два).

Если лень копаться с кодом, то можете использовать фавикон для сайта в виде аватара из Gravatar.com.

Не забывайте делать резервные копии файлов с которыми предстоит работать. Хранить данные сайта лучше на проверенных жестких дисках, как HDD IBM SCSI 2.5. Подумайте над этим.

Привет. Меня зовут Виталик.

Я автор этого блога, а так же Магазина WordPress https://wp-r.ru/ и ридера блогов вебмастеров и SEO-специалистов WMSN.ru


Отблагодарить Z888279575784 R109400923968 или ЯД 41001651742138

Я в Twitter @mojWP. Смотри на Youtube. Читай RSS блога.

Опубликовано 19 комментариев
  1. Адель says:
    http://trollface-club.ru/

    Спасибо вам)Благодаря вашей, понятной статьей я вроде смог установить иконку,вопрос, а как скоро я увижу ее?)Просто в других статьях говорилось то что иконка не сразу будет видна!

    • mojWP says:

      в браузере сразу увидите. достаточно кеш его почистить.

      а в поисковой выдаче яндекса появится напротив вашего сайта с ближайшим апом фавиконов. недавно был и вы под него не успели. теперь ждать пару месяцев (может и 3-4 месяца)

  2. Pavel says:
    http://healthbps.ru

    Скажите, а есть ли смысл делать не оригинальный фавикон? Просто у меня такая ситуация. Оригинальный дизайн я закажу примерно через полгода, когда доход с сайта позволит это сделать. Тогда же и фавикон мне оригинальный придумают. А сейчас может быть лучше поставить какой-нибудь стандартный? Как считаете?

    • Виталий says:

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

    • Алексей Владимирович says:
      http://print7153389.ru/

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

  3. Ольга says:
    http://puzyirik.ru

    Виталий, поправьте, пожалуйста, в конце поста: "2. Открыть файл header.hph..." на "2. Открыть файл header.php..."

    • Виталий says:

      спасибо за наблюдательность. подправил

      • Ольга says:
        http://puzyirik.ru

        Кстати по теме... Я уже достаточно давно поставила фавикон на сайт, правда адрес указала полностью: скобка link rel="shortcut icon" target="_blank" href="http://puzyirik.ru/favicon.ico" type="image/x-icon" слеш скобка, но Яндекс его отказывается видеть. Сколько времени обычно проходит чтобы фавикон появился в поисковике? И как это можно проверить, что Яндекс проиндексировал фавикон?

        • Виталий says:

          ап фавиконов у яндекса раз в несколько месяцев.
          в браузере видно сразу, если правильно все сделали. может понадобиться почистить кеш

          • Ольга says:
            http://puzyirik.ru

            В браузере-то он сразу появился... Ладно, будем ждать Яндекс в гости (хотя прошло почти уже 5 месяцев).
            P.S. Давно уже хотела написать, да все как то некогда было. Поздравляю с победой на конкурсе "Лучший блог 2012", который проходил на forum-profit.ru ! С Вашей подачи тоже участвовала там - заняла первое место! 🙂

  4. AlexV_Ver says:
    http://alexv-ver.livejournal.com

    Виталий. здравствуйте

    Несколько недель ищу информацию относительно установки фавикона на блог ЖЖ. Может, это невозможно? Если же есть путь - помогите его пройти, пожалуйста:

    какой код и в каком поле ставить.

    С благодарностью за всю ту полезность, которой Вы с нами делитесь,
    Александр

    • Виталий says:

      первая же ссылка в выдаче гугла дает ответ на вопрос _http://journals-covers.livejournal.com/12584.html

  5. AlexV_Ver says:
    http://alexv-ver.livejournal.com

    Виталий, я, конечно же, читал эту статью. Она о том, как создать фавикон. Но это действительно очень просто.
    А вот куда на ЖЖ вставить эту заветную строчечку, чтобы фавикон воспроизводился, например, в Хромной закладке - непонятно.
    (строки есть, но не указано, куда ставить, в каком поле, єти строки)

    • Виталий says:

      исходя из названия статьи и концовки ее, можно догадаться куда и что вставлять

  6. Светлана says:
    http:SvetoInvesticiya.ru

    Здравствуйте, Виталий.
    Я должна открыть файл header.php Перед закрывающим тегом вставить следующий код... Как он выглядит этот закрывающий тег?
    Спасибо.

    • Виталий says:
      http://mojWP.ru/

      Добрый день.
      В данном случае закрывающий тег для секции head выглядит

      </head>

      Соответственно, открывающий тег без черты наклонной /

      <head>
  7. Светлана says:
    http:SvetoInvesticiya.ru

    Здравствуйте, Виталий.
    У меня не появился фавикон в браузере. Я все сделала, как Вы рекомендуете. Почему не получилось?

    • Виталий says:
      http://mojWP.ru/

      Видимо так звезды сошлись, либо я не обладаю навыками экстрасенсорики, дабы отследить в пространстве и времени все ваши действия.
      Я склоняюсь к варианту со звездами)

  8. Светлана says:
    http:SvetoInvesticiya.ru

    Да, наверное. 🙂
    Спасибо.

Не держи в себе. Выскажись.

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

© 2011-2017 | mojwp.ru | Копирование материала разрешено только с письменного согласия
WordPress: 12.42MB | MySQL:130 | 0,316sec
Лучшие плагины для сайта WordPress
Магазин WordPress WP-R.ru
Я понял, не показывай больше.
Смотри мои обучающие видео на YouTube
Сайт использует cookie
Друг, не уходи!