Tentando adicionar código ao cabeçalho ou rodapé do WordPress? Muitas ferramentas e scripts de acompanhamento exigem que você adicione trechos de código ao cabeçalho ou rodapé do site do WordPress. Mas, por padrão, o WordPress não facilita muito a edição desses arquivos.
Nesta entrada, mostraremos como adicionar código ao cabeçalho ou ao rodapé do WordPress usando um plugin do WordPress ou adicionando manualmente o código ao arquivo functions.php. Para a maioria dos usuários, o método do plugin é o método recomendado. Mas os usuários intermediários avançados do WordPress podem preferir usar o método de código manual.
Você pode clicar nos links abaixo para ir direto ao seu método preferido:
- Como adicionar código ao cabeçalho e rodapé do WordPress com um plugin
- Como adicionar o código manualmente ao cabeçalho e rodapé do WordPress
Como Adicionar Código ao Cabeçalho e Rodapé do WordPress com um Plugin
Para a maioria dos usuários, a maneira mais fácil de adicionar código ao cabeçalho e rodapé do WordPress é por meio de um plugin. Os benefícios de usar um plugin sobre o método manual na próxima seção são:
- Seus códigos snippets permanecerão intactos se você mudar de tema.
- O plugin torna fácil adicionar somente os códigos snippets ao cabeçalho ou rodapé da sua página inicial, o que pode ser útil em alguns casos de uso.
- O plugin é mais amigável para iniciantes, pois não exige a digitação do código.
Embora existam vários plugins que oferecem essa funcionalidade, recomendamos o plugin Head, Footer and Post Injections de Stefano Lissa, pois ele oferece mais controle do que muitas das alternativas. Atualmente, possui mais de 200.000 instalações ativas com uma classificação de 5 de 5 estrelas.
Passo 1: Instalar e Ativar Cabeçalho, Rodapés e Pós-injeções
Head, Footer and Post Injections estão disponíveis gratuitamente no WordPress.org, para que você possa instalar e ativar diretamente do seu painel do WordPress indo até Plugins → Adicionar Novo e procurando por ele:
Passo 2: Adicionar o Código Snippet para o Cabeçalho, Rodapés e Pós-injeções
Depois de ativar o plugin, você pode acessar sua interface acessando Configurações → Cabeçalho e Rodapé no painel do WordPress. Você verá várias abas na interface do plugin. Mas para este guia, você trabalhará principalmente na guia Cabeçalho e rodapé padrão:
Para adicionar o código ao cabeçalho do seu site, você precisa colá-lo em uma das caixas na área <HEAD> SECTION INJECTION:
- Todas as páginas – adiciona o código snippet ao cabeçalho de todas as páginas do seu site. Isto é o que você vai querer usar a maior parte do tempo.
- Somente a pagina inicial – adiciona apenas o código snippet ao cabeçalho da sua página inicial.
Por exemplo, para adicionar o código de acompanhamento do Google Analytics ao WordPress, basta colá-lo na caixa Todas as páginas e salvar suas alterações:
Para adicionar código ao rodapé do seu site, você pode rolar para baixo na opçãa ANTES DE </BODY> TAG DE ENCERRAMENTO (FOOTER). Mais uma vez, você tem duas opções, embora sejam diferentes da seção de cabeçalho:
- Desktop – Apesar do nome, isso adiciona o código ao rodapé da versão para desktop e para celular do seu site, a menos que você marque especificamente a caixa para Celular.
- Celular – quando marcado, isso permite adicionar um código snippet diferente à versão para celular do seu site.
Se você quiser apenas adicionar um código snippet à seção de rodapé para todos os usuários, independentemente de seus dispositivos, cole-o na caixa Desktop e deixe o Celular desmarcado:
Se necessário, você pode adicionar vários trechos de código a cada caixa.
BONUS – Adicionar Código ao Cabeçalho e Rodapé das Páginas do Google AMP
Outra coisa interessante sobre esse plugin é que, se você estiver usando o Google AMP para WordPress, o plugin permitirá adicionar especificamente snippets de código ao cabeçalho e rodapé das versões das suas páginas do Google AMP (contanto que você esteja usando o Plugin oficial AMP da Automattic).
Para fazer isso, acesse o guia “AMP” no cabeçalho e no rodapé e cole seu snippet de código na caixa apropriada:
Se você está simplesmente precisando adicionar diferentes funções PHP em todo o site, também recomendamos verificar o plugin gratuito Code Snippets . Isso elimina a necessidade de adicionar snippets personalizados ao arquivo functions.php do seu tema. Atualmente, possui mais de 100.000 instalações ativas com uma classificação de 5 de 5 estrelas.
Como Adicionar o Código Manualmente ao Cabeçalho e Rodapé do WordPress
Se você não estiver familiarizado com os princípios básicos do PHP, recomendamos que siga o método de plugin acima. O método manual pode ser muito complicado para você
Nesta seção, você aprenderá a adicionar manualmente trechos de código ao cabeçalho e rodapé do seu tema por meio do arquivo functions.php.
Se você quiser prosseguir com este método sobre o plugin na seção anterior, é essencial que você use um tema filho do WordPress para fazer suas edições. Se você não usar um tema filho, qualquer código que você adicionar ao seu cabeçalho ou rodapé será substituído se você atualizar seu tema do WordPress.
Muitos desenvolvedores fornecem um tema filho. Mas se o seu desenvolvedor não, aqui está um guia sobre como criar um tema filho do WordPress. Depois de ter o tema filho pronto, você pode prosseguir com as etapas a seguir para adicionar código ao cabeçalho ou rodapé do seu tema.
Embora você possa adicionar trechos de código diretamente aos seus arquivos header.php e footer.php, a melhor maneira é usar o arquivo functions.php e o gancho apropriado do WordPress. Isso permite que você mantenha todos os seus snippets em um só lugar e evite modificar os arquivos principais do tema.
Passo 1: Prepare o Código Snippet
Para começar, forneceremos uma estrutura básica para adicionar código ao cabeçalho e ao rodapé.
Para adicionar o código ao seu cabeçalho, use este código snippet:
/* Describe what the code snippet does so you can remember later on */
add_action('wp_head', 'your_function_name');
function your_function_name(){
?>
PASTE HEADER CODE HERE
<?php
};Para adicionar código ao seu cabeçalho, use este código snippet:
/* Describe what the code snippet does so you can remember later on */
add_action('wp_head', 'your_function_name');
function your_function_name(){
?>
PASTE HEADER CODE HERE
<?php
};Para cada snippet, certifique-se de alterar:
- A descrição do comentário (útil quando você precisa lembrar o que um snippet de código faz um ano depois)
- O marcador de posição your_function_name (ambas as instâncias)
- O marcador COLE X CÓDIGO AQUI
Passo 2: Adicionar Trechos de Código ao Arquivo functions.php no Tema Filho
Depois que você tiver o (s) snippet (s) de código relevante (s) prontos (s), você precisará adicioná-los ao arquivo functions.php do seu tema filho. Você pode editar esse arquivo conectando-se ao seu site via FTP. Ou você pode ir para Aparência → Editor e selecionar o arquivo functions.php. Em seguida, cole seu código no final do arquivo:
Certifique-se de salvar suas alterações e pronto!
Bônus: Adicionar Código ao Cabeçalho ou Rodapé Somente para Páginas Específicas
Se você quiser mais controle sobre onde seus snippets de código de cabeçalho ou rodapé aparecem, você pode usar instruções if para adicionar o código somente a páginas específicas em seu site WordPress.
Por exemplo, para adicionar apenas o código snippet ao cabeçalho ou rodapé de sua página inicial, você poderia usar:
/* Describe what the code snippet does so you can remember later on */
add_action('wp_head', 'your_function_name');
function your_function_name(){
if(is_front_page()) { ?>
PASTE HEADER CODE HERE
<?php }
};Por exemplo, para adicionar apenas trechos de código ao cabeçalho ou rodapé de sua página inicial, você poderia usar:
/* Describe what the code snippet does so you can remember later on */
add_action('wp_head', 'your_function_name');
function your_function_name(){
if(is_single(73790)) { ?>
PASTE HEADER CODE HERE
<?php }
};
Certifique-se de substituir o número do exemplo – 73790 – pelo ID real da postagem ou da página à qual você deseja adicionar os snippets de código.
Quando Estiver em Dúvida, Use o Plugin
Isso resume o nosso guia sobre como adicionar código ao cabeçalho ou rodapé do seu site WordPress. Se os exemplos de códigos manuais forem confusos, recomendamos que você use o método de plugin. É muito mais amigável ao iniciante e na maior parte das vezes, oferece a mesma funcionalidade.
