Como alterar o favicon do Blog

Para colocar um Favicon no blog, ou seja, a imagem que fica na barra de endereços ao lado da url do seu blog, precisamos criar e hospedar uma imagem e depois colocar um código no html do blog. Mas vamos explicar por partes e você verá que é fácil de fazer. Veja também nosso video tutorial Colocar Favicon no Blogger - Imagem na Barra de Endereços.

Veja também a novidade do blogger(junho/2011) que agora permite enviar o favicon diretamente na pagina design: Como Colocar Favicon no Blogger

Primeiro crie ou encontre uma imagem que gostaria de usar na barra de endereços, ela deve ser quadrada, lembre-se que a imagem ficará bem reduzida (16 x 16 pixels), portanto não adianta usar uma cheia de detalhes pequenos. Aconselhamos já salvar a imagem neste tamanho 16x16px para depois enviar para os sites de hospedagem e conversão para o formato ícone.


Depois que tiver a imagem pronta entre no site Free Online Icon Editor (recentemente esse site apresentou problemas, então sugerimos que veja aqui outra opção para colocar favicon no seu blog:Converter imagem jpg ou gif em ícone (.ico)) nele é possível desenhar seu ícone se quiser (para aqueles que são bons em pixelart), mas se for fazer selecione o tamanho 16 x 16. Mas viemos aqui principalmente para mostrar como converter sua imagem de qualquer formato (gif, jpg, png) em um ícone, ou seja, formato .ico, clique em enviar arquivo, encontre sua imagem, deixe selecionado 16x16(favicon) e clique em upload.


Agora clique no botão save icon e escolha um lugar para salvar o ícone no seu computador. Essa parte já está pronta, agora vamos hospedar o favicon (colocar a imagem do ícone na internet).


Vamos até o site Image Boo Hosting clique no botão enviar arquivo e localize o ícone, envie também a imagem original (que usou para converter no outro site para o formato ícone), deixe selecionado Public em upload type e clique em start uploading. Agora copie o código da ultima linha (Direct) das duas imagens que enviamos.

Até o momento já temos nosso ícone criado e hospedado na internet, agora só falta colocar no blog. Entre na pagina layout > editar html e procure por </head>, antes dessa linha coloque o código abaixo substituindo os endereços das imagens que você acabou de hospedar.

<link href='imagem formato icone' rel='shortcut icon'/>
<link href='imagem original' rel='shortcut icon' type='image/png'/>

No final da segunda linha troque png pelo formato da imagem original gif, jpg, se achar mais fácil poderia fazer isso já com uma imagem png desde o inicio. Clique para salvar e já está tudo pronto o resultado final é esse:





Fizemos e testamos esse tutorial no Firefox e Internet Explorer que são os navegadores mais utilizados atualmente.

Outro site para hospedagem de icones é o Free Favicon Hosting, afinal é sempre bom ter mais opções.
Related Posts with Thumbnails

Link desta Pagina

Compartilhe essa Página

217 comentários:

  1. Olá!
    Estou sempre por aqui à espreita de dicas.
    Eu poderia colocar a imagem de um smile tricotando?
    Grata pelas boas dicas de sempre.
    Tenha um ótimo domingo.
    Carinhosamente,
    Dô.

    ResponderExcluir
  2. Muito bom o blog e as postagens!
    Essa aí então nem se fala.
    Muito bom, vou linkar o seu blog.

    ResponderExcluir
  3. pode tentar colocar um gif animado(smile) mas talvez não funcione em alguns navegadores, mas já vi isso em vários sites. o jeito de colocar é o mesmo

    ResponderExcluir
  4. Adorei muito seu blog, muito tri mesmo, continua assim, já to seguindo seu blog, se você ta afim de fazer pareceria entra no meu e me adiciona também, aqui ta meu blog, entra La, http://henrique199.blogspot.com/

    ResponderExcluir
  5. Um presente para o seu blog. O selo VIP. Pegue la no link http://ciencisagora.blogspot.com/2009/09/selo-esse-blog-e-vip.html

    Um abraço.

    ResponderExcluir
  6. Pô não deu certo, quando vc clica no SAVE ICON, não acontece nada...da uma ajuda ae...

    ResponderExcluir
  7. tente novamente, testei o site e está funcionando normalmente

    ResponderExcluir
  8. Oi, eu não fiz com uma imagem, fiz pelo PixelArt mesmo.

    na hora de colocar os códigos no blog, eu coloco o da imagem que eu hospedei no ImageBoo duas vezes?

    obrigado ;

    ResponderExcluir
  9. Sara Alves
    precisa colocar as duas linhas do código, mas somente uma é no formato ícone.

    envie pra mim o código que está usando no blog

    ResponderExcluir
  10. Ah, eu já consegui.

    obrigado mesmo :D

    beijos & muito sucesso (;

    ResponderExcluir
  11. Pô consegui, mas o site nao esta funcionando normalmente não...quando clicamos no SAVE ICON, ele não te da a opção para que vc escolha a pasta que vc quer salvar, eu cliquei em cima da imagem 16x16 e e fui no ''SALVAR COMO'' depois o resto realmente esta tudo certo.
    Quero parabenizar, pois depois de entrar em muitos blogs e tentar o seu foi o único que consegui...Inclusive na hora de hospedar. Depois que hospedamos aparecem vários links e muita das vezes não sabemos qual copiar e vc deixou bem claro que era para copiar o DIRECT...Os outros blogs não informaram isso...valew mesmo

    ResponderExcluir
  12. Valeu mesmo pelas dicas. Eu contruí o blog com as notícias daqui. Estou começando neste segmento há pouco tempo, e estas informações foram bastante relevantes.

    ResponderExcluir
  13. De primeira eu não consegui.
    Depois de três tentativas eu percebi que estava fazendo idiotice! OBrigada! Vocês me ajudaram muito!

    ResponderExcluir
  14. Primeiramente, muito bom o blog!
    Agora não consegui adicionar meu icone. Ao invez disso aparece o endereço da imagem hospedada no cabeçalho da minha página. Você sabe o que fiz de errado?

    Obrigada

    ResponderExcluir
  15. Bruna Hirsch
    provavelmente está colocando o código em lugar errado ou faltando algum símbolo.

    ResponderExcluir
  16. eu fis tudo isso e nao deu certo apareceu:Não foi possível salvar o modelo
    Corrija o erro abaixo e envie o seu modelo novamente.
    Não foi possível analisar o seu modelo, pois sua formatação é inadequada. Certifique-se de que todos os elementos XML estão fechados adequadamente.
    Mensagem de erro em XML: Open quote is expected for attribute "{1}" associated with an element type "href".

    ResponderExcluir
  17. Matthew
    provavelmente faltou algum caracter no código, barra no final ou usou aspas

    ResponderExcluir
  18. Esse blog é super, híper demais, "Parabéns" sou inicinate,ficamos sem saber o que fazer e sempre precisamos de uma grande ajuda. Obrigada pelas dicas.

    ResponderExcluir
  19. Vou fazer!!Apesar de não ligar muito para isso acho uma maneira de deixar seu blog mais "atraente"

    ResponderExcluir
  20. Gostaria de saber se esta dica serve para o blogger tambem,abraço a todos!

    ResponderExcluir
  21. esse código serve para qualquer blog ou site.

    ResponderExcluir
  22. Oi Fabiano! Parabéns pelo blog.

    Eu estou tentando mas não está dando certo , a mensagem de erro é:
    "Não foi possível analisar o seu modelo, pois sua formatação é inadequada. Certifique-se de que todos os elementos XML estão fechados adequadamente.
    Mensagem de erro em XML: Open quote is expected for attribute "{1}" associated with an element type "href"."

    Estou começando a achar que o problema é o meu template.

    sabe como ajudar?
    Parabéns pelo blog mais uma vez ;D

    ResponderExcluir
  23. ah, já vi no que eu estva errando. muito obrigada ;D

    ResponderExcluir
  24. Olá amigos,

    Fiz o procedimento e ocorreu quase tudo bem, ao criar a imagem e o icone, o link das fotos aparecem acima do navbar do blog, como faço para retirar esse endereço das fotos? O icone esta funcionando corretamente.
    Obrigado.

    ResponderExcluir
  25. Angélica Santana
    no final do código tem uma barra, se não colocar dá erro. veja também se não está usando aspas no lugar errado

    ResponderExcluir
  26. Lucia Helena
    retire o código e coloque novamente, provavelmente tem algo errado, não é para aparecer o link

    ResponderExcluir
  27. Obrigado pelas dicas, está me ajudando muito.

    No navegador Safari também funcionou.^^

    ResponderExcluir
  28. maravilha hein....show de bola seu post! me ajudou muito ja fiz um coloquei no link do meu blog.

    valeu ^^

    ResponderExcluir
  29. Deu certinho de primeira, apenas tive que usar outro site para criar o ícone pois o Free Online Icon Editor não está funcionando não..rss...mas deu tudo certo, valeu a dica.

    Pra quem ainda não conseguiu e quer ver o resultado o endereço é esse:

    http://www.grandestextos.blogspot.com

    ResponderExcluir
  30. pow adorei essa postagem consigui mudar o simbolo do meu e deu tudo certo.
    olha ai como ficou:
    http://loucopormusicas.blogspot.com
    vlw
    abraços e muito obrigado

    ResponderExcluir
  31. Olá tudo bem?
    amei seu post, eu venho tentando a um tempo trocar meu favicon, mas não consigo de geito algum, e eu tenho certeza que fiz tudo certo, mas na hra de visualizer aparece erro e fecha meu blog e o favicon tbm nem aparece, eu não sei mais o que eu faço!
    e eu queria muito trocar, e em outros blogs tbm tenho notado que nao aparece o favicon. será que é meu navegador? é o IE8.0 o mais recente da microsoft.
    thais_medeiros_mxp3@hotmail.com Muito obrigada se me ajudar ..

    ResponderExcluir
  32. o internet explorer as vezes não aparece na primeira vez que o site é carregado(aconteceu com o meu), mas quando clica para ver outra pagina do blog aparece o ícone.

    se mesmo assim tiver problemas tente hospedar a imagem em outro lugar pois o problema só pode ser esse. os códigos estão corretos

    ResponderExcluir
  33. Opa, gostei disso, mais uma coisa para personalizar o meu blog!
    Valeu!

    ResponderExcluir
  34. Ôpa, tudo bem?
    gostei muito do seu blog, vc esta de parabéns!
    Esta me ajudando muito na criação do meu.

    Mais estou com uma dúvida.
    Eu fiz tudo como o esplicado, mais quando chega na parte do /head, ai pra frente a coisa nao anda.. rsrs
    nao entendi onde vc tiro os links abaixos!


    se puder me ajudar ficarei muito grato!

    Um Abraço!!

    ResponderExcluir
  35. Raul Calais

    é só colocar os códigos do favicon antes do codigo </head> no seu blog

    ResponderExcluir
  36. Onde eu encontro esses códigos?

    link href='imagem formato icone' rel='shortcut icon'/

    link href='imagem original' rel='shortcut icon' type='image/png'/

    ResponderExcluir
  37. Onde é q eu axo esse código Favicon?

    Um abraço!!

    ResponderExcluir
  38. Nossa tava na minha cara e eu nao via! kkkkk deu certo aki..

    um abraço meu caro!

    ResponderExcluir
  39. Sempre que eu enho botar no Image Boo, lá diz que o documento é bmp e aí não dá. É porque eu clico em salva e não acontece nada, aí eu tenho que salvar o último que eu fiz, então, fica em bmp

    ResponderExcluir
  40. no meu modelo fica neste trecho

    </b:if>
    </h3>
    </b:if>
    <div class='post-header-line-1'/>
    <div class='post-body entry-content'>
    <data:post.body/>

    ResponderExcluir
  41. PERFEITO!! carãa. eu tava tentando isso faz uns 5 meses. agora achei um tutorial decente :) !

    Obrigado!!
    o melhor blog para dicas!!

    ResponderExcluir
  42. Quando eu carrego em "Save Icon" nao aparece nada. Podia-me dar uma ajuda, é que eu já tentei duas semanas seguidas e nao da.
    uma ajuda??

    ResponderExcluir
  43. alguns sites podem apresentar problema, tente procurar outro site de hospedagem ou para converter imagens

    ResponderExcluir
  44. Se nao conseguir fazer o icon tambem pode ir a http://www.favicon.cc/

    ResponderExcluir
  45. Fabiano, eu naum carreguei imagem e sim fiz la...fiz td e tal, mas não mudou o favicon do blog.

    ResponderExcluir
  46. veja se salvou no formato correto e colocou os códigos certos.

    as vezes é precisa atualizar a pagina para funcionar

    ResponderExcluir
  47. OLa muito bom seu blog ja me ajudou bastante , mais nao entendi onde colok o link que gera da imagem

    ResponderExcluir
  48. o endereço da imagem você coloca no código que falamos nesta postagem e depois na pagina editar html

    ResponderExcluir
  49. Muito obrigado! Esse blog é ótimo!
    Consegui botar no meu, esse blog é MUITO bom!

    ResponderExcluir
  50. Amigo,

    Seu tutorial foi muito bom e o favicon ficou muito legal em meu blog...

    Gostaria de saber se o favicon novo aparece no Google Chrome pois aqui no meu pc não está aparecendo, ele continua como o icon do Blogger.

    O endereço é:
    www.pouzada.net

    ResponderExcluir
  51. Desculpe amigo pelo Comentário duplo, mas esqueci de lhe avisar que o seu favicon aparece perfeitamente aqui no meu Google Chrome.

    O do meu blog não!

    Obs: nos dois links que eram para serem substituídos eu coloque a imagem ico.

    ResponderExcluir
  52. Vitor
    as vezes é necessário atualizar a pagina para funcionar

    ResponderExcluir
  53. no meu blog não funcionou veja


    www.atualizadof5.blogspot.com

    ResponderExcluir
  54. marquynho, entrei no seu blog e está funcionando, acho que já resolveu o problema, as vezes é necessário atualizar a pagina

    ResponderExcluir
  55. Nossa muito obrigado mesmo tentei de várias maneiras procurei diversos tutoriais mais esse foi o único que consegui colocar o favicon.

    Valeu!

    ResponderExcluir
  56. Olha, eu testei e funcionou normalmente no Internet Explorer (Que você ja tinah testado) e no Opera (que Tambem Funcionou Normalmente) e achei muito maneiro, valeu.

    ResponderExcluir
  57. Boa noite,
    fiz o teste no Internet Explorer e ele não funcionou, porém funcionou no Google Chrome, o que pode ter acontecido?

    ResponderExcluir
  58. Sidnei

    clique para atualizar a pagina no internet explorer, seu computador pode estar acessando o blog pelo histórico de internet

    ResponderExcluir
  59. Fabiano

    eu atualizei a pagina do explorer, exclui cookies e fiz tudo que tinha que ser feito, porém nada foi alterado........

    ResponderExcluir
  60. qual o link do blog que colocou os códigos?

    ResponderExcluir
  61. Fabiano, o link é:

    http://motorheadbangersblogmusic.blogspot.com/

    ResponderExcluir
  62. Sidnei

    acho que pegou o código errado da imagem, as vezes que tentei abrir o link da imagem redirecionou para a pagina do imageboo

    http://www.imageboo.com/files/lsj3nupuew5zf06zruk5.jpg

    acredito que seja esse o problema

    ResponderExcluir
  63. Olá amigo, o tutorial é muito bom, conseguir por em um dos meus blogs, mais tem um que ja tentei por várias vezes mais não tenho sucesso. Não sei o que acontece faço exatamente o que fiz nos demais que estão funcionando. Se puder me ajudar, entre em contato. Abraços.

    ResponderExcluir
  64. Music Blog Download, olhe o código e veja se não em nada sobrando nele, tente hospedar novamente a imagem

    veja também se nessas tentativas não deixou duas vezes o mesmo codigo no blog

    ResponderExcluir
  65. Deu tudo certo, ótimo tutorial.
    Esse é um dos melhores blogs sobre blogs q conheço.

    ResponderExcluir
  66. muito bom exelente vou postar o link do seu site no meu blog. muito bom viu.

    ResponderExcluir
  67. Valew!!!!!!!!

    olha aí: http://www.rubronegroesporte.blogspot.com

    ResponderExcluir
  68. Ótimo tutorial, estava atras de algo assim ha muito tempo. Parabens pelo blog sempre com dicas para aperfeiçoar nossos blogs.

    ResponderExcluir
  69. Não consegui salvar a imagem naquele site de colocar a imagem no formato favicon, como salvo lá?

    ResponderExcluir
  70. Lizandra, tente salvar em outro site, tem varios é só pesquisar no google por hospedar .ico

    ResponderExcluir
  71. eu fiz tudo certo, colei no lugar certo, mas não muda exatamente nada, fica tudo igual, colei os codigos nos lugares certos, são dois codigos não? um em formato ico e o outro png? mas não esta dando certo

    ResponderExcluir
  72. Dançarina e Sedentária

    algumas vezes é preciso clicar para atualizar a pagina para aparecer o novo icone.

    não tem como explicar melhor, você tem que hospedar as imagem, colocar os endereços nos códigos e por o código no blog

    ResponderExcluir
  73. que barato acabei de criar um ícone para o blog e amei!
    parabéns vc ensina de uma forma fácil amei!!!

    ResponderExcluir
  74. Muito obrigada pelas dicas, ajudou muito! Usei o código para trocar o favicon do meu site e deu certo.

    Só uma outra dica... Na verdade não é necessário transformar a imagem em um ícone. Pode-se apenas fazer uma imagem no paint em qualquer tamanho, de preferência quadrado, fazer o upload para a internet e copiar o link na parte editar html. A imagem é convertida automaticamente para o tamanho correto.

    Abraço,

    Carol

    ResponderExcluir
  75. carol, concordo que a imagem será ajustada ao tamanho, mas pode distorcer, então por isso acho melhor já fazer num tamanho próximo ao que será utilizada nos sites.

    ResponderExcluir
  76. Ei cara eu consegui certim aqui, muito bom mesmo sua dica...

    eu só queria saber como que faz para aparecer uma mensagem ou uma coisa assim quando passamos o mouse no icone, pq quando coloco aparece só: "Esse site não fornece informações de identidade", daria para colocar o endereço do meu blogger ou mesmo fazer ele ficar clicável?

    ResponderExcluir
  77. Minus

    não tinha notado esse detalhe, mas todos os sites que visitei apareceu igual(usando o firefox), não consegui achar como mudar isso.

    ResponderExcluir
  78. Ótimo post! :D
    funcionou perfeitamente!
    no começo ia até comentar que não tava funcionando, mas depois percebi que eu estava colocando o código acima do "head" e não do "/head"
    podem Observar o resultado: http://idanou-se.blogspot.com

    ResponderExcluir
  79. muito bom teu post.
    de todos os sites que olhei, o teu foi único que consegui ! valêu (:

    ResponderExcluir
  80. Fabiano não consegui,ta dando erro.
    Qual parte do link que passou tem que substitur?meu email é vancrisk@yahoo.com.br obrigado

    ResponderExcluir
  81. coloque o link das imagens nos lugares em destaque no código imagem formato icone e imagem original

    ResponderExcluir
  82. vlw pelo turial aqui foi o unico site que ensina direito como trocar o favicon do blogger lvw msm

    ResponderExcluir
  83. Sem o seu Blog eu não sou nada,obrigado!Mais uma dica que deu certo,ficou lindinho,deu aquele toque especial!

    ResponderExcluir
  84. Mto obrigada! Até que enfim consegui!

    ResponderExcluir
  85. amigo e se eu quiser fazer uma la no site nao vo ter original depois como faço?

    ResponderExcluir
  86. se quiser voltar ao original é só apagar essas linhas de código que colocou no blog

    ResponderExcluir
  87. Oi, eu não estou conseguindo fazer isso, ja tenho a imagem normal e em formato icone, mas quando vou hospedar da erro e nao consigo...
    me ajuda por favor!!!

    P.S.: O blog etá maravilhoso!!!

    ResponderExcluir
  88. lucas, achar hospedagem para formato icone é um problema, vou pesquisar algum site que faça isso, mas tente no google vai encontrar

    ResponderExcluir
  89. amigo pesquisei e não achei, fica dificil... parece que só tem esse.. se achar algun avisa pra nois, grato..

    ResponderExcluir
  90. Poh e tentei umas três veses não consegui então eu resolvi perguntar fika antes ou depois do nome head e esse nome fica logo no início ne?
    s minha imagem eh essa a ico http://www.imageboo.com/files/0msd1uq6o1k17cjkiuvt.ico
    e a png
    http://www.imageboo.com/files/njf7jyy2s18zr3jszygv.png

    ResponderExcluir
  91. Uchiha Sasuke - Sama
    sim, fica logo no começo do código do blog

    ResponderExcluir
  92. Olá, Fabiano Roberto
    sua publicação foi bastante útil, porém, aparenta não estar funcionando aqui... uso o navegador Google Chrome.
    Feliz 1ºde Abril e Feliz Pascoa!
    Abraços.

    ResponderExcluir
  93. Oiii!!! Parabéns, adorei o conteúdo!
    Mas... fiz TUDO CERTINHO e não deu certo! Ficou aparecendo, no lugar do favicon, um quadrado preto! O que aconteceu?? Por favor, me ajude. bjs!

    http://milleph.blogspot.com

    ResponderExcluir
  94. Michelle e Phillipe
    olhei o código do seu blog e a imagem que hospedou parece mesmo ser um quadro preto, tente hospedar novamente, mas use uma imagem já no tamanho reduzido.

    ResponderExcluir
  95. Ola pessoal estou a construir um blog para os escoteiros e estava aqui a fazer um favicon eu fiz mesmo um mas nao tenho uma imagem original fiz nesse site o que faxo.

    ResponderExcluir
  96. tem que salvar e depois hospedar a imagem

    ResponderExcluir
  97. Oi eu hospedei a imagem no imageshack

    e quando fui meter no blog nao aprexe simbolo

    ResponderExcluir
  98. Olha eu posso te mandar o meu icon e tu mandas me ja os links plx?

    ResponderExcluir
  99. DjTareco® , precisa salvar e hospedar a imagem no formato .ico também

    ResponderExcluir
  100. Vou te dizer como fiz

    Fui aquele site de favicon e salvei> esta no ambiente de trabalho

    Mas faltame a imagem original eu meti o icon no imageshack ....

    Eu doute o meu icon e tu podes fazer me isto porfavor agradeco +_+

    ResponderExcluir
  101. Valeu Fabiano pelo post!
    Funcionou muito bem no Firefox e no Chrome. só no IE8 (sempre o IE né) foi que não funcionou, vá entender. Mas vou fazer uns testes mais tarde e se eu descobrir por que eu conto.
    Valeu mesmo pela dica um abraço.
    Ah e quem quiser conferir tá aqui ó:
    http://emaisoumenosisso.blogspot.com/
    Lembrando que no Internet Explore não roda por enquanto.
    Fui!

    ResponderExcluir
  102. clique para atualizar a pagina do internet explorer, vai funcionar se colocar os codigos e endereços das imagens corretos.

    ResponderExcluir
  103. Oi Fabiano,socorro já fiz refiz e naum consigo esse ´´e o erro...
    Não foi possível analisar o seu modelo, pois sua formatação é inadequada. Certifique-se de que todos os elementos XML estão fechados adequadamente.
    Mensagem de erro em XML: The processing instruction must begin with the name of the target.

    ResponderExcluir
  104. passei para dizer q consegui já estava me sentindo burra tive q alterar pelo IE salvar para depois ver no fire vai entender

    ResponderExcluir
  105. Da hora essa dica !
    olhem meu blog, deu certo mesmo, o icone ficou file: www.blogsportmade.blogspot.com

    ResponderExcluir
  106. Oi !
    eu não consigo !
    quando salvo a imagem no meu computador não aparece nada ! tipo eu abo a imagem e está em branco ):

    ResponderExcluir
  107. se não aparece deve ter copiado algum código errado, provavelmente na hora de alterar o endereço das imagens.

    clique para atualizar a pagina do seu blog o computador pode estar usando o histórico de internet

    ResponderExcluir
  108. olha adorei o blog ensina tudo direitinho + eu fiz tudo bem certinho mas nao consigui tava tudo certo nao sei oq aconteceualguem pode me ajudar

    ResponderExcluir
  109. Sensacional. Tô ficando fã desse blog.Valeu

    ResponderExcluir
  110. Ae consegui!
    Valeu mesmo era por isso que eu estava esperando.
    Dá uma olhada la no meu. www.surf-es.blogspot.com
    VALEU!

    ResponderExcluir
  111. Muitíssimo obrigado pela dica, ajudou a deixar meu blog mais personalizado. Valeu mesmo!

    ResponderExcluir
  112. Muito Bom Mesmo... Sipmpres e funciona

    ResponderExcluir
  113. Que código é esse que vocês estão falando?É o do nosso blog?

    ResponderExcluir
  114. Vitinho30, você precisa colocar esse codigo no seu blog com os endereços das imagens que hospedar para usar como favicon

    ResponderExcluir
  115. Não é que quando clico em salvar não acontece nada!
    Preciso de ajuda!

    ResponderExcluir
  116. se não acontece nada nem salva nem dá mensagem de erro? pode ser falha no site, exclua o histórico de internet e tente novamente.

    ResponderExcluir
  117. Não!
    Ainda não entendeu!
    Sabe aquele 2 quadradinhos brancos do lado esquerdo.
    Então, o que eu boto lá?

    ResponderExcluir
  118. Estou muito triste pois agora,não da mas para colocar,pois o blogger colocou Designer ao inves de Layout,ai não da mas para ter acesso a meu layout!!estou muito irritada com o blogger,pois eles colocam essa pagina de designer sem que a pessoa permita,vc tem como colocar um html que de para colocar nos elementos da pagina???

    ResponderExcluir
  119. mas na pagina designer tem a opção voltar ao blogger e lá tem a guia html.

    ResponderExcluir
  120. o imageboo não abre aqui! o que faço?

    ResponderExcluir
  121. veja esse site para crair o favicon:

    http://tools.dynamicdrive.com/favicon/

    ResponderExcluir
  122. Obrigado pelo tutorial Fabio.
    Mas fiz tudo direitinho e não funcionou,segui a risca o tutorial,e não funcionou,continuou a imagem do Blog,Desiste.Abraços

    ResponderExcluir
  123. Benny(ddamarestiano)
    as vezes é preciso clicar para atualizar a pagina para ver a alteração, geralmente o computador usa o histórico de internet por isso não vemos mudança na primeira vez que visualizamos a pagina.

    ResponderExcluir
  124. Bom fiz tudo direitinho até chegar no imageboo o site ñ deu certoporq?
    obrigado!!

    ResponderExcluir
  125. veja aqui outros sites de hospedagem

    Sites úteis para Blogueiros

    seu problema foi hospedar as imagens? certo?

    ResponderExcluir
  126. o site de hospedagem que vcs postaram não está funcionando.
    o site é o Image Boo Hosting

    ResponderExcluir
  127. as vezes o image boo hosting fica off, tente esse site
    http://www.hostanypic.com/

    ResponderExcluir
  128. Até agora só vi esse funcionando!

    Espero poder ajudar alguém!

    http://www.freeimagehosting.in/index.php


    Super, hiper, mega testado e aprovado! rs

    Beijos!

    ResponderExcluir
  129. Poxa perfeito isso! voce esta de parabens! deu certinho aqui no meu blog.
    porfavor não pare com esse blog pois ele ajudará milhares de pessoas

    Parabens mesmo

    ResponderExcluir
  130. muito obrigada pessoal deu super certo lá no blog adorei o resultado grande abraço ;D

    ResponderExcluir
  131. Ola Fabiano.

    Tento usar o Image Boo Hosting para hospedar o icon, mas diz que eu preciso ter a biblioteca GD carregada como uma extensão do PHP, instalada se não nem funcionará.

    Sabe o que é isso?

    abraços

    ResponderExcluir
  132. Outra coisa. Não entendo pq ocorre isso. No firefox o icone funciona normalmente, mas no explorer não.

    Já atualizei a pagina como vc sugeriu nos comentários mas nada. Abri seu blog no explorer para ver se o teu icone para saber se dá certo e aparece normalmente.

    Abraço

    ResponderExcluir
  133. se tevê problemas no imageboo, tente usar o http://www.iconj.com/favicon_hosting.php

    Rafael Lopes
    olhei seu codigo e essa imagem do icone não está abrindo, deve ser esse o problema a hospedagem da imagem

    http://bsaves.com/files/bloggertemplates/images/logos/favicon.ico

    ResponderExcluir
  134. Olá Fabiano,

    Esse link: http://bsaves.com/files/bloggertemplates/images/logos/favicon.ico

    É padrão do template que utilizo, não foi eu quem o pôs.

    Tentei substitui-lo por meu favicon mas também não deu certo, rss. Desisto!

    Desde já valeu pelas respostas.
    Abraço

    ResponderExcluir
  135. justamente esse é o problema, precisa hospedar uma imagem no formato .ico e colocar no lugar desta que falou.

    ResponderExcluir
  136. Fabiano, problema resolvido. Deu tudo certo.

    Valeu rapaz

    abraço

    ResponderExcluir
  137. Gostei muito deste blog!

    Aprendi quase tudo o que sei agora e o que fiz no meu blog com este blog.

    Abraços e muito obrigado.

    ResponderExcluir
  138. sussa, deu certo aki.
    com GIG

    confere ae > www.djacksonviana.blogspot.com/

    ResponderExcluir
  139. Eu consegui. Agora eu já entendi: é soh ter paciência.

    ResponderExcluir
  140. Bem legal sempre estou por aki vendo algumas coisas para mei blog consegui isso tb xD valew! este eh meu blog http://down-infinits.blogspot.com/

    ResponderExcluir
  141. Ótima dicaaaa...funcionou perfeitamente!!! E olha q eu estava quebrando a cabela à dias! Aff.
    Usei este site para hospedar minha imagem: http://wimg.co.uk/result/multi/8Ge.jpg-S

    Obrigadaaaa!!!

    ResponderExcluir
  142. Seu blog é lindíssimo (: Segui o tutorial e deu certinho, muito obrigada.
    Só que o ícone eu hospedei pelo "Free Favicon Hosting" e a imagem normal pelo Tinypic, pois os outros indicados não estavam funcionado (aquele que dá pra desenhar o ícone, quando era pra carregar, dava erro. O da imagem nem abriu)
    Parabéns pelo blog! Você faz centenas de outros blogs mais felizes :DDD

    ResponderExcluir
  143. muito boa essa postagem mas eu ja tenho um icone pro meu blog só não sabia como colocar a imagem é essa:http://illiweb.com/fa/favicon/smiley.ico

    mas muito boa a postagem

    ResponderExcluir
  144. Também tem o http://www.favicon.cc/, que para mim, é o melhor.

    ResponderExcluir
  145. Oi, eu conseguir hospedar a imagem no Free Online, mas lá não tem a opção para converter a imagem em icon. O site está mudado, não está do jeito que está na imagem que voce colocou na postagem. O que devo fazer ?
    Desde já agradeço !

    ResponderExcluir
  146. o site deve ter mudado de layout pq faz um tempo que publicamos esse tutorial sobre favicon, vamos olhar o novo site e atualizar a imagem

    ResponderExcluir
  147. Muito bom! Funciona também no Chrome! Atualiza o post com a imagem do Favicon no Chrome. Hoje é um navegador bastante usado.

    ResponderExcluir
  148. Poderia me ajudar? Não estou conseguinco colocar meu favicon, entendo mto pouco de html, segui todos os passos, mas na hora de visualizar, nao dá certo.
    Por favor? Me ajuda?
    Por favor? :-)

    ResponderExcluir
  149. Carina Mendes
    as vezes na primeira visualização não aparece pq o seu computador usa o historico para acessar o seu blog, mas visitei seu blog e não vi os códigos nele

    ResponderExcluir
  150. Carina Mendes
    as vezes na primeira visualização não aparece pq o seu computador usa o historico para acessar o seu blog, mas visitei seu blog e não vi os códigos nele

    ResponderExcluir
  151. eu tirei os códigos, mas antes disso, eu apaguei o meus histório, meus cookes e tentei abrir, mas mesmo assim não foi
    Será q é pq a imagem e o ico estão no google sites?
    Bom vou conferir e refazer tudo denovo com calma.
    Obrigada.

    ResponderExcluir
  152. Ai, acho q tô quase lá!
    Ainda não aparece o meu favicon q seria uma borboleta, mas o favicon do blogger não está mais lá..
    Posso considerar isso uma avanço??
    Oque ainda tenho q fazer?
    Ha propósito, amei seu blog, depois eu vou fazer uma lista de blogs no meu, e recomento o seu ta.
    Bjus! Obrigada.

    ResponderExcluir
  153. no firefox está aparecendo a borboleta, não sei pq não aparece no internet explorer, pode tentar hospedar a imagem em outro site, talvez o http://www.iconj.com/favicon_hosting.php

    ResponderExcluir
  154. Uebaaa! Yupi! Deu certo!!
    Valew!!
    Muito muito Obrigada!
    Não vou me esquecer do seu blog ta!
    Bjux, bom fim de semana!

    ResponderExcluir
  155. Não deu certo, na hora de salvar o modelo html da erro

    ResponderExcluir
  156. deve ter colocado o código no lugar errado da pagina... ou na hora de copiar e colar faltou algo... aspas... > ... <

    ResponderExcluir
  157. o image boo hosting,não funcionou esse link da uma ajuda ae.

    ResponderExcluir
  158. veja aqui outro site de hospedagem

    Colocar Favicon no Blogger - Imagem na Barra de Endereços

    parece que imageboo está mesmo com problemas

    ResponderExcluir
  159. tem como colocar o favicon outra vez tipo mudar denovo??
    por que eu tentei e noa foi, sera que vai danificar meu blog??

    ResponderExcluir
  160. se tentou uma vez e não deu certo, apague o código que colocou e tente novamente, veja se o endereço da imagem está certo

    ResponderExcluir
  161. Boa noite galera deu certo no meu Blog, visita ae po;
    http://www.cidadaosa.blogspot.com
    Demorei pra encontrar a tag [/head]..daí lemberi de um código pra encontrar mais rápido; => Ctrl+F o próprio Google procura e é só vc digitar o que procura e pronto!
    Show, vlw galera do Dicas para Blogs!

    ResponderExcluir
  162. Gente, um aviso, se forem usar o "JIcon" como site de hospedagem da imagem, não precisam usar o código mostrado no exemplo, digitem, ao invés do código no exemplo, o código que é mostrado no site de hospedagem [são dois códigos]

    ResponderExcluir
  163. Eu não consegui.Eu fiz tudo certinho..
    hospedei as duas imagens, a icon e a original nesse novo site http://www.iconj.com/generator.php
    n seu certo! Help-me ;/

    ResponderExcluir
  164. as vezes é necessário clicar para atualizar a pagina para o icone aparecer

    ResponderExcluir
  165. Eu fiz de tudo mas não consegui,só deu certo com o modelo clássico do blog,a dica é ótima e funciona,mas porque só dá certo no modelo antigo?tem alguma outra forma?

    ResponderExcluir
  166. Sileny
    acho que o procedimento é igual em qualquer template

    ResponderExcluir
  167. o meu blog é o novo,e não tem a tag /head
    O que devo fazer?

    ResponderExcluir
  168. TheMemeGenerator
    use o ctrl F no teclado para achar o /head, todo blog tem isso.

    ResponderExcluir
  169. NAO CONEGUI ACHAR O >/HEAD< NO TEXTO.
    QUANDO AXEI EU COLOQUEI O NEGOCIO LÁ E O LINK DA IMAGEM FOI PARA NO RODAPÉ DO MEU BLOG.
    POR FAVOR ME AJUDEM!

    ResponderExcluir
  170. Eu gostaria de saber como se coloca uma imagem como por exemplo, um balão de falas ao lado de onde estiver escrito "comentários" embaixo de cada postagem. Se vc puder fazer um post explicando como se faz isso eu agradeceria.

    ResponderExcluir
  171. pow fabiano, tipow, eu peguei meu icone no http://www.softicons.com, blz. ai eu fui no imagem boo hospedei peguei o codigo DIRECT, ai eu coloquei assim : ://www.imageboo.com/files/o78hf9uvg8bstr526ap4.ico no primeiro link


    http://www.softicons.com/download/animal-icons/animal-desktop-icons-by-aha-soft/png/24/bird.png segundo link

    veja que o segundo link está com o link da imagem direcionado ao site que eu peguei meu icone, Softicons, isso tem pro? pq tipow, eu copiei a imagem pro meu pc, converti pra .ico no paint e hospedei no boo e proto, porem não tenhu a imagem origial em jpc hospedada isso tem pro? ai meu fav n aparece =[. se vc puder ver o codigo do meu blog: http://www.englishofcourse.co.cc
    brigadão e abrass

    ResponderExcluir
  172. se não me engano sites com dominio no co.cc tem dificuldades para trocar o icone... pois o site usa o deles

    ResponderExcluir
  173. Muito Obrigado,testei varias outras formas mas apenas essa deu certo eu visito este Blog quase todos os dias para ler os tutuoriais,foi com este blog que ganhei conhecimento e uso hoje em dia em meus trabalhos de criação de templates

    ResponderExcluir
  174. fabiano parabens pelo blog, pow me desculpa mais oq vou falar agora tem nada aver com esse post. tipo, eu queria fazer um indice desse que tu tem nesse site:

    Acessorios
    Colaraboradores
    Configurações avançadas
    etc...

    pq quando eu fasso alguma postagem no blog, fika na pagina principal, ai ela fika mto grande. ai tipow, eu queria deixar um indicesinho do lado e somente uma msg de boas vindas no meio, tem como?. desculpe-me se este n é o post certo, mais n axei esse tuto aki em teu site, se existir algum tuto, assim e vc puder deixar o link ai mto obrigado!

    meu blog: http://www.englishofcourse.co.cc

    abrass

    ResponderExcluir
  175. alguns blogs acham algumas maneira de criar um tela de boas vindas, mas dependendo do tipo de código pode prejudicar a indexação pelo google...

    todas as postagens passam pela pagina incial e vão automaticamente para as paginas dos marcadores que é esse e menu que você citou

    ResponderExcluir
  176. Fabiano, tipow, meu blog é de inglês, ai não tem como eu criar uma pagina só pras postagens? e uma só pra exercicios, e deixar só sei lá, alguns posts no meio ?.

    desse jeito ke tu fez aki, o kra entra no teu site, ai tem alguns arquivos no meio e um indice do lado, ai tipow se eu keru no teu site:
    Erros do blog

    eu vou la e cliko, dai vou para pag só de erros para blog, entendes?

    era isso q eu keria fazer no meu, só q no meu seria uma pag de aulas e outra só de exercicio.

    tem como ? brigadão kra.

    ResponderExcluir
  177. não tem como criar paginas separadas deste modo que falou...

    você pode usar os marcadores para separar aulas, exercicios... mas todas as postagem aparecem na pagina inicial do blog só quando alguém clicar em um dos marcadores verá somente os exercicios ou aulas...

    ResponderExcluir
  178. aki é Lucas. hmm, blz então. só mais duas coisas. quando eu digito Dicas para blogs no google, teu link aparece bem organizadozim com algumas pags e tauz:
    Dicas para blos
    Tutorias e dicas sobre como criar......
    Ganhar tempo e conseguir mais Troca de links...
    Quais as palavras chaves mais... Dicas no seu sit

    já o meu, aparece todo lokão, teria como eu organiza desse jeito ai o meu? se tiver como me ensinar agradeço.

    a 2º coisa. meu e-mail: englishofschool@gmail.com
    meu msn: lucasaaaaaaa@hotmail.com

    o e-mail é pra n disviar mto os assuntos aki do topico, ai se tu kiser mandar pro e-mail...
    e o msn, eu keria saber se tu poderia me add pra trocarmos umas ideias.

    manim vlw ai, desculpa pelo trabalho. abrass

    ResponderExcluir
  179. essa organização é própria do google não fizemos nada para ficar daquele jeito...

    ResponderExcluir
  180. O meu só aparece no Firefox, porquê? A imagem está hospedada no Iconj. Espero ajuda, obrigado!

    ResponderExcluir
  181. Vc escreveu: coloque o código abaixo substituindo os endereços das imagens que você acabou de hospedar. Mas exatamente qual parte deverá ser substituída?? Se estivesse grifada acredito que ficaria ainda mais fácil... eu sou muito burra com esse negócio de HTML, nunca consigo fazer nada!

    ResponderExcluir
  182. tem que colocar antes da linha </head> no html do seu blog

    ResponderExcluir
  183. Olha, já tem muitos comentários de agradecimentos mas eu precisava registrar o meu porque tentei uns 5 ou 6 antes de finalmente conseguir um código que desse certo. A imagem que escolhi não ficou legal porque ficou meio achatada, mas agora pelo menos é só escolher outra imagem, por o esquema deu absolutamente certo! Obrigada ;)

    ResponderExcluir
  184. é um pouco dificil acertar a imagem do favicon porque ela é muito pequena... então na maioria das vezes distorce a imagem

    ResponderExcluir
  185. Meeeeu Deeeeeeeeeeeeeeeus !
    EU AMO ESSE BLOOOOOG

    ResponderExcluir
  186. Deu certo e é super fácil. No principio tive medo de não pegar no Chrome, mas deu tranquilo. Obrigado pela dica, Fabiano.
    _________

    Visitem: http://noisesongartsickness.blogspot.com/

    ResponderExcluir
  187. muito bom procurei em varios blogs so encontrei aqui http://blogdopaulinhogt.blogspot.com/

    ResponderExcluir
  188. Vocês do Dicas para blogs estão de parabéns,no inicio pensei que não fosse dar certo,mas realmente ficou muito bom,só não funcionou no internet explorer mas no google e firefox ficou perfeito.
    Muito Obrigado mesmo!!!!

    ResponderExcluir
  189. oi, cliquei no link acima " Free Online Icon Editor" e abriu essa página aqui: http://www.online-image-editor.nl/

    onde eu clico?

    ResponderExcluir
  190. Anônimo
    acredito que o site esteja com problemas pois já usei varias vezes esse endereço e funcionou corretamente a pagina deles era como nas imagens do tutorial

    ResponderExcluir
  191. Eu não consegui! Botei duas imagens: um ICO e um PNG os dois links funcionando, mas não aparece o favicon. Onde está o erro?


    <link href='http://www.imageboo.com/files/cwn85eegdb6ask8zd1d3.ico' rel='shortcut icon'/><link href='http://www.imageboo.com/files/kuvobni4cznrggv8fbml.png' rel='shortcut icon' type='image/png'/>

    ResponderExcluir
  192. o código parece certo, se colocou antes da tag < /head > deveria funcionar... aperte o botão F5 no teclado para atualizar a pagina, as vezes seu computador está usando o historico de internet

    ResponderExcluir