Como adicionar um favicon para seu site WordPress

Publicado em

Vamos a uma dica muito legal para adicionar um favicon ao seu blog no WordPress, encontrada no Blog do The Best e ajustada e simplificada para tirar a dúvida de uma visitante de nosso blog que me mandou um email e motivou esta dica 🙂

O que é o tal do favicon?

Ele nada mais é que um ícone que fica ao lado do endereço do site/blog na barra do navegador.

Para que serve?

Ele serve para criar uma identidade do seu logotipo ao endereço do site/blog e para um melhor design (digamos assim).

Como criar um favicon.ico do meu logo?

Para isso basta você usar o serviço gratuito e online do site Dinamic Drive. Nele você envia uma imagem nos formatos gif, jpg, png e bmp, até 150 KB, que ele tranforma em um arquivo favicon.ico prontinho para ser usado.

Como colocar no Blog?

É bem simples !

Existe até um plugin do WordPress que o faz, mas julgo que seja totalmente desnecessário instalar um plugin que apenas adiciona 1 linha no cabeçalho de seu blog , então vou mostrar aqui a forma mais simples de fazer.

Entre as tags <head> e </head> de seu tema, normalmente encontradas no arquivo de cabeçalho (header.php) adicione a seguinte linha:

<link rel=”shortcut icon” href=”/favicon.ico”>

Lembrando que o href é o url de onde se encontra o favicon.ico. O indicado é que esteja na raiz do site.

Pronto, simples não ?

Especialista em WordPress & SEO

Desbravando o mundo WordPress desde 2007, me especializei também em SEO e entreguei grandes projetos no mercado brasileiro para a partir de 2015 me dedicar ao mercado fora do Brasil. Trabalhei na empresa do criador do WordPress por 4 anos (no WordPress.com, da Automattic) e mais 4 anos em uma das maiores empresas de hospedagens do mundo, a Liquid Web, gerenciando uma equipe de suporte do plugin The Events Calendar.

No Brasil, atendi grandes marcas como canal Futura, Corpo Perfeito, Catraca Livre, Hostgator Brasil e Hostnet, também palestrei em diversos eventos e dei aula em cursos livres e pós-graduação (no Rio de Janeiro e em Brasília).

Trabalho remoto, viajo bastante, mas minha base é no Rio de Janeiro/RJ.

Posts Similares

  • Como inserir uma chamada em meu Feed Rss?

    Se você desejar inserir uma chamada ou anúncio para aparecer apenas no RSS, no final de cada post, insira o código abaixo em seu arquivo functions.php:   function insertFootNote($content) { if(!is_feed() && !is_home()) { $content.= “<h4>Gostou deste artigo?</h4>”; $content.= “<p>Inscreva-se em nosso <a href=’#’>feed RSS</a></p>”; } return $content; } add_filter (‘the_content’, ‘insertFootNote’); Tal técnica é…

  • Gerencie os Downloads feitos em seu site WordPress

    Atendendo mais uma dúvida de visitantes do Tudo Para WordPress, faço esta rápida postagem à pedido do amigo @OckTock Duas alternativas para você gerenciar e monitorar quais downloads disponibilizados estão fazendo sucesso entre seus visitantes:

  • Como alterar link e tooltip da logo na página de login do WP

    Atualizado em

    Ao entrar na página de login de um site WordPress, a logo exibida é a do WordPress, e por muitas vezes, para personalizar a página de login para nossos clientes, trocamos esta logo pela logo do cliente, conforme explicado no post ‘Como alterar o logotipo da página de login do WordPress‘. Isso já dá o…

  • Como traduzir temas e plugins?

    Atualizado em

    Quem lida com o WordPress provavelmente já traduziu um tema, simplesmente buscando por strings nos arquivos e substituindo pelo equivalente em português. Isso é simples (até certo ponto) e eficaz, mas o WP oferece um sistema de tradução nativo, baseado no GNU Gettext. Verdade que muitos desenvolvedores não dão a menor bola para isso, mas…

  • Como restaurar as colunas no dashboard do WordPress?

    Com o lançamento do WordPress 3.8, tivemos uma sensível diferença no dashboard para quem utiliza monitores com grandes resoluções: o Dashboard agora é responsivo, tendo eliminado a opção de definir quantas colunas devem aparecer nesta tela inicial. Quem usa grandes resoluções pode ter achado estranho ver o painel com 4, 5 colunas e não ter…

Deixe um comentário

O seu endereço de e-mail não será publicado. Campos obrigatórios são marcados com *

35 Comentários

    1. Pasta Raiz é a pasta inicial de seu site.. como eu seu pc, onde a pasta raiz do HD é C: , e todas as pastas dentro dele são sub-pastas.. entendeu ?
      No caso em questão, pasta-raiz do site, esta é a pasta /public_html ou /www , variando de acordo com a hospedagem usada.

      Responder

  3. Ola!
    Estou iniciando minhas experiências com o wordpress e gostaria de saber se possível,como faço para ultilizar uma imagem que está no meu PC no fundo do meu blog?!

    Responder

    1. Olá Augusto,

      Tal alteração é permitida apenas usando o WordPress em seu servidor.. no WordPress.com tal alteração não é permitida, visto que necessitaria da edição do arquivo .css do tema usado, e no WordPress.com não é dada permissão para que os temas sejam alterados.

      Abraços

      Responder

    1. Oi Rapha,

      Isso é bem simples, basta colocar os arquivos na pasta wp-content/themes através de seu ftp. Mas, sempre lembrando que isso apenas é permitido se o WordPress estiver instalado em seu servidor, sites hospedados no wordpress.com apenas podem usar os temas disponibilizados por lá.

      Abraços e qualquer outra dúvidas é só falar 🙂

      Responder

  5. Ola Guga, eu segui o seu tutorial, porem por alguma razão desconhecida o favicon insiste em não aparecer.

    ja coloquei o favicon no diretorio ” / ” e no ” /www ” porem ele insiste em não aparecer.

    alguma ideia do que possa ser?

    abraços

    Responder

    1. Olá Caynan,

      O erro está no caminho do arquivo: a pasta ‘www’ em seu servidor corresponde ao endereço de seu site.

      Ao invés de escrever ‘/www’, digite o endereço de seu site ‘http : // www . seusite . com . br/favicon.ico’ (Sem os espaços)

      Responder

  6. Ola Guga,
    So tenho a agradecer o seu blog esta sendo uma maravilha para mim que estou sainda do blogger e engatinhando no WordPress.

    muito obrigado por tudo.

    espero poder um dia compartilhar experiência com você.

    parabens pelo blog.
    e obrigado pela ajuda.

    Responder

  7. Olá! comecei a usar o wordpress agora, aliás, estou aprendendo a usar. Muito obrigada pela dica. Mas, não consegui colocar do modo como você mostrou… Então, peguei o código que vc ofereceu e, no lugar de favicon.ico, coloquei um direct link. Só assim funcionou! rs
    Beijuh!

    Responder

  10. A melhor solução para quem está iniciando wordpress é:

    Coloque um icone com nome e formato: (favicon.ico) na raiz do template e depois insira o seguinte comando dentro do <HEAD>:
    <link rel="shortcut icon" href="<?php bloginfo('template_url'); ?>/favicon.ico" media="screen" />
    =D OK –'-{@

    Responder

  11. Oi segui seu passo a passo e deu tudo certinho porem o favicon só aparece quando entro como o link de painel de administradora. O que faço??
    Obrigada

    Responder

  19. Oi, queria ajuda para remover um favicon. Instalei o Joomla mas não gostei, então instalei o WordPress mas o favicon do Joomla permaneceu na minha home e não sei como tirá-lo. Já procurei em em todos os arquivos para exclui-lo mas não achei. Agradeço imensamente se puder me ajudar.

    Responder

  25. Vlw Guga!

    Já estava caçando um plugin kkkk…

    Alguns pontos para ajudar:
    1 – Trabalhe a transparência ao redor ícone para que quando o icone for renderizado no browser o acabamento fique mais legal. Depois de pronto salve o arquivo em .png e depois converta para .ico

    2 – Talvez quando colar o comando indicado pelo Guga, vocês terão que digitar as aspas duplas que tem nele de novo para que o WordPress possa reconhecer, digo pois isto aconteceu comigo.

    Abraço

    Responder