Para colocar uma imagem na barra de endereços ao lado do endereço do blog, precisamos transformar uma imagem normal num ícone, depois hospedar esse ícone e fazer o código para colocar no blog. Isso é um pouco trabalhoso, mas achamos um site que faz tudo isso de uma vez só. A unica coisa que precisar fazer é o upload da imagem e o site já dá o código pronto para colocar a imagem na barra de endereços no lugar do icone do blogger.
Faça uma imagem para usar como ícone, preferencialmente uma imagem quadrada, ou seja, com a mesma altura e largura, assim o risco de distorcer é menor, pois o ícone é uma imagem quadrada. Depois entre no site Free FavIcon, clique no botão arquivo para localizar a imagem e depois em upload it.
Agora copie o código que está na caixinha embaixo de Simply copy and paste the code below in the head of your web pages.
Entre na pagina editar html (não clique para expandir o modelo) e procure por:
]]></b:skin>
</head>
E coloque o código que copiou do site Free FavIcon entre essa linhas, ficará assim:
Para evitar erros em alguns navegadores salve a mesma imagem que usou no formato png, use um tamanho pequeno(36x36, que é algo próximo do tamanho do ícone) hospede no Imageshack, mas tenha a certeza que está usando a url correta da imagem, então adicione essa linha junto com o código gerado pelo site, colocando o link da imagem no lugar indicado:
<link href='url da imagem' rel='shortcut icon' type='image/png'/>
Salve as alterações e veja o resultado, se não aparecer o ícone na barra de endereços clique para atualizar a pagina. Já tínhamos publicado explicações sobre esse mesmo assunto, mas retornamos ao tema devido a problemas nos sites que sugerimos em outras postagens e, além disso, fazendo pelo site Free FavIcon é muito mais fácil, ele converte a imagem, hospeda e gera o código do ícone tudo num único clique.
Faça uma imagem para usar como ícone, preferencialmente uma imagem quadrada, ou seja, com a mesma altura e largura, assim o risco de distorcer é menor, pois o ícone é uma imagem quadrada. Depois entre no site Free FavIcon, clique no botão arquivo para localizar a imagem e depois em upload it.
Agora copie o código que está na caixinha embaixo de Simply copy and paste the code below in the head of your web pages.
Entre na pagina editar html (não clique para expandir o modelo) e procure por:
]]></b:skin>
</head>
E coloque o código que copiou do site Free FavIcon entre essa linhas, ficará assim:
Para evitar erros em alguns navegadores salve a mesma imagem que usou no formato png, use um tamanho pequeno(36x36, que é algo próximo do tamanho do ícone) hospede no Imageshack, mas tenha a certeza que está usando a url correta da imagem, então adicione essa linha junto com o código gerado pelo site, colocando o link da imagem no lugar indicado:
<link href='url da imagem' rel='shortcut icon' type='image/png'/>
Salve as alterações e veja o resultado, se não aparecer o ícone na barra de endereços clique para atualizar a pagina. Já tínhamos publicado explicações sobre esse mesmo assunto, mas retornamos ao tema devido a problemas nos sites que sugerimos em outras postagens e, além disso, fazendo pelo site Free FavIcon é muito mais fácil, ele converte a imagem, hospeda e gera o código do ícone tudo num único clique.
Comentários
Postar um comentário