Guia do iniciante para colar códigos ou snippets no WordPress

Aqui no Império WP frequentemente publicamos tutoriais pedindo aos usuários para adicionar trechos de código no WordPress. Copiar e colar código em arquivos de tema do WordPress pode parecer fácil para usuários experientes, mas é bastante tedioso e intimidante para iniciantes. Devido à falta de familiaridade com a codificação, os iniciantes podem acabar cometendo um erro que pode travar seu site. Neste guia passo a passo, mostraremos como copiar e colar trechos de código da internet no WordPress.

códigos ou snippets no WordPress

Por que adicionar trechos de código ou snippets no seu site WordPress?

O WordPress é o melhor construtor de sites do mundo devido à flexibilidade que oferece. É muito fácil adicionar novos recursos e funcionalidades ao seu site WordPress.

Sites como o Império WP, compartilham dicas e hacks que você pode adicionar para melhorar seu site. Embora adicionar trechos de código personalizados ao seu site seja opcional, e você geralmente pode encontrar plugins para fazer a mesma tarefa, às vezes um trecho simples é mais eficiente.

Alguns trechos de código podem ser muito úteis e podem ajudá-lo a corrigir muitos erros comuns do WordPress, melhorar a segurança do WordPress e até mesmo adicionar novos recursos ao seu site.

Dito isso, vamos dar uma olhada em como adicionar trechos de código com segurança ao seu site WordPress.

Quais são as melhores maneiras de adicionar trechos de código no WordPress?

A primeira coisa que você deve fazer em cada site WordPress é instalar um plugin de backup para WordPress. Isso mantém seu site WordPress seguro e você sempre pode restaurá-lo do backup caso algo dê errado.

Às vezes, você pode encontrar instruções para adicionar trechos de código em arquivos de tema do WordPress como index.php, single.php, header.php e muito mais. Esses trechos de código são úteis apenas nesses arquivos específicos, portanto, você terá que adicioná-los diretamente aos seus arquivos de tema ou criar um tema filho.

No entanto, a maioria dos trechos de código personalizados são adicionados ao arquivo functions.php do tema do WordPress.

Vamos dar uma olhada em algumas das maneiras de adicionar trechos de código personalizados no WordPress.

1. Use o plugin Code Snippets para WordPress

Este é o método mais seguro e recomendado para iniciantes. Code Snippets é um plugin para WordPress que permite adicionar e gerenciar facilmente snippets de código personalizados em seu site.

Ele vem com uma chave à prova de falhas que desativa imediatamente um trecho de código se causar um erro. Isso evita que você perca acesso ao seu site ao adicionar um snippet de código personalizado.

Para obter instruções detalhadas, consulte nosso guia sobre como adicionar facilmente trechos de código personalizados no WordPress.

Nota: O método de Code Snippets é útil para códigos que precisam ser adicionados em um arquivo de funções (functions.php). Se for solicitado que você adicione um códigos em outros arquivos de tema, este método não funcionará.

2. Crie um tema filho para salvar o código personalizado

A segunda abordagem é criar um tema filho. Usar o tema filho manterá suas alterações intactas quando você atualizar seu tema. Também permitirá que você adicione código a outros arquivos de tema, se necessário, sem se preocupar com atualizações que poderiam desfazer suas alterações.

Para obter mais detalhes, consulte nosso guia sobre como criar um tema filho no WordPress .

Nota: Este método funcionará para trechos de código que precisam ser incluídos em outros modelos do tema.

3. Criar um plugin site-específico para adicionar código personalizado

Outra opção flexível é usar um plugin site-específico WordPress. Este é um plugin personalizado que você pode criar para seu próprio site e usá-lo para salvar todo o seu código personalizado.

A vantagem desse método é que seu código não depende do seu tema e permanecerá ativo mesmo quando você alterar os temas. Ele também não é afetado por nenhuma atualização do WordPress em seu site.

Consulte nosso guia sobre como fazer um plugin site-específico para o seu site para obter instruções detalhadas.

Nota: Este método é aplicável apenas para trechos de código que precisam ser adicionados no arquivo de funções.

4. Adicionar código diretamente ao arquivo de funções

Não há problema em adicionar trechos de código ao arquivo functions.php do seu tema. No entanto, existem algumas desvantagens.

  • Suas alterações serão apagadas quando você atualizar seu tema WordPress;
  • Seu código só funcionará se você estiver usando aquele tema específico.

Dito isso, vamos dar uma olhada em como copiar e colar trechos de código corretamente e evitar quebrar seu site.

Como editar arquivos do WordPress?

Existem diferentes maneiras de editar arquivos WordPress, dependendo do método que você escolher para adicionar trechos de código personalizados em seu site.

1. Adicionando código personalizado no plugin Code Snippets

Se você estiver usando o plugin Code Snippets, poderá adicionar facilmente código de snippets na área de administração do WordPress. Basta ir para a página Snippets » Adicionar Novo para adicionar seu código personalizado.

Para obter instruções detalhadas, consulte nosso guia sobre como adicionar facilmente trechos de código personalizados no WordPress.

2. Adicionando código personalizado em um plugin site-específico

Se você estiver adicionando código personalizado em um plugin site-específico, poderá usar o editor de plugin WordPress integrado para adicionar código personalizado.

Em seguida, você precisa selecionar o seu plugin site-específico no menu suspenso denominado “Selecionar um plugin para editar:”. O editor carregará seu arquivo do plugin e você poderá adicionar trechos de código a ele.

Quando terminar, clique no botão “Atualizar arquivo” para salvar suas alterações.

Se houver algo faltando em seu código ou se houver potencial para corromper seu site, o editor de plugins desfará automaticamente suas alterações.

Outro método para adicionar código personalizado em um plugin específico do site é usando FTP.

Simplesmente vá para a pasta do plugin usando seu cliente FTP. Clique com o botão direito do mouse no arquivo do plugin e selecione Exibir / Editar arquivo.

Consulte nosso guia sobre como fazer um plugin site-específico para o seu site para obter instruções detalhadas.

3. Adicionando código personalizado no functions.php ou outros templates de tema

Se você estiver adicionando trechos de código ao arquivo functions.php do seu tema ou qualquer outro template, poderá adicionar o código diretamente visitando Aparência » Editor de temas. Você pode selecionar o arquivo onde precisa adicionar o código na coluna a direita.

As instruções que você está seguindo dirão onde colar o código, mas se não o fizerem, será necessário adicionar o código na parte inferior do arquivo.

Uma forma alternativa melhor seria usar o FTP para adicionar código personalizado em arquivos de tema. Simplesmente conecte a sua hospedagem utilizando seu cliente FTP e vá para /wp-content/themes/pasta-do-seu-tema/ e clique com o botão direito no arquivo que precisa ser editado.

Selecione a opção Ver/ Editar arquivo para abrir o arquivo no editor de texto.

Solução de problemas de erros de PHP ao adicionar código personalizado

Existem alguns erros comuns que os iniciantes cometem ao adicionar trechos de código personalizado a seus sites. Vamos dar uma olhada em alguns deles e como evitá-los.

1. Uso incorreto de tags de início e fim do PHP

O WordPress é escrito principalmente na linguagem de programação PHP, que possui uma sintaxe específica que informa ao seu servidor que o código a seguir precisa ser processado pelo PHP. Esta é a aparência de um snippet de código PHP típico:

// Tag de início do PHP
<?php

// O resto do código vai aqui

// Tag de fechamento PHP
?>

Todo o seu código PHP precisa estar dentro das tags <?php e ?>.

Você precisa ter certeza de que, se estiver colando seu código em um local onde a tag de início do PHP não está fechada, você precisará adicionar seu código sem a tag de início do PHP.

<?php
// Algum código pré-existente</pre>
// seu código personalizado

?>

Se você estiver colando seu código personalizado fora ou após a tag de final do PHP, também precisará adicionar a tag de início do PHP.

<?php
// Algum código pré-existente
?>


<?php
// seu código personalizado
?>

Quase 90% de todos os erros são causados ​​pelo posicionamento incorreto das tags final ou inicial do PHP. O estudo do código permitirá que você entenda se precisa ou não adicionar as tags de início ou fim do PHP em seu trecho de código personalizado.

Muitos arquivos de tema do WordPress, em particular o arquivo functions.php, podem não ter uma tag final do PHP. Isso significa que você pode adicionar seu código na parte inferior do arquivo, sem as tags de início ou fim.

<?php
// Muito código no arquivo de funções do seu tema
//
//
// seu código personalizado
function custom_loginlogo() {
echo '<img src="data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7" data-wp-preserve="%3Cstyle%20type%3D%22text%2Fcss%22%3E%0Ah1%20a%20%7Bbackground-image%3A%20url('.get_bloginfo('template_directory').'%2Fimages%2Flogin_logo.png)%20!important%3B%20%7D%0A%3C%2Fstyle%3E" data-mce-resize="false" data-mce-placeholder="1" class="mce-object" width="20" height="20" alt="<style>" title="<style>" />';
}
add_action('login_head', 'custom_loginlogo');

Lembre-se de que os escritores do tutorial podem, às vezes, presumir que você já sabe como usar as tags de início e fim do PHP. Eles podem simplesmente mostrar um snippet de código sem essas tags.

function custom_loginlogo() {
echo '<img src="data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7" data-wp-preserve="%3Cstyle%20type%3D%22text%2Fcss%22%3E%0Ah1%20a%20%7Bbackground-image%3A%20url('.get_bloginfo('template_directory').'%2Fimages%2Flogin_logo.png)%20!important%3B%20%7D%0A%3C%2Fstyle%3E" data-mce-resize="false" data-mce-placeholder="1" class="mce-object" width="20" height="20" alt="<style>" title="<style>" />';
}
add_action('login_head', 'custom_loginlogo');

Como o autor do tutorial não sabe onde você adicionará esse código, ele ignorou as tags de final e inicial do PHP. Agora, quando você está adicionando tal fragmento de código em seus arquivos de tema, você precisa ter certeza de que ele está dentro das tags do PHP.

2. Erros de aninhamento incorretos

O PHP tem uma sintaxe particular para funções, lógicas condicionais e loops. Esta sintaxe depende de chaves que indicam quando uma função começa e quando termina.

Por exemplo, aqui está uma função PHP simples:

<?php
function imperiowp_tutorial() {
echo "Hello World!";
}
?>

Agora, se você deseja adicionar um snippet de código personalizado que não tem nada a ver com esta função, você precisará colocá-lo fora desta função como esta:

// Código pré-existente em seu arquivo de tema
<?php
function imperiowp_tutorial() {
echo "Hello World!";
}
// seu código personalizado
function custom_loginlogo() {
echo '<style type="text/css">
h1 a {background-image: url('.get_bloginfo('template_directory').'/images/login_logo.png) !important; }
</style>';
}
?>

Se você perder as chaves iniciais ou finais, isso quebrará o código e terminará com uma página de erro.

Compreendendo erros de PHP no WordPress

Erros causados pela adição de um código personalizado no WordPress geralmente resultam em uma mensagem de erro detalhada. A maioria deles são erros de sintaxe, erros de análise ou erros fatais devido a caracteres inesperados.

A parte boa é que esses erros informarão qual linha do código causou o erro.

Você pode então ir para a linha exata para revisar o código e descobrir o que você perdeu. Para este propósito, recomendamos o uso de um editor de texto adequado para edição de código, pois eles têm números de linha e realce de sintaxe que podem ajudá-lo a corrigir o problema facilmente.

O que fazer quando seu site WordPress está inacessível?

Em primeiro lugar, não entre em pânico. Simplesmente conecte-se ao seu site usando um cliente FTP ou aplicativo Gerenciador de Arquivos como cPanel. Em seguida, localize o arquivo onde você adicionou o código que causou o erro e edite-o.

Você pode tentar corrigir os problemas com o snippet de código. Se você não conseguir corrigir esses problemas, remova o código e salve suas alterações.

Seu site deve voltar ao normal novamente. Se ainda estiver mostrando algum erro, baixe uma nova cópia do seu tema WordPress e extraia o arquivo zip para o seu computador.

Carregue o arquivo onde você fez as alterações do seu computador para o seu site enquanto sobrescreve o arquivo antigo.

Esperamos que este artigo tenha ajudado você a aprender como colar códigos de snippets no WordPress.

Receba dicas de WordPress grátis!
Receba dicas semanais sobre como otimizar o SEO, a usabilidade e a conversão do seu site WordPress.

DEIXE UMA RESPOSTA

Por favor digite seu comentário!
Por favor, digite seu nome aqui

Esse site utiliza o Akismet para reduzir spam. Aprenda como seus dados de comentários são processados.