Quando comecei a personalizar meu próprio site WordPress, eu morria de medo de adicionar código personalizado. Um ponto e vírgula mal colocado no arquivo functions.php poderia travar todo o meu site. Só de pensar nisso me dava pânico.
Então, quando me deparei com tutoriais de WordPress, como muitos dos nossos aqui no WPBeginner, me dizendo para colar trechos no meu tema ou em um plugin específico do site, a ideia parecia ainda mais intimidante.
Aqui estão as boas notícias, no entanto. Existe um plugin gratuito que permite adicionar código personalizado com segurança, sem nenhum risco de quebrar seu site.
Neste artigo, mostrarei este método fácil para adicionar código personalizado no WordPress com segurança. Essa abordagem funciona perfeitamente tanto para iniciantes quanto para usuários experientes que desejam personalizar seus sites sem estresse.
O Problema com Trechos de Código Personalizado (E Como Corrigi-lo)
Como mencionei anteriormente, muitas vezes você encontrará trechos de código em tutoriais de WordPress com instruções para adicioná-los ao arquivo functions.php do seu tema ou a um plugin específico do site.
O maior problema é que mesmo um pequeno erro no trecho de código personalizado pode quebrar seu site WordPress e torná-lo inacessível.
Sem mencionar que, se você atualizar ou alterar seu tema do WordPress, todas as suas personalizações serão removidas.
O outro problema é que, se você adicionar vários trechos de código em um plugin específico do site, pode ser difícil gerenciar o arquivo.
Felizmente, existe uma maneira mais fácil para os usuários adicionarem e gerenciarem trechos de código personalizados no WordPress.
WPCode é o plugin de trechos de código mais popular, usado por mais de 2 milhões de sites WordPress. Ele facilita a adição de trechos de código no WordPress sem precisar editar o arquivo functions.php do seu tema.
O WPCode também simplifica a adição de códigos de rastreamento para Google Analytics, Pixel do Facebook, Google AdSense e mais nas áreas de cabeçalho e rodapé do seu site.
Você nunca terá que se preocupar em quebrar seu site, pois a validação inteligente de trechos de código ajuda a prevenir erros comuns de código.
Além disso, o WPCode vem com uma biblioteca de snippets integrada onde você pode encontrar todos os snippets de código WordPress mais populares, como permitir uploads de arquivos SVG, desativar a API REST, desativar comentários, desativar o Gutenberg, remover e muito mais.
Isso elimina a necessidade de instalar plugins separados para cada solicitação de recurso.
A melhor parte é que você pode gerenciar todos os seus snippets de código em uma tela central e adicionar tags para organizá-los.
Existe também uma versão gratuita do WPCode que possui todos os recursos básicos que você precisa para adicionar código personalizado no WordPress, incluindo suporte para 6 tipos de código, lógica condicional inteligente e muito mais.
Dito isso, vamos dar uma olhada em como adicionar facilmente snippets de código personalizados no WordPress com o WPCode.
- Adicionando Snippets de Código Personalizados no WordPress
- Lidando com Erros em Código Personalizado
- Gerenciando Seus Snippets de Código Personalizados
- Bonus: Generate Custom Code Snippets with AI
Adicionando Snippets de Código Personalizados no WordPress
A primeira coisa que você precisa fazer é instalar e ativar o plugin gratuito WPCode em seu site. Para mais detalhes, veja nosso guia passo a passo sobre como instalar um plugin do WordPress.
Observação: O plugin gratuito WPCode tem tudo o que você precisa para adicionar código personalizado no WordPress. Se você quiser recursos avançados como snippets agendados, revisões de código, rastreamento de conversão de eCommerce e mais, você pode fazer o upgrade para o WPCode Pro.
Após a ativação, o plugin adicionará um novo item de menu chamado ‘Code Snippets’ à sua barra de administração do WordPress. Clicar nele mostrará uma lista de todos os snippets de código personalizados que você salvou em seu site.
Como você acabou de instalar o plugin, sua lista estará vazia.
Clique no botão ‘Add New’ para adicionar seu primeiro snippet de código personalizado no WordPress.
Isso o levará à página ‘Add Snippet’. Aqui você pode escolher um snippet de código da biblioteca pré-fabricada ou adicionar seu código personalizado.
Para adicionar código personalizado, clique no botão ‘+Add Custom Snippet’ abaixo da opção ‘Add Your Custom Code (New Snippet)’.
Em seguida, escolha o tipo de código na lista de opções que aparecem na tela.
Para este tutorial, clicaremos na opção ‘PHP Snippet’.
Você será levado à página Create Custom Snippet.
Você pode começar inserindo um título para seu snippet de código personalizado. Pode ser qualquer coisa que ajude você a identificar o código.
Depois disso, você pode copiar e colar seu snippet de código na caixa ‘Code Preview’.
Na captura de tela acima, adicionei um trecho de código personalizado para remover o número da versão do WordPress do meu site de teste.
function wpb_remove_version() { return ''; } add_filter('the_generator', 'wpb_remove_version'); Abaixo da caixa de código, você verá as opções de inserção. Existem duas opções principais de inserção: Inserção Automática e Shortcode.
Se você escolheu o método 'Inserção Automática', o trecho será inserido e executado automaticamente em seu site.
Você pode executar automaticamente o trecho apenas na área administrativa do WordPress, no front-end do seu site ou em todos os lugares. Você pode até escolher inserir seu trecho em locais específicos da página, como antes ou depois de posts ou dentro do conteúdo do post.
Se você não tiver certeza, selecione a opção padrão 'Executar trecho em todos os lugares'.
Com o método 'Shortcode', o trecho não é inserido automaticamente. Depois de salvar o trecho, você receberá um shortcode específico para o trecho que você pode usar em qualquer lugar do seu site.
Ao rolar mais para baixo, você pode limitar onde deseja que o trecho seja carregado por tipo de dispositivo. Por padrão, os trechos são carregados em todos os tipos de dispositivo, mas você também pode configurá-los para carregar apenas em desktop ou apenas em dispositivos móveis.
Em seguida, você pode usar a poderosa seção 'Lógica Condicional Inteligente' para mostrar ou ocultar trechos inseridos automaticamente com base em um conjunto de regras.
Por exemplo, você pode mostrar trechos de código apenas para usuários logados, carregar trechos de código apenas em URLs de páginas específicas e muito mais.
Por fim, você verá uma área de ‘Informações básicas’. Você pode adicionar aqui qualquer coisa que ajude você a entender o que este código faz, onde você o encontrou e por que você o está adicionando ao seu site.
Você também pode atribuir tags ao seu trecho de código. Isso ajudará você a classificar seus trechos de código por tópico e funcionalidade.
O campo de prioridade permite que você controle a ordem em que os trechos são executados quando você deseja exibir vários trechos no mesmo local. Por padrão, todos os trechos recebem uma prioridade de 10. Se você quiser que um trecho seja exibido antes de outros, basta definir a prioridade do trecho para um número menor, como 5.
Quando terminar de escolher as opções, alterne o interruptor de ‘Inativo’ para ‘Ativo’ no canto superior direito e, em seguida, clique no botão ‘Salvar Trecho’.
Se você quiser salvar o trecho de código e não ativá-lo, basta clicar no botão ‘Salvar Trecho’.
Depois de salvar e ativar o trecho de código, ele será adicionado ao seu site automaticamente, se esse for o método de inserção que você escolheu, ou exibido como um shortcode.
Lidando com Erros em Código Personalizado
Frequentemente, se você cometer um erro ao adicionar código personalizado em seu plugin específico do site ou arquivo de tema, isso imediatamente tornará seu site inacessível.
Você começará a ver um erro de sintaxe ou um erro interno do servidor 500 em seu site. Para corrigir isso, você precisará desfazer manualmente seu código usando um cliente FTP.
A parte interessante do plugin WPCode é que ele detectará automaticamente um erro de sintaxe no código e o desativará imediatamente.
Ele também mostrará uma mensagem de erro útil, para que você possa depurar o erro.
A validação inteligente de trechos de código do WPCode também detectará quaisquer erros enquanto você adiciona seu código personalizado.
Passar o mouse sobre o erro exibirá instruções para ajudá-lo a corrigi-lo.
Gerenciando Seus Snippets de Código Personalizados
O plugin WPCode fornece uma interface de usuário fácil para gerenciar seus trechos de código personalizados no WordPress.
Você pode salvar trechos de código sem ativá-los em seu site e, em seguida, ativar ou desativar o trecho a qualquer momento. Também é possível filtrar trechos de código por tipo e local, e usar tags para organizar seus trechos de código facilmente.
Você também pode exportar trechos de código específicos ou exportar todos eles em massa.
Simplesmente vá para Trechos de Código » Ferramentas e clique na aba 'Exportar'.
Se você estiver movendo sites para um servidor diferente, você pode facilmente importar seus trechos de código para o novo site.
Basta visitar a página Snippets de Código » Ferramentas » Importar e fazer o upload do arquivo de exportação.
Bônus: Gere Snippets de Código Personalizados com IA
Mesmo que você não saiba programar, pode criar facilmente snippets personalizados para o seu site WordPress usando o Gerador de Snippets de IA do WPCode. Assim, em vez de se esforçar com PHP, HTML ou CSS, você pode descrever o que deseja para o seu site em linguagem simples.
Na página ‘Adicionar Snippet’, passe o mouse sobre a opção ‘Gerar snippet usando IA’. Em seguida, clique no botão ‘+ Gerar Snippet’.
Em seguida, uma caixa de texto aparecerá onde você pode descrever o que deseja que seu snippet faça. Tente ser específico sobre o que você quer, mas não o torne muito longo, você sempre pode usar o recurso Melhorar com IA para fazer alterações adicionais depois.
Após digitar sua solicitação, clique no botão ‘Gerar’.
A IA agora escreverá seu novo snippet de código, além de selecionar o local de inserção automática e definir a lógica condicional, se necessário.
Se você quiser ajustar seu novo snippet, pode clicar no botão ‘Melhorar com IA’, que permitirá descrever as alterações que você deseja fazer.
Você também pode usar o recurso Melhorar com IA para aprimorar qualquer um dos seus snippets de código existentes.
Tutorial em Vídeo
Se você não gosta de instruções escritas, pode acompanhar nosso tutorial em vídeo sobre como adicionar facilmente código personalizado no WordPress:
Espero que este artigo tenha ajudado você a aprender como adicionar código personalizado facilmente no WordPress. Quer experimentar alguns trechos de código em seu site? Confira nossa lista de truques extremamente úteis para o arquivo functions do WordPress e não se esqueça de ver nosso guia definitivo para acelerar seu site WordPress.
Se você gostou deste artigo, por favor, inscreva-se em nosso Canal do YouTube para tutoriais em vídeo do WordPress. Você também pode nos encontrar no Twitter e no Facebook.
Dennis Muthomi
Adorei este guia! O plugin WPCode é exatamente o que eu precisava para adicionar código personalizado com segurança ao WordPress. É super útil que ele detecte erros antes que eles possam quebrar alguma coisa.
Aqui está uma dica profissional que aprendi: Não modifique o functions.php do seu tema pai diretamente. Em vez disso, crie um tema filho e adicione seu código personalizado lá. Dessa forma, você não perderá suas alterações quando o tema for atualizado.
O recurso de validação de código já me salvou de erros tantas vezes. Fico muito feliz que este guia cubra todos esses pontos importantes!
Olaf
O WP Code é um plugin absolutamente perfeito que pode substituir vários outros sozinho. Como desenvolvedor, eu gosto de snippets. Gosto de criá-los e adicioná-los a sites. Essa abordagem me permite adaptar o WordPress a uma solução personalizada, adicionando recursos que, de outra forma, exigiriam um plugin. O modo de teste e a salvaguarda integrada são fantásticos, pois o próprio plugin verifica o código adicionado em busca de erros de sintaxe. E a extensa biblioteca de snippets, eu poderia continuar falando sobre quantas vezes ela me ajudou. Se houver um ranking dos dez melhores plugins, este definitivamente estará nele.
Moinuddin Waheed
Eu sempre tive ressalvas em instalar plugins para cada funcionalidade, mesmo as muito pequenas.
Inserir trechos de código através do wpcode revolucionou isso, pois não precisamos ter plugins separados para cada pequena funcionalidade que precisamos.
A melhor parte é que o wpcode vem com os trechos de código gerais mais usados, que só precisamos usar e ativar.
Jiří Vaněk
E a versão paga é ainda melhor. Eu a tenho há cerca de dois meses e a biblioteca de snippets na versão paga inclui centenas de snippets para praticamente tudo. Se alguém ama o WP Code na versão lite, a versão paga é um plugin absolutamente perfeito, incluindo a capacidade de testar o código antecipadamente. É simplesmente fantástico.
Moinuddin Waheed
Obrigado por compartilhar sua valiosa experiência sobre o wpcode.
Eu usei a versão lite até agora e não consigo apreciar o suficiente sua usabilidade.
Com certeza considerarei fazer o upgrade para a versão pro no futuro para ter uma experiência perfeita de sua base de código pré-feita.
Jiří Vaněk
Eu também uso o WP Code para inserir snippets no site, e concordo que é uma das ferramentas indispensáveis na criação de sites se alguém quer economizar na instalação de inúmeros plugins, tarefas que os snippets muitas vezes podem lidar bem. O que também é bom é que a inteligência artificial agora pode sugerir snippets personalizados para muitos propósitos.
WPBeginner Support
Glad to hear you found the plugin helpful
Admin
C
Ótimo tutorial. Como atribuir classes a elementos do Wordpress.
Obrigado.
WPBeginner Support
Recomendamos dar uma olhada no nosso guia abaixo para saber como adicionar suas próprias classes ao conteúdo do seu site:
https://www.wpbeginner.com/wp-themes/wordpress-body-class-101-tips-and-tricks-for-theme-designers/
Admin
DAMIEN GALVEZ
Obrigado!! Foi muito útil!!
WPBeginner Support
Que bom que foi útil!
Admin
ebere akadonye
Tentei usar o plugin, mas sempre que tento ativar meu código, ele retorna um erro na Linha 0, não sei o que fazer a seguir, pois não consigo encontrar nenhuma linha 0. exceto se for a linha com o <?php
Elena Ocone
Olá e muito obrigado por todo o seu trabalho e apoio à comunidade Wordpress.
Usei o plugin Code Snippets e ele estava perfeito até a última atualização, quando todo o código desapareceu e se tornou impossível salvar qualquer alteração: o resultado é uma página de erro 404.
WPBeginner Support
Você pode tentar as etapas de solução de problemas em nosso artigo aqui: https://www.wpbeginner.com/beginners-guide/beginners-guide-to-troubleshooting-wordpress-errors-step-by-step/
para ver se pode ser um conflito com outro plugin ou tema
Admin
Romadhon Hapsa
Obrigado por postar isso. Funciona
WPBeginner Support
Glad our article could help
Admin
Carol
Tenho uma página longa de Autores com links de afiliados e quero que os usuários possam encontrar esses livros para determinados tópicos.
Por exemplo, digamos que sejam livros que cobrem Jardinagem, Culinária e Costura. Quero que o usuário possa encontrar todos os livros sobre Costura sem ter que ver todos os outros títulos. Além disso, alguns títulos não informam imediatamente os assuntos, então navegar pela lista inteira pode não capturá-los todos.
Quero poder codificar os títulos individuais para que apareçam em uma ou mais das listas de assuntos predeterminadas e, em seguida, fornecer um link para o usuário clicar para obter uma lista dinâmica apenas dos títulos sobre esse assunto específico. Dinâmica, de modo que quaisquer novos títulos que eu adicionar e codificar apareçam para eles.
Eu NÃO sou programador, não quero ser, preciso de um plugin que faça isso. Parece que provavelmente não sou a primeira pessoa querendo fazer isso. Existe um plugin que faça isso?
ton
Olá
estou tentando adicionar um código de função apenas na página de checkout, então como uso o snippet para fazer isso?
Lauren
Posso aplicar snippets de código a todas as páginas EXCETO à minha página inicial?
THadryan
Tentei usar este plugin porque todo mundo parece adorar, mas ele travou todo o meu site antes mesmo que eu pudesse fazer qualquer coisa com ele.
Este artigo me convenceu a tentar novamente, porque todo mundo parece gostar, mas MESMO APENAS ATIVANDO-o, ele destrói todo o meu site e recebo o erro 500 que você menciona.
Você tem alguma ideia do que pode estar acontecendo?
Eu assumiria que é meu erro, mas tudo o que estou fazendo é instalá-lo e ativá-lo.
WPBeginner Support
Olá,
Isso pode ser devido a um conflito com outro plugin, tema ou código personalizado em seu site. Por favor, consulte nosso guia sobre solucionar erros do WordPress para descobrir o que está causando esse problema.
Admin
PseudoGeek
O código inserido neste plugin persistiria através das atualizações de tema? É isso que eu gostaria que este plugin fizesse: Para ter o ano atualizado automaticamente no copyright, muitos desenvolvedores colocam um trecho de código php em um tema filho para realizar isso. Eu realmente não quero criar um tema filho para cada site apenas para essa pequena mudança, mas a alternativa é ter minhas alterações desaparecerem a cada atualização de tema. Mas adicionar um tema filho para algo tão pequeno parece construir uma cerca inteira quando tudo o que você quer fazer é mudar a cor da trava do portão. Talvez este plugin seja a maneira fácil de fazer isso?
WPBeginner Support
As atualizações de tema não afetarão seu código.
Admin
Al Klein
Sou um antigo desenvolvedor PHP, mas isso facilita muito o gerenciamento de trechos de código. (E, como sou humano, cometi um erro ao adicionar um trecho de código – e ele foi simplesmente desativado. Fazer isso manualmente teria significado garantir que o editor ainda estivesse aberto quando eu tentasse o site, para que eu pudesse voltar e tentar encontrar o que teria sido um erro 500.
Obrigado por esta postagem.
Victorvijay
Qual é o escopo deste trecho?
Este código de trecho pode substituir alguma função principal do tema?
Amrita
Obrigado por compartilhar isso. Também tenho medo de adicionar código personalizado. Mas isso parece fácil. Se entendi corretamente, se o trecho de código tiver um erro, o plugin o desativará automaticamente. Correto?
WPBeginner Support
Olá Amrita,
Ele tenta e consegue capturar a maioria dos erros de sintaxe comuns, mas às vezes pode falhar na verificação. Tudo depende do código que você está tentando adicionar.
Admin
Abdal Muntaqeem
Obrigado por este ótimo plugin. Agora posso gerenciar trechos personalizados com mais facilidade.