Crie um ícone para o seu site, ou seja, um favicon Por Érico Oliveira dia 19 de julho de 2007 às 8:41 am | Imprimir este post

Você já deve ter visto em muitos sites um pequeno ícone junto ao endereço eletrônico na barra de navegação do browser, pois esta imagem é chamada favicon, uma abreviação de favorite icon. Este ícone, além de exibir o seu logotipo, ajuda na localização do seu site em uma lista de favoritos e também facilita a navegação pela internet quando o usuário possui várias abas abertas no browser.

Favicon

A criação de um favicon é bastante simples. Em primeiro lugar você deverá possuir uma imagem quadrada com o logotipo do seu site. Em seguida utilize algum utilitário para converter a imagem em ícone, você pode usar o FavIcon from Pics, este site transforma qualquer imagem em favicon.ico. Feito isso, envie o arquivo para o seu servidor e adicione a seguinte linha de código no cabeçalho do seu site.

  1. <link rel="icon" href="/favicon.ico" type="image/x-icon"/>
Adicionar um comentário

14 comentários : “ Crie um ícone para o seu site, ou seja, um favicon ”

  1. 1
    Gravatar
    Marcus :

    Meu site tem favicon, com essa linha de código, mas ele não aparece no IE, só no firefox e opera. procurei uma soluçaão mas até agora nada…alguma dica?

  2. 2
    Gravatar
    Érico Oliveira :

    Olá Marcus, o IE tem suporte ao favicon desde a versão 5.0, mas é difícil fazê-lo exibir. Tem algumas dicas que você pode seguir para conseguir.
    1. Adicione o site desejado aos seus favoritos. Se já estiver apague e adicione novamente.
    2. Apague todos os seus arquivos temporários.
    3. Tenha certeza que o arquivo seja favicon.ico e que esteja no diretório raiz do servidor.
    4. O caminho para o arquivo no seu código deve ser absoluto e não relativo.
    É por essas e outras que prefiro o Firefox!

  3. 3
    Gravatar
    Marcus :

    Pois é, eu tambem prefiro, foi só colocar o favicon no diretorio raiz, por a linha de comando e ja estava aparecendo…no IE, nada, mas vou tentar isso que vc falou. Valeu :)

  4. 4
    Gravatar
    joao :

    so nao precebo o codigo o k se mete no “icon” e no “favicon.ico”

  5. 5
    Gravatar
    Diego :

    dá para fazer isso em um blog Wordpress?

  6. 6
    Gravatar
    Diego :

    ISto é, gratuitamente? Sou leigo ainda. E, queria, se possivel, uma explicação mais detalhada.

  7. 7
    Gravatar
    Érico Oliveira :

    Diego, é possível utilizar o favicon em qualquer tipo de site, desde que você tenha hospedagem própria. Se você tiver um blog hospedado no WordPress.com isto não é possível.

  8. 8
    Gravatar
    André Henrique :

    Muito legal este artigo :)
    coloquei um favico no meu blog wordpress e para quem não sabe basta você editar o arquivo “HEADER.PHP” do tema que você está usando…
    mas minha dúvida caso eu mudar meu tema terei que adicionar o codigo de novo :|? no outro tema?
    Abs!

  9. 9
    Gravatar
    Érico Oliveira :

    André, se você mudar de tema, terá que adicionar novamente o código no cabeçalho do tema.

  10. 10
    Gravatar
    André Henrique :

    Hum legal cara ;)
    Mas não da mto trampo não \o/
    Me passsa teu msn ae ;)
    abs!

  11. 11
    Gravatar
    Sandro :

    Olá, possuo o mais recente IE mais ja fiz de tudo pra colocar o icon com minha logo, mandei pra minha pasta de imagens fiz upload tambem da pagina com o codigo entre e mas nada. não aparece nem por um decreto. Me ajudem por favor!!!!!!!!

  12. 12
    Gravatar
    Maicon Nunes :

    Olá pessoas, alguém sabe como colocar um favicon direto no servidor e não precisar chamalo na página?

  13. 13
    Gravatar
    Denny :

    Olá, sou o Denny, sempre acompanho suas dicas, um dia eu pretendo mudar para um domínio próprio, e, um colega meu, tinha um plugin para o Wordpress que fazia isso, o nome era apenas favicon, não acho em lugar nenhum :( queria saber se você conhece esse plugin, se sim, você poderia me pssar o link? se não muito obrigado pela atenção! :D

  14. 14
    Gravatar
    Armando Antonio :

    Esse site tem a solução: http://www.thebest.blog.br/2008/04/14/como-adicionar-um-favicon-no-wordpress/

Escreva um Comentário

XHTML: Você pode usar estas tags: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>