a política na vertente de cartaz de campanha

Buzz this

Como adicionar um icon ao URL do blog

Hoje, uma dica informática: como adicionar um ícone que apareça na barra de endereço do blog, como o F que agora tenho no Fliscorno.

1. criar o ícone
  • Como: Usar um editor de imagens para o fazer ou um conversor de imagens para ícones como o Imageicon.


  • Tamanhos possíveis: 16x16 ou 32x32 pixeis. 16x16 é um tamanho compatível com mais browsers.


  • Formatos: PNG, GIF ou ICO. Se se pretender alojar o ícone num servidor de imagens como o Flickr, usar os formatos PNG ou GIF.

2. colocar o ícone num servidor de imagens, como o flickr.com
Copiar o endereço da imagem. Usando o Flickr, isso está disponível onde diz "All Sizes" e será algo do género
http://farm4.static.flickr.com/3350/3278203077_0fb754b7ef_o.png

(a título de exemplo, ver a respectiva página: http://flickr.com/photos/raposa_velha/3278203077/sizes/o/)

3. editar a template do blog
Ir ao HTML. Procurar onde diz </head> e abrir uma linha antes. Adicionar uma das linhas que se seguem, conforme o formato de imagem que se tenha criado, substituindo URL_DO_FICHEIRO pelo endereço (URL) do ícone:
  • PNG:



  • GIF:



  • ICO:

No fim, o resultado será algo como este:
«link href="http://farm4.static.flickr.com/3350/3278203077_0fb754b7ef_o.png" rel="shortcut icon" type="image/png/"»
«/head»


nota: « e » correspondem resectivamente a <>.

4. salvar a template
et voilá :)

Compatibilidade: Funciona no Firefox 3.x e no Opera 9.x. No IE, experimentei a versão 6 e verifiquei que não funciona. Há relatos que funciona nas versões superiores à 7. Se alguém puder confirmar, agradeço.


6 comments :

  1. João disse...
     

    Excelente dica!
    Com o Firefox 3.0.6 resulta bem, mas com o IE7 (tenho-o aqui na prateleira) não funciona. Vantagens do software livre...
    :)

  2. Fliscorno disse...
     

    Obrigado João. Já suspeitava que assim seria. Li algures que optando pelo formato ICO se terá melhores hipóteses de sucesso.

    Já agora, o problema deve-se ao facto do ícone não estar no mesmo domínio do site. Isto é, o IE espera encontrar o ícone em fliscorno.blogspot.com, neste caso. Como o blogger não nos dá acesso à raiz do blog (I wonder why LOL), paciência.

  3. Alien David Sousa disse...
     

    Flis, eu tenho a versão 7 do IE e não funciona comigo. Não vejo o F :/

    kisses

  4. Fliscorno disse...
     

    Pois é Alien, o IE só aceita como formato para ícone o ICO:

    «To create the icon, use an icon editor, such as the one included in Microsoft Visual Studio, and save the icon in the .ico file format. Internet Explorer will ignore icons that are not in .ico format, and will instead display the default Internet Explorer shortcut icon.»

    http://msdn.microsoft.com/en-us/library/ms537656.aspx#Create_the_Correct_Size_Icon

    A solução é então criar um ícone em formato ICO (pode-se converter um jpg, gif ou png com o Imageicon) e arranjar alojamento para ele. O Flickr não aceita ficheiros em formato ICO...

  5. Fliscorno disse...
     

    Ou seja, olhando para o comentário #2, possivelmente o facto de o ícone não estar alojado na root do site não faz mal.

    O que de facto acabo de comprovar.

    Criei um ícone em formato ICO e coloquei o respectivo ícone na template do blog:

    «link href='http://kfactor.net/blogspot/f.ico' rel='shortcut icon' type='image/x-icon/'/»

    (o « e » são respectivamente < e >, já que o blogspot não os aceita em comentários)

    Agora, o ícone aparece no IE7, no FF, no Opera e no Chrome.

    A dificuldade está em arranjar um alojamento para ficheiros que se possam linkar numa página. O site que usei (kfactor.net) é privado, neste aspecto não tive esse problema... Daí a vantagem de ter o ícone em formato GIF ou PNG, pois assim daria para alojar nos sites de partilha de fotos.

    Se alguém souber dum alojamento free para ficheiros genéricos e que dê para linkar numa página web, agradeço. Note-se que não pode ser daqueles em que tem um delay de uns segundos (tipo rapidshare).

  6. João disse...
     

    Experimentei agora o "Picasa" (o "Flickr" do "Google") e também não aceita ficheiros .ico.

Enviar um comentário