Как сменить Favicon

понедельник, 21 декабря 2009 г.

Продолжаю серию статей как сделать блог с нуля. Мы уже научились создавать блог. Теперь давайте поменяем иконку на сайте (нашем блоге) которая располагается в поле ввода ссылок браузера. Для всех блогов на Blogger идет стандартная оранжевая иконка с белой буквой B внутри. Давайте будем оригинальными и заменим ее на свою. Напомню, что мы уже знаем как создать favicon.

Как поменять Favicon.

Заходим в наш блог, Настройки/Дизайн/Изменить HTML

Для перестраховки можете сохранить свои стандартные настройки с помощью нажатия на ссылку "Загрузить весь шаблон". Теперь мы можем смело поменять Favicon. В этом нам поможет сайт photobucket.com, для этого переходим на него и спустимся в самый низ главной страницы. Вот что мы там увидим:

Введем в окне поиска "Favicon" нажимаем на миниатюрную лупу и получаем варианты доступных иконок Favicon. Выберем понравившуюся (я для этого примера выбрал самую первую картинку - анимированный смайлик и скопировал ее код).

затем , и в указанном месте (как на картинке) нажимаем "more"

откроется дополнительное окно сайта в котором вам необходимо выбрать вкладку "Get link code"(как на картинке), и скопировать полностью содержимое строки под названием "Direct link for layout pages".

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

Т.е. в этом скрипте вы меняете только красные строки на адрес выбранной вами иконки. Весь скрипт с адресом вашей картинки нужно вставить в HTML код шаблона вашего блога. Для этого заходим в свой блог - Настройки/Дизайн/Изменить HTML

Вставить скрипт необходимо перед тегом:

</head>

как на картинке

Можете копировать приводимый мной скрипт, если вас устраивает выбранная мной иконка для сайта со смайликом, для изменения значка необходимо просто изменить адрес картинки (выше я говорил, что достаточно только поменять красные строки). На картинках все детально показано. После чего нажимаем сохранить, и ваш Favicon готов. Все тоже самое можно проделать с любыми другими картинками на сайте. Теперь вы знаете как поменять иконку сайта. Оригинальные коды для этого скрипта можно найти на WidgetsForFree .

P.S Еще несколько сайтов на которых можно найти бесплатные Favicon :

Image Shack , PhotoBucket , Flickr .

16 комментариев:

Anna комментирует... 11 марта 2010 г. в 00:46: Если мне удастся сменить сегодня (за ночь) иконку - значит ваша статья правильная. Долго искала, половины не понимаю, но надеюсь, что справлюсь.
Спасибо!
The Neighbour комментирует... 11 марта 2010 г. в 08:45: Можете так же почитать еще вот эту статью: http://lagunof.blogspot.com/2009/12/kak-sozdat-favicon.html

Иконка поменяется, я сам проверял и не раз!=) если что, пишите , поможем чем сможем
Go! комментирует... 28 мая 2010 г. в 19:02: Скажите, я сделал все, получилось. Но у меня иконка, а фон белый, некоторые иконки - черный как сделать по нормальному
The Neighbour комментирует... 29 мая 2010 г. в 12:58: вы можете скачать программу для создания своих иконок! статья сдесь:
http://lagunof.blogspot.com/2009/12/kak-sozdat-favicon.html
Татьяна комментирует... 10 ноября 2010 г. в 20:28: Спасибо! Несколько блогов просмотрела и ничего не получалось. Теперь всё ОК, фавикон поменяла. Только на Фотобакет они немного изменили дизайн, так что пришлось повозиться. Не мешало бы поменять скриншоты в Вашем посте, сейчас бы инструкция выглядела бы совсем по-другому.
Всё равно, спасибо
Admin комментирует... 23 января 2011 г. в 22:30: всё получилось спасибо за помощ
Алекс комментирует... 13 февраля 2011 г. в 22:17: спасибо ! всё получилось !
EleneStar комментирует... 12 марта 2011 г. в 07:49: Спасибо! Спасибо! Спасибо! Так много вариантов уже попробовала, ничего не получалось. Спасибо Вам за то что помогли. Теперь получилось поменять фавикон.Удачи ВАМ!
The Neighbour комментирует... 12 марта 2011 г. в 09:21: Спасибо Вам за приятные слова=)
Pijburger комментирует... 7 мая 2011 г. в 20:00: Спасибо огромное получилось сразу,действительно Как для дурака!!!
Нина комментирует... 19 мая 2011 г. в 11:12: Большое спасибо! получилось с первого раза!)
Ипполит Фетисов комментирует... 23 октября 2011 г. в 10:25: Сейчас стало проще менять favicon. Просто зайти Дизайн - элементы страницы. И на верху есть Изменить значок.
Unknown комментирует... 23 октября 2011 г. в 10:35: Согласен с вами, писалось 2 года назад, когда не было таких мощных инструментов в блоггере как было раньше.
Анонимный комментирует... 22 ноября 2011 г. в 18:03: А я, видимо, совсем лох..(( Не меняется у меня фавикон в новом интерфейсе(. Сделала по программе, которую вы порекомендовали в этом посте. Но я не рисовала ее, а загрузила фото со своего комп. и оно отобразилось в окошке с клеточками (как у вас в этом уроке). Я сохранила изображение. Выглядело оно правильно, загрузила в блог, но оно отображается только во вкладке "Дизайн", там, где значок. А в самой адресной строке значок не поменялся... Подскажите, пожалуйста, что я не так делаю )).
Unknown комментирует... 22 ноября 2011 г. в 19:13: Дело в том, что сейчас в обновленном блогере - фавикон меняется без вышеописанных мной ухищрений. Просто из админпанели.
Анонимный комментирует... 22 ноября 2011 г. в 19:55: Дык, я все так и сделала. А в итоге значок в адресной строке не поменялся... Может, дело в том, что у меня не просто картинка в качестве иконки, а фото, уменьшенное до 16 пикселей? Малюсенькое такое, на белом фоне фото фрукта. Не показывается...((