Самая маленькая картинка в вашем блоге!



Самая маленькая картинка в вашем блоге!

Доброго времени суток!

Сегодня я бы хотела начать с вопроса на внимательность - что изменилось в этом блоге? Ну, трудно, наверно сказать - вот новая статья, которую я только что написала (вру, наверно, я-то эту статью только пишу... правда, когда вы её увидите эти слова пожалуй станут правдой - Вот как оказывается все сложно в нашей жизни!) Ну, мы, пожалуй продолжим: Как мы только что выяснили спрашивать вас, что изменилось на блоге - довольно жестоко. Тогда я вам просто подскажу: посмотрите, пожалуйста, на верх странички... и даже еще выше - взгляните на адресную строчку, где вы видите URL этого блога: http://blogger4you.blogspot.com и слева от этого адреса вы обнаружите того же самого пляшущего мишку, которого вы видите в этой статье. Такая картинка в адресной строчке и в закладках вашего браузера называется Favicon (от английского FAVorites ICON — «значок для избранного»). Прочитать больше о Favicon мы можем в Википедии.

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

1) Рисуем или находим в интернете, картинку, которую мы хотим сделать символом нашего сайта (своего мишку мы честно где-то нашли - уже не помню где), картинка может быть с любым расширением: png, gif, jpg и т.д.

2) Сохраняем нашу картинку на Photobucket или еще где-нибудь (о Photobucket я подробно писала здесь).

3) Теперь мы делаем новый шаг в освоении Blogger'а. На "Панеле инструментов"(Dashboard) мы выбираем "Дизайн"(Layout) и в Дизайне кликаем на Изменить HTML, я на картинке обвела карандашом, где эти заветные слова искать:
И видим мы там опять какой-то зловещий текст:

<?xml version="1.0" encoding="UTF-8" ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns='http://www.w3.org/1999/xhtml' xmlns:b='http://www.google.com/2005/gml/b' xmlns:data='http://www.google.com/2005/gml/data' xmlns:expr='http://www.google.com/2005/gml/expr'>

<head>



Зловещий текст нас к счастью совсем не интересует, во всем этом зловещем тексте нам надо только найти строчку со словом </head> [Что значит конец описания заголовка нашей страницы], для чего мы используем сочетание клавиш CtrlF и сразу перед этой строчкой на надо вставить следующую строку:

<link href='адрес вашей картинки' rel='icon' type='image/тип вашей картинки'/>


Вместо слов адрес вашей картинки вставьте настоящий адрес вашей картинки, скопируйте его из "direct link", если вы положили фотографию на Photobucket он будет что-нибудь типа http://i201.photobucket.com/albums/aa/myfavicon.jpg

А вместо слов тип вашей картинки вставьте три последние буквы имен вашей картинки, которые находятся в имени после точки и называются расширением. Это может быть png gif jpg и может быть что-то еще...

В нашем случае эта строчка выглядела таким образом:

<link href='http://i201.photobucket.com/albums/aa306/kylekeeton/baer-0008.gif' rel='icon' type='image/gif'/>

После всех этих манипуляций нажимаем кнопочку ПРОСМОТР и если нам все нравится нажимаем кнопочку СОХРАНИТЬ ШАБЛОН, а если нравится, но не очень можно что-нибудь поменять (картинку, например) или закончить работу совсем радикальным образом нажав кнопку УБРАТЬ ИЗМЕНЕНИЯ.

Надеюсь у всех все получится: будут вопросы - спрашивайте. А я пока буду думать может мне в качестве иконки вот эту мою кошечку поставить - она тоже выглядит симпатично! Что скажете?

Всем счастливо!
Света
PS К сожалению, Челита оказалась права: в отличии от всех других браузеров Internet Explorer не увидел нашу Favicon - читайте продолжение этой статьи Favicon для Internet Explorer! (Если на вашем Blogger блоге была Favicon, но куда-то пропала читайте статью: Blogger: Если вы "потеряли" Favicon! )

____________________________________________________________________________________________________









____________________________________________________________________________________________________
Похожие по тематике статьи :
*

0 коммент.:

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

Комментировать...