fbpx

Bem vindo ao
Blog da FULL.

Aprenda, crie e cresça seu negócio na internet.

Encontre conteúdos, dicas, tutoriais e novidades sobre as principais ferramentas Wordpress

Guia para iniciantes para colar trechos da Web no WordPress

Você está em:

Guia para iniciantes para colar trechos da Web no WordPress

Quer aprender a colar trechos da web no WordPress?

Publicamos muitos tutoriais do WordPress que solicitam aos usuários que adicionem trechos de código ao WordPress.

Copiar e colar código em arquivos de tema do WordPress pode parecer fácil para usuários experientes, mas pode ser intimidante para iniciantes.

Neste artigo, mostraremos como copiar e colar trechos de código da web no WordPress sem quebrar seu site.

Guia para iniciantes para colar trechos da web no WordPress

Por que adicionar trechos de código ao 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 e pode ajudar a criar praticamente qualquer tipo de site .

Compartilhamos todos os tipos de dicas e truques que você pode usar para melhorar seu site. Algumas dessas dicas solicitarão que você adicione código ao WordPress.

Embora adicionar trechos de código personalizados ao seu site seja opcional, e muitas vezes você possa encontrar plugins para fazer a mesma tarefa, às vezes um trecho simples é mais eficiente.

Muitas vezes, adicionar trechos de código pode ser uma maneira fácil de corrigir muitos erros comuns do WordPress , melhorar a segurança do WordPress e adicionar novos recursos ao seu site.

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

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

É importante mencionar que, antes de começar a adicionar trechos de código ao seu site WordPress, você deve instalar e usar um plug-in de backup do WordPress .

Isso mantém seu site WordPress seguro e você sempre pode restaurá-lo a partir de um backup, caso algo dê errado.

Ao adicionar trechos ao WordPress, você pode encontrar instruções para adicioná-los aos arquivos de modelo de tema do WordPress, como index.php, single.phpe muito mais.

Esses snippets são úteis apenas para esses arquivos de tema específicos, portanto, você terá que adicioná-los diretamente ou criar um tema filho .

No entanto, a maioria dos trechos de código serão adicionados ao arquivo functions.php do seu tema WordPress. Alguns tutoriais podem recomendar adicioná-lo diretamente ao arquivo, mas existem alternativas muito melhores que permitem que você proteja suas alterações no futuro.

Dessa forma, se você alterar um tema, sua funcionalidade personalizada não será removida.

Com isso dito, vamos dar uma olhada em algumas das maneiras mais amigáveis para iniciantes de adicionar trechos de código personalizados no WordPress.

1. Use o plug-in do WordPress de trechos de código

Plugin de trechos de código

Usar um plug-in de trechos de código é a maneira mais segura e amigável para iniciantes de adicionar código ao WordPress.

O plug-in Code Snippets permite que você adicione e gerencie facilmente trechos de código personalizados em seu site.

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

Observação: o método de trechos de código é útil para trechos que precisam ser adicionados ao functions.phparquivo. Se você for solicitado a adicionar um trecho de código em outros arquivos de tema, esse método não funcionará.

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

Usando o tema filho para adicionar trechos de código personalizados no WordPress

Outro ótimo método para adicionar código ao WordPress é criar um tema filho do WordPress . O uso de um tema filho ajudará a manter intactas todas as alterações feitas no site ao atualizar o tema.

Para mais detalhes, veja nosso guia para iniciantes sobre como criar um tema filho no WordPress .

Observação: esse método também funcionará para trechos de código que precisam ser adicionados em outros arquivos de modelo de tema.

3. Use um plug-in específico do site para código personalizado

Criar plug-in específico do site

Outra opção flexível é usar um plugin WordPress específico do site. Este é um plugin personalizado que você pode criar para seu próprio site e usar 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. Também não é afetado por nenhuma atualização do WordPress em seu site.

Observação: esse método só é aplicável a trechos de código que precisam ser adicionados ao functions.phparquivo.

4. Use o plug-in de inserção de cabeçalhos e rodapés do WordPress para adicionar código personalizado

Exemplo de plug-in de inserção de cabeçalhos e rodapés

Às vezes, você só precisa adicionar código aos seus temas header.phpou footer.phparquivos. O plugin Insert Headers and Footers pode ajudá-lo a fazer isso facilmente.

Isso é útil quando você precisa adicionar o código de rastreamento do Google Analytics , Facebook Pixel, Google AdSense e muito mais ao seu site.

Além disso, permite gerenciar todos os seus códigos de cabeçalho e rodapé em um só lugar, evita erros manuais e permite atualizar ou alterar seu tema sem preocupações.

Observação: esse método funciona melhor para scripts de rastreamento, CSS personalizado e código Javascript .

4. Adicionar código diretamente ao arquivo Functions.php

Adicionar código ao exemplo de functions.php

Finalmente, não há problema em adicionar trechos de código diretamente ao functions.phparquivo do seu tema. No entanto, recomendamos usar as outras opções acima, pois existem algumas desvantagens.

Primeiro, se você atualizar seu tema WordPress , todas as suas alterações desaparecerão.

Em seguida, o código que você adicionou só funcionará se você estiver usando esse tema específico.

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

Como editar e adicionar código aos arquivos do WordPress

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

1. Adicionando código personalizado no plug-in de trechos de código

Se você for usar o plug-in Code Snippets para adicionar código ao WordPress, estará adicionando código diretamente no painel de administração do WordPress.

Primeiro, você precisa instalar e ativar o plugin. Para obter mais detalhes, consulte nosso guia para iniciantes sobre como instalar um plug-in do WordPress .

Após a ativação, basta acessar Snippets » Adicionar novo no painel de administração do WordPress.

Isso leva você a uma tela onde você pode adicionar seu código personalizado. Tudo o que você precisa fazer é dar um nome ao seu snippet para ajudá-lo a lembrar e colar o código na caixa.

Adicionar novo snippet de código

Em seguida, clique no botão ‘Ativar’ e seu snippet de código estará ativo em seu site.

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

2. Adicionando código personalizado no plug-in WordPress específico do site

Se você estiver usando um plug-in específico do site, poderá usar o editor de plug-in do WordPress integrado para adicionar seu código personalizado.

Primeiro, você precisará ir para Plugins » Editor de plug-ins e, em seguida, selecionar seu plug-in no menu suspenso chamado ‘Selecionar plug-in para editar:’.

O editor carregará seu plugin específico do site. Em seguida, você pode simplesmente adicionar código à página.

Adicionar código ao plug-in específico do site

Quando terminar, certifique-se de clicar no botão ‘Atualizar arquivo’ para salvar suas alterações.

Se algo estiver faltando em seu código ou puder quebrar seu site, o editor de plugins desfará automaticamente suas alterações.

Outra maneira de adicionar código personalizado a um plug-in específico do site é usando o FTP. Para obter mais detalhes, consulte nosso guia para iniciantes sobre como usar o FTP para fazer upload de arquivos para o WordPress .

Basta abrir seu site usando seu cliente FTP preferido e, em seguida, clicar com o botão direito do mouse no arquivo do plug-in e selecionar a opção ‘Visualizar/Editar’.

Edite o plugin WordPress específico do site usando FTP

Isso abrirá o arquivo para que você possa adicionar seus trechos de código. Quando você salvar e carregar o arquivo novamente, as alterações serão exibidas automaticamente.

Para obter mais detalhes, consulte nosso guia sobre como criar um plug-in específico de site para o seu site .

3. Adicionando código personalizado com o plug-in Inserir cabeçalhos e rodapés

Se você for usar o plug-in Insert Headers and Footers para adicionar trechos de código, poderá fazê-lo diretamente no painel de administração do WordPress.

Primeiro, você precisa instalar e ativar o plugin. Para mais detalhes, veja nosso guia passo a passo sobre como instalar um plugin do WordPress .

Depois disso, você pode ir para Configurações » Inserir cabeçalhos e rodapés e inserir seu snippet de código na seção de cabeçalho, corpo ou rodapé do seu site.

Adicionar código ao plug-in Inserir cabeçalhos e rodapés

Certifique-se de clicar no botão ‘Salvar’ e seus snippets de código estarão ativos em seu site.

Para obter mais detalhes, consulte nosso guia sobre como adicionar código de cabeçalho e rodapé no WordPress .

4. Adicionando código personalizado ao Functions.php ou outros modelos de tema

Se você estiver adicionando trechos de código diretamente ao functions.phparquivo do seu tema ou a qualquer outro modelo de página, poderá adicionar o código navegando até Appearance » Theme Editor no painel de administração do WordPress.

Em seguida, você pode selecionar o arquivo na coluna da direita e ele será aberto no editor.

Adicionar código a functions.php e outros modelos

O tutorial que você está seguindo informará onde você pode adicionar o snippet de código, mas se não, você precisará adicionar o código na parte inferior do arquivo abaixo de todo o código presente.

Outra alternativa é usar o FTP do seu gerenciador de arquivos de hospedagem do WordPress para adicionar código personalizado aos seus arquivos de tema.

Basta conectar-se ao seu cliente FTP ao seu site e, em seguida, ir para wp-content » temas » pasta do seu tema e clique com o botão direito do mouse no arquivo que precisa ser editado.

Edite arquivos de tema via FTP

Em seguida, clique na opção ‘Visualizar/Editar’ para abrir o arquivo no editor de texto e adicionar seu snippet de código.

Solucionando erros de PHP ao adicionar código personalizado

Existem alguns erros comuns que os iniciantes cometem ao adicionar trechos de código personalizados aos seus sites WordPress . Felizmente, a maioria desses erros pode ser evitada e corrigida facilmente.

Vamos dar uma olhada nesses erros e as melhores maneiras de corrigi-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. Aqui está a aparência de um trecho de código PHP típico:

1234567// PHP Begin Tag<?php // Rest of the code goes here // PHP End Tag?>

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

A tag final do PHP é muito importante em arquivos que alternam entre PHP e HTML. Isso inclui a maioria dos arquivos de tema do WordPress que usam tags PHP junto com HTML.

Você precisa ter certeza de que, se estiver colando seu código em um local onde a tag inicial do PHP não esteja fechada, será necessário adicionar seu código sem a tag inicial do PHP.

123456<?php// Some pre-existing code // your custom code ?>

Se você estiver colando seu código personalizado fora ou após a tag de finalização do PHP, será necessário adicionar a tag de início do PHP também.

12345678<?php// Some pre-existing code?> // Your custom code snippet<?php ?>

Quase 90% de todos os erros são causados pelo posicionamento incorreto de tags de início ou fim do PHP. Observar seu código ajudará você a entender se precisa ou não adicionar as tags de início ou fim do PHP em seu snippet de código personalizado.

No entanto, muitos arquivos de tema do WordPress, como functions.phppodem 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.

Aqui está um exemplo de como isso se parece.

1234567891011<?php// Lots of code in your theme’s functions.php file////// Your custom codefunction custom_loginlogo() {echo ‘<style type=”text/css”>h1 a {background-image: url(‘.get_bloginfo(‘template_directory’).’/images/login_logo.png) !important; }</style>’;}add_action(‘login_head’, ‘custom_loginlogo’);

Lembre-se que alguns tutoriais podem assumir que você já sabe como usar as tags de início e fim do PHP. Portanto, eles podem simplesmente mostrar um snippet de código sem essas tags.

123456function custom_loginlogo() {echo ‘<style type=”text/css”>h1 a {background-image: url(‘.get_bloginfo(‘template_directory’).’/images/login_logo.png) !important; }</style>’;}add_action(‘login_head’, ‘custom_loginlogo’);

Às vezes, quando os trechos de código são fornecidos, eles podem ser adicionados a vários locais, de modo que as tags final e inicial do PHP não serão incluídas.

Quando você está adicionando tal trecho de código em seus arquivos de tema, você precisa ter certeza de que ele está dentro das tags PHP.

2. Erros de aninhamento incorretos

O PHP tem uma sintaxe particular para funções, lógica condicional 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:

12345<?phpfunction wpbeginner_tutorial() {echo “Hello World!”;}?>

Agora, se você quiser adicionar um trecho de código personalizado que não tenha nada a ver com essa função, precisará colocá-lo fora dessa função assim:

123456789101112// Pre-existing code in your theme file<?phpfunction wpbeginner_tutorial() {echo “Hello World!”;}// Your custom codefunction 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 você terminará com uma página de erro.

Entendendo os erros do PHP no WordPress

Erros causados pela adição de código personalizado ao 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 boa notícia é que esses erros lhe dirão qual linha em seu código causou o erro.

Exemplo de código de erro PHP

Então, você pode ir para a linha exata para revisar o código e descobrir o que você perdeu.

Para isso, recomendamos o uso de um editor de texto adequado para edição de código , pois eles possuem 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, respire fundo e não entre em pânico. Todos os arquivos do seu site ainda estão lá e você pode acessá-los.

Basta conectar-se ao seu site usando um cliente FTP ou o aplicativo gerenciador de arquivos no cPanel em sua conta de hospedagem WordPress .

Para obter mais detalhes, consulte nosso guia para iniciantes sobre como usar o FTP para fazer upload de arquivos para o WordPress .

Em seguida, localize o arquivo onde você adicionou o código que causou o erro e abra-o para editá-lo.

Em seguida, você pode tentar corrigir os problemas com o snippet de código. Se você não conseguir corrigir esses problemas, basta remover o snippet de código adicionado e salvar suas alterações.

Agora, 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.

Depois disso, localize o arquivo onde você fez as alterações anteriormente e faça o upload para o seu servidor enquanto substitui o arquivo antigo.

Para obter mais maneiras de resolver esses problemas, consulte nosso guia sobre os erros mais comuns do WordPress e como corrigi-los . Se isso não ajudar, siga nosso guia de solução de problemas do WordPress para realizar um diagnóstico passo a passo.

Esperamos que este artigo tenha ajudado você a aprender como colar trechos de código da web no WordPress. Você também pode querer ver nosso guia sobre como criar um endereço de e-mail comercial gratuito e nossas escolhas do melhor software de bate-papo ao vivo para pequenas empresas.

Se você gostou deste artigo, assine nosso canal do YouTube para tutoriais em vídeo do WordPress. Você também pode nos encontrar no Twitter e no Facebook .

Aprenda com a FULL.

Junte-se a mais de 50 mil pessoas que recebem em primeira mão as principais ferramentas e tecnologia para desenvolvimento web

Meu carrinho
🎁 Faltam R$100,00 para liberar a Black da FULL
Seu carrinho está vazio.

Parece que você não adicionou nada ao seu carrinho =(