понедельник, 11 апреля 2011 г.

Устанавливаем свою favicon для blogspot

Несмотря на то, что сети много информации по настройке блогов на движке blogspot, я всё испытал некоторые проблемы с его настройкой. Посему решил, как и тысячи других пользователей, написать у себя в блоге как делать
Favicon - (сокр. от FAVorites ICON — «значок для избранного», от названия папки с закладками в MSIE) — значок веб-сайта или веб-страницы. Отображается браузером в адресной строке перед URL страницы, а также в качестве картинки рядом с закладкой, в вкладках и в других элементах интерфейса.

Как создать свою favicon? Самое простое набрать в google Как создать Favicon. Лично я пользовался сайтом favicon.cc.

Так, теперь надо где то сохранить этот файл. Самое простое - разместить на странице сайта Google:
  1. Идём в инструменты Google.
  2. Создаём новый сайт, на котором будем хранить картинки для своего блога. 
  3. Далее справа вверху нажимаем кнопку редактировать страницу
  4. В редакторе страницы в левом верхнем углу выбираем пункт меню "Вставить" и в открывшемся подменю выбираем пункт "Изображение". В открывшейся форме выбираем созданное ранее изображение. В результате картинка отображается на странице. В правом верхнем углу нажимаем кнопку "Сохранить".
  5. Теперь надо получить адрес картинки - щелкаем на неё правой кнопкой мыши и в меню выбираем пункт "Копировать URL картинки". В результате в буфере обмена оказывается путь до картинки. У меня это https://sites.google.com/site/sedegoff/_/rsrc/1296020637997/home/favicon.ico

Теперь надо изменить шаблон блога, что бы favicon отображалась. Для этого делаем следующее:
  1.  В панели управления идём в меню "Дизайн" и там выбираем пункт "Изменить HTML".
  2. Делаем резервную копию текущего шаблона. Для этого выбираем пункт "Загрузить весь шаблон". Называем файл удобным именем. Лично я в качестве имени файла выбираю такой шаблон [имя блога]-template-[ddMMyyyyHHmm].xml. Например sedegoff-template-110420110759.xml
  3. Теперь ищем в тексте шаблона конструкцию "</head>" и перед ней добавляем код.
    <link href='URL FAVICON' rel='icon' type='image/x-icon'/>
    <link href='URL FAVICON' rel='shortcut icon' type='image/x-icon'/>
    
    Не забудьте изменить строку "URL FAVICON" на Ваш.
  4. Жмём кнопку "Сохранить шаблон" и "Посмотреть блог"


    Собственно всё. 

    Комментариев нет: