Em alguns blogs e sites você vê uma imagem ao lado do endereço da página na barra do navegador. Essas pequenas imagens são chamadas FAVICON. FAVICON é a abreviação da palavra em inglês Favorite Icon. São imagens no formato ico, que você inclui através de um código em seu template. Funciona como um pequeno logo que identifica seu blog já na barra de endereços.Navegadores
Atualmente a maioria dos navegadores mostra o FAVICON, desde que a imgem seja no formato ICO. O Firefox também suporta outros formatos de imagem. Se o navegador não tiver suporte para o FAVICON, será mostrado o ícone do Blogger, por exemplo.
Imagem para o FAVICON
A imagem adequada para o FAVICON deve ter as dimensões 16px por 16px e ter a extensão ".ico". Você pode transformar sua imagem de outro formato e tamanho através de geradores de FAVICON.
Se utilizar outro formato, prefira imagens com fundo transparente. O tamanho precisa ser de 16px por 16px.
Hospedar a imagem
É difícil encontrar sites de hospedagem que aceitem o formato ICO. Existem duas alternativas para isso:
- Utilizar uma imagem em outro formato e mostrar seu FAVICON apenas no Firefox;
- Utilizar o Gerador de Favicon Icon J - Dynamic Favicon for Blogger and Webmaster. Nesse site você pode modificar sua imagem de outro tamanho e formato para o formato e tamanho adequado para um FAVICON, e ainda hospedar seu arquivo ICO. Eles já fornecem o código para você colocar em seu Blog. E você também tem a opção de escolher entre milhares de imagens prontas para FAVICON.
Colocar o código do FAVICON em seu template do Blogger
O site Icon J já fornece o código para colocar o FAVICON no Blogger. E funciona. Mas para maior segurança de que o ícone será visto em qualquer navegador, utilize o código a seguir.
Em "Editar HTML", salve uma cópia de seu template clicando em "Baixar Modelo Completo".
Depois procure pelo trecho
]]></b:skin>. Cole o código entre essa tag e a tag </head>, ficando da seguinte maneira:]]></b:skin> <!-- favicon --> <link href='http://endereço-da-imagem' rel='shortcut icon' type='image/x-icon'/> <link href='http://endereço-da-imagem' rel='icon' type='image/x-icon'/> <!-- fim favicon --> </head>
Se você não utilizar o site Icon J, hospede sua imagem e utilize o mesmo código, colocando o endereço da imagem hospedada no local indicado.
Comentários: 31
agora sim.. 10 post 10 Upee.....
De Olho No Big Brother Brasil 9 : Gostei do FAVICON.. hehe
(Mas nintendi nada de seu comentário.. :o )
Oi, Rô. Fiz um favicon bem simplezinho e postei no PicPanda.com.
Dê uma passadinha para ver se ficou legal.
Outra dica "matadora", obrigado.
Beijão.
Oi Renato! Que "simplezinho"? Ficou muito bom, e com a cara do blog. :) Agora, nada a ver com o post, mas sabe que eu entro no Efemérides pelos favoritos? E a página favoritada é o "Manual do Amigo que quero ser". Não canso de ler. Acho que já decorei!! ahahaha
Abração, amigo!
Fico feliz que tenha gostado (do texto e do FAVIcon). Uma amiga imprimiu o texto, passou caneta marca-texto e anda com ele a me azucrinar...
Abração.
Aleluia todo lugar que eu tentava num funcionava esse daqui foi de primeira valeww!!
Aê Rafael! Bonito FAVICON também! Bem-vindo e um abraço!
Renato: Eita! Fiquei curiosa pra saber quais trechos ela marcou.. hehe
Abração!
ccara a tempos q eu tento olocar o meu icone para aperecer no ie no opera e nao consegui ai foi quando eu achei seu site muito bom
Oi Lucas! Bem vindo! Depois deixa o link do Blog prá gente também apreciar seu FAVICON. :)
Abração!
só funciona no Firefox no IE não aparece o Favicon
Funciona sim, Admin. Atualize a página que ele aparece. ;)
Abraços!
Otimo
muito obrigado
Lameira Bittencourt: Bem-vindo e Disponha! :)
Abraços!
cara tinha procurado de +, vc é o cara... obrigado pela dica
Didi Gravações: De nada! Mas eu sou menina :) hehe
Abração!
Rô eu fiz e deu certo. Mas, o tal favicon resolve qdo quer aparecer. Tem dias que está lá lindinho no lugar do b laranja do blogger e tem dias que não. Por que será?
tcham tcham tcham rs
Oi Bia! Se você está usando Internet Explorer isso pode acontecer mesmo, mas é só atualizar a página que ele volta.
O IE é meio lerdinho pra entender certos comandos... hehe
Abração!
Cara até que enfim consegui graças a vc...mto obrigada!! amei seu site!! bjokss
Oi ☆ Kakau4ever ☆! Bem-vinda e Obrigada! Que bom que ajudei!
Bjs
Brigadinhu Rô *-*
www.downloadcp publicou um post sobre.. Muito Bom !!!
Brigadão, Vlw!!!
Muito obrigado pela dica! Gostei muito de saber sobre FAVICON.
Já tinha interesse de saber como se fazia e vocês disponibilizaram de maneira bem fáci e prática.
Valeu!!
Valeu pela dica!!
muito bem explicada!!
por causa disso
Vou colocar um link do blogosfera no meu blog!!
rsrs
eu só consegui que o favicon aparecece pelo código do Icon J - Dynamic Favicon for Blogger and Webmaster
Ah!Finalmente um código que funcionou!
Muito obrigada!
Olá cara, muito obrigado pelo poste, so tinha algumas diferenças em relação ao site J, mas está muito claro a compreenção. Belo blog! Tô montando o meu mas to com uma dificuldade com os HTML e temas, se poder me ajudar ficaria grato.
Pessoal: Obrigada pelos elogios! :d
Lucas: Dá uma circulada pelos posts aqui do blog. Pode ser que algumas de suas dúvidas já estejam respondidas.
Abração!
Obrigado Rô
mais uma dica que deu super certo.
Eu achei que fosse muito mais trabalhoso para colocar o favcon.
Abraço
Cleisson
olá Rô, foi mal pelo Cara da minha ultima postagem, mas é o costume de que os donos dos blogs desse ramo são na maioria homens. Em relação ao HTML já estou dominado razoavelmente. Alem do mais já posso dizer que estou começando a ficar satisfeito com o meu blog. Dá uma olhada aí:
www.lucasqueirozsubrinho.blogspot.com
Ah gostei bastante das modificações feitas aqui, pois ele era meio pesado.
Cleisson: É facinho! ;) E se você usa o DropBox, ele aceita hospedagem de extensões .ico, então nem precisa da hospedagem do Icon J.
Lucas: Sem problemas com o cara, já acostumei. Mas não perco a chance prá dar uma zoadinha, né? :p
Fui ver o Enfermagem... nossa, tá muito bonito! Pena que não entendo lhufas do que você escreve lá.. ahahahahaha
É, eu sei que o BloggerSPhera estava pesado. Alguns widgets que usavam imagens estavam sobrecarregando muito o blog. Por isso eu me dediquei principalmente a otimizar as imagens. O interessante é que consegui um blog bem mais leve e com mais efeitos! :D
Beijokas!
Genial
Mas no Internet Explorer não vai
http://jethotdownloads.blogspot.com
Postar um comentário
Para deixar o link da sua última postagem coloque este código:
Feed dos Comentários<em><strong>Seu nome</strong> publicou um post sobre.. <a href="seu-link-do-último-post">Título do Post</a></em>
Quando você estiver testando algum hack e tiver dúvidas sobre ele, informe:
1 - O endereço do blog onde você está testando (ou instalando o hack);
2 - O navegador que você está usando (Firefox, Opera, IExplorer, etc).
Leia sobre a política de Comentários!
Eu gosto de conhecer meus leitores! Se você usar OpenId ou perfil fechado, assine o comentário com seu nome e me deixará muito contente!
Bem-vindos e obrigada pela visita!
Blog This!