Como colocar um Favicon no Site ou Blog

renato_dleon · 24 de março de 2008

E ai Amigos eu queria colocar um favicon no Blog mais eu não consegui queria saber um codigo e uma forma que realmente funciona!!

Nota ja tenho o Favicon no formato 16x16 no formato "Gif" ou "ico":( por favor me deen uma dica ai !!

shaohot · 27 de março de 2008

Caso queira usar o ico:

ou o gif:

se não der certo tenta assim

Acredito eu que o nome tem que ser favicon mesmo nunca testei com nome diferente.

Outra coisa o Clube do Hardware tem favicon... você poderia dar uma olhada no código-fonte. Ajuda e muito no aprendizado.

Pra ver código fonte:

Se você usar IE -> Exibir - Código-Fonte

Se você usar FireFox -> Exibir - Código-Fonte ou ctrl+u

renato_dleon · 27 de março de 2008

Valeu pela atenção Shaohot

Pois é eu estou tentando colocar mais não estou conseguindo onde eu coloco esse codigo que você me informou pois não tem como eu saber se funciona pois não sei se onde estou colocando e o lugar certo .

E outra deve ficar assim ne?

por exemplo:

ICO:

GIF:

pois eu acho que e assim,caso não seja por favor coloque da maneira correta.

cassianoolavo · 27 de março de 2008

Coloque o texto abaixo dentro de <head> ...... </head> de suas páginas, você deve criar o favicon e deixa-lo na pasta raiz do site, ai é só inserir o código que o seu navegador já deve reconhecer, as vezes é preciso reiniciar o navegador ou limpar o cache para ele exibir o favicon correto.

código para inserir:

Abraços..........

Cassiano Olavo

http://www.abnexo.com.br/projetos.php

renato_dleon · 27 de março de 2008

Amigo peço um pouco de paciencia pois tenho um blog que criei por brincadeira mais agora to querendo levar a serio,eu sou leigo no assunto onde e a <head>... </head>???

Ja coloquei aqui no no html e ja coloquei no <head> que eu vi mais não apareceu.

ja limpei o cache também,mais nada!!

uso o IE 7.

e para colocar nesse blog:

www.todososgeneros.blogspot.com

shaohot · 27 de março de 2008

Valeu pela atenção Shaohot
ICO:

<link rel="http://www.convertico.com/images/1206153601.51/preview_16x16.ico" href="/favicon.ico" >

GIF:

<link rel="icon" href="http://img214.imageshack.us/img214/4156/animatedfavicon1ff7.gif" type="image/x-icon" />

Como cassiano falou.. coloque o favicon na pasta raiz do site, ou seja, na mesma pasta que o index. Salve como FAVICON.ICO mesmo.

Outra coisa voce confundiu um pouco vou te explicar como se faz o ICO

rel é esse ae por padrão

rel="shortcut icon"

Se você hostar a imagem em um site como esse converticon voce bota ele no href (nunca testei)

href="http://www.convertico.com/images/1206153601.51/preview_16x16.ico"

type bota esse ai também.

você confundiu um pouco voce colocou "image/x-icon" no GIF

se não der certo posta ae

renato_dleon · 28 de março de 2008

Shaohot e cassianoolavo!!

Obrigado por estarem me dando estas dicas pois e estou quase conseguindo aliais consegui mais eu queria saber por que que não está dando certo so nos IE pois testei com quase todos os navegadores de todos os sistemas operacionais e apareceu menos nas versões do IE se souberem me deen um toque pois ja está faltando pouco!!!

caso usem o IE se puderem olhem e me digam se aparece pois pode ser no meu pc

www.todososgeneros.blogspot.com

diegorj2 · 28 de março de 2008

Eu uso um programa chamado IcoFX 1.5, tem ele aqui no baixaki:

http://baixaki.ig.com.br/download/IcoFX.htm

renato_dleon · 28 de março de 2008

Beleza Diegorj2

mais eu creio que esse programa não coloca favicon no blog para todos que visitarem vejam!!!

mas obrigado pela intenção!!!

shaohot · 28 de março de 2008

Mais um que entrará no conceito IEca.

Isso ae é o maior, se não o unico, problema de quem mexe com WEB...

O IE interpreta de forma DIFERENTE o código.

Tente mudar a tag entre essas opções ai.

Agora que você falou que eu vi. O Clube do Hardware também não funciona no IE o favicon.

Caso não consiga posta aqui que eu vou dar uma pesquisada

renato_dleon · 28 de março de 2008

o Interessante e que aparece o do fórum e de muitos outros sites menos o meu!!

caso encontre me avisa beleza que eu vou olhando aqui também!!!

shaohot · 29 de março de 2008

www.google.com

O deles funciona o favicon no IE da uma olhada no source que eu to sem tempo.

BeatrizMetalCore · 6 de abril de 2008

1 - Vá neste site FavIcon from Pics e coloque a imagem que você quer como favicon, logo depois baixe ele.

2 - Agora vá até este site http://convertico.com/ e coloque o "favicon" que você acabou de baixar. Vai aparecer ..........Continue Lendo Aqui

INFORMASTER · 18 de janeiro de 2013

Pessoal que esta tendo problemas em inserir o icon:

1) fiquem atento as " (aspas-duplas) do código quando você copia daqui ele vai com outra codificação para o editor de texto ou IDE de desenvolvimento, re-escreva-os...

2) Dica: coloquem o favicon na raiz do seu site (aonde a sua index.html/index.php fica) e informe o caminho relativo (href="favicon.ico"), pois com isso, caso você venha a alterar o dominio do site futuramente você não terá problemas...

3) coloque somente esse código no cabeçalho (head) do site:

<link rel="shortcut icon" href="favicon.ico" type="image/x-icon" />

4) Essa tag NÃO PODE ser inserida em outro local a não ser o cabeçalho do site (<head>... </head>) pois os navegadores lêem esse cabeçalho como TODAS as informações do site, após o cabeçalho eles ingnoram qualquer tag que deveria esta lá...

5) Dica: caso você não encontre na web um icone agradável, monte seu próprio icone através do seu logo original, com o Fireworks (ou qualquer outro editor de imagens, para web eu uso ele...), abrar um arquivo novo especificando seu tamanho de 16px por 16px, posicione sua imagem e salve em .png, depois de salvo vá até o arquivo e altere a extensão de favicon.png para favicon.ico e pronto, seu icon foi criado, eu sempre monto para meus clientes com o proprio logo, com fundo alpha e as cores originais...

6) Para quem é leigo em HTML aqui vai o local de inserção da tag:

(estrutura básica do HTML, é só pra você ter uma noção...)


<html>
   <head>
        <title> Titulo... </title>

   [B][I][COLOR="Red"]------> AQUI VAI A TAG META RESPONSÁVEL PELO ICO <-----[/COLOR][/I][/B]

   </head>
<body>
 .... 
</body>
</html>

Com essas dicas, você dificilmente encontrar problemas ao colocar o icon no site... Ainda tem dúvidas??? god luck!