Como Adicionar Snippets de Código Personalizados no WordPress (Método Mais Fácil)

Procura uma forma fácil e direta de adicionar snippets de código WordPress ao seu site?

Aprender WordPress não é apenas sobre temas e ferramentas. Por vezes, é o poder subtil de fragmentos de código que confere a um site o seu sabor único.

Aquela personalização perfeita que procura? É alcançável com o código certo, mas o problema é que mesmo o menor erro pode quebrar o seu site.

Neste artigo, vamos mostrar-lhe como adicionar facilmente snippets de código personalizados no WordPress sem quebrar o seu site.

O que são fragmentos de código no WordPress?

Por baixo da interface amigável do WordPress, existe um mundo de código que impulsiona cada um dos seus movimentos.

Estes pequenos fragmentos de código, chamados fragmentos de código, são ferramentas compactas mas poderosas que instruem o WordPress sobre funcionalidades específicas.

Aproveitar o poder destes fragmentos pode fazer a diferença entre um site WordPress genérico e um adaptado aos seus requisitos exatos.

Considere-os o equivalente no WordPress de feitiços que, quando lançados corretamente, podem trazer excelentes resultados no frontend.

Como adicionar fragmentos de código personalizados no WordPress

Para adicionar fragmentos de código personalizados no WordPress, pode contar com a simplicidade e funcionalidade do WPCode. Siga os passos abaixo para começar.

1. Instalar e ativar o plugin WPCode

WPCode é a melhor forma para os utilizadores de WordPress adicionarem fragmentos de código personalizados aos seus sites sem terem de mexer no ficheiro functions.php ou preocuparem-se em quebrar o site com o mais pequeno erro.

O plugin de fragmentos de código facilita a adição de fragmentos a qualquer parte do seu site WordPress, incluindo o rodapé e o cabeçalho. Pode inserir qualquer código personalizado que deseje diretamente do seu painel de controlo em vez de editar diretamente o ficheiro functions.php.

Para começar, terá de instalar e ativar o plugin WordPress no seu site. Isto adicionará o plugin ao painel do menu esquerdo do seu painel WordPress, de onde poderá começar a adicionar códigos personalizados rapidamente.

O WPCode vem com uma biblioteca de mais de 1100 fragmentos de código que pode usar no seu site em apenas alguns cliques – sem necessidade de conhecimentos de desenvolvimento! Ou pode seguir as instruções abaixo para adicionar o seu próprio código personalizado.

A equipa WPForms adicionou até alguns fragmentos de código nossos! Adicionámos o código para realizar as nossas personalizações de formulário mais solicitadas para que possa ir além da funcionalidade base do WPForms e dos add-ons. Dê uma vista de olhos na secção de bónus no final deste post para uma prévia.

2. Criar o código personalizado (PHP, CSS, HTML)

Se já tem o código personalizado pronto, salte este passo e avance para o próximo. Para aqueles que estão a criar o código personalizado do zero, aqui fica um exemplo.

Para este guia, criaremos um código personalizado que impede conflitos de tema que fazem com que os valores de Rádio e Checkbox não sejam exibidos corretamente no WPForms.

O código acima usa CSS para corrigir o problema de conflito de tema, mas como mencionado anteriormente, também pode criar um código com PHP e HTML.

3. Adicionar o seu código personalizado (Novo fragmento)

A partir da barra de menu de administração do seu WordPress, clique na opção Snippets de Código e, em seguida, no botão Adicionar Novo. Como acabou de instalar o plugin, a sua lista estará vazia.

Será então enviado para a página Adicionar Snippet. Aqui, pode adicionar o seu próprio código único ou selecionar um snippet de código da biblioteca pré-fabricada.

Clique no botão Usar Snippet ao lado da opção Adicionar o Seu Código Personalizado (Novo Snippet) para inserir o seu novo código.

Agora, tudo o que precisa de fazer é dar um nome ao snippet e simplesmente copiar e colar o código personalizado que criou no espaço Pré-visualização do Código no plugin WPCode.

Como criámos o código em CSS, no menu suspenso Tipo de Código, selecionámos Snippet CSS. Pode alterá-lo com base no código que criou.

Em seguida, navegue para baixo até ao separador Inserção.  Agora, selecione Inserção Automática e, no menu suspenso Localização, escolha a opção Cabeçalho do Site.

Dependendo do tipo de código que está a criar, pode até optar por adicioná-lo como um [/] Shortcode às suas páginas/publicações.

Se quiser atribuir etiquetas ao seu snippet de código, navegue para baixo até à secção Informações Básicas. Isto irá ajudá-lo a categorizar as suas amostras de código por tópico e função.

Quando desejar mostrar vários snippets no mesmo local, o parâmetro Prioridade permite-lhe escolher a ordem em que são processados.

Em seguida, a sofisticada funcionalidade Lógica Condicional Inteligente permite-lhe revelar ou ocultar snippets inseridos automaticamente com base num conjunto de critérios.

Finalmente, tudo o que precisa de fazer é verificar a opção Ativo e clicar no botão Guardar Snippet antes de sair do plugin!

4. Lidar com erros no código personalizado

Um erro de digitação no plugin ou ficheiro de tema específico do site pode tornar o seu site instantaneamente indisponível para os visitantes quando utiliza snippets de código.

Um erro de sintaxe ou um erro interno do servidor 500 apareceria no seu site. Terá de usar um cliente FTP para reverter manualmente as suas alterações.

A funcionalidade única do plugin WPCode é que identificará e desativará automaticamente quaisquer instâncias de erros de sintaxe no código.

Uma mensagem de erro útil será apresentada para que a utilize na depuração de erros. À medida que adiciona o seu código personalizado, a validação inteligente de snippets de código do WPCode encontrará quaisquer erros.

Quando passar o rato sobre o problema, aparecerá uma janela pop-up com instruções sobre como resolvê-lo.

5. Gerir os seus fragmentos de código personalizados

Se tiver vários snippets de código, o WPCode torna incrivelmente fácil geri-los com uma interface amigável e a biblioteca de snippets.

Os snippets de código podem ser guardados sem serem ativados no seu site, e pode ativar ou desativar o snippet sempre que desejar.

Adicionalmente, pode usar etiquetas para categorizar os seus snippets de código e filtrá-los com base no tipo e localização.

Também tem a opção de exportar trechos de código específicos ou exportá-los todos em massa. Navegue simplesmente para Trechos de Código » Ferramentas e selecione a opção Exportar.

O plugin também permite importar trechos se estiver a mudar o seu website para um novo servidor. Vá para Trechos de Código » Ferramentas » Importar e carregue o ficheiro de exportação.

Bónus: Adicionar fragmentos de código personalizados aos seus formulários

Se estiver a usar o WPForms no seu site, pode adicionar trechos de código para personalizar os seus formulários diretamente a partir do painel do plugin WPForms.

Quando tiver os plugins WPForms e WPCode instalados, pode aceder a uma biblioteca de trechos de código WPForms pré-feitos a partir da secção Ferramentas nas definições do plugin WPForms.

Com apenas um clique, pode adicionar funcionalidades avançadas ou personalizar a forma como o seu formulário é apresentado. É como ter o seu próprio programador web para o ajudar a criar um website à medida!

Alguns exemplos dos trechos de código disponíveis no WPForms incluem:

• Selecionar um intervalo de datas no campo de seleção de datas
• Bloquear endereços IP específicos de preencherem o seu formulário
• Personalizar sub-rótulos
• Exibir contagem de submissões de entradas

Estamos a adicionar constantemente novos trechos de código ao diretório, por isso sinta-se à vontade para entrar em contacto com o seu pedido se precisar de ajuda com a personalização!

Perguntas frequentes sobre fragmentos de código personalizados

Adicionar trechos de código personalizados é um tópico popular de usabilidade entre os nossos leitores. Aqui ficam algumas respostas rápidas a algumas das perguntas mais frequentes:

Qual é o melhor gestor de trechos de código para WordPress?

O WPCode é uma excelente opção para gerir e executar trechos de código no WordPress, oferecendo uma organização mais simples e capacidades de integração perfeitas.

Como adiciono CSS a um trecho de código no WordPress?

Dentro do WPCode, navegue simplesmente para a secção + Adicionar Novo, insira o seu CSS desejado e certifique-se de que seleciona o tipo CSS antes de guardar e ativar.

Como adiciono código personalizado ao WordPress sem plugins?

Pode introduzir código personalizado diretamente no ficheiro functions.php do seu tema. No entanto, uma ferramenta dedicada como o WPCode garante uma gestão de trechos mais segura e organizada.

Como adiciono código PHP personalizado ao WordPress?

Para PHP, dirija-se à interface do WPCode, escolha + Adicionar Novo, cole o seu código PHP e, em seguida, guarde. Certifique-se sempre de que é testado primeiro num site de tema filho de staging.

Em seguida, Saiba Como Exigir um Endereço de Email para Downloads de Ficheiros

Não seria ótimo se os utilizadores do WordPress tivessem de lhe fornecer os seus endereços de email antes de poderem descarregar um ficheiro? Descubra como fazer com que os visitantes do seu site WordPress partilhem os seus endereços de email para poderem descarregar um ficheiro.

Crie o seu formulário WordPress agora

Pronto para criar o seu formulário? Comece hoje com o plugin construtor de formulários WordPress mais fácil. O WPForms Pro inclui muitos modelos gratuitos e oferece uma garantia de devolução do dinheiro em 14 dias.

Se este artigo o ajudou, por favor siga-nos no Facebook e Twitter para mais tutoriais e guias gratuitos do WordPress.