Desenvolvimento de Plugins: Guia Definitivo Passo a Passo

Assim como criar um site em WordPress, aprender sobre o desenvolvimento de plugins WordPress não é algo tão complicado e fora do alcance de todos como pode parecer. Criar um plugin WordPress não está além de suas capacidades e qualquer pessoa que tenha habilidades suficientes para escrever um código PHP básico e modificar um tema de WordPress pode criar um plugin. Exemplo dos fundadores da WooThemes, Mark Forrester, Magnus Jepson e Adii Pienaar, os criadores do WooCommerce, que começaram como desenvolvedores e criaram a empresa responsável pelo plugin hoje.

Mas, por que você quer criar um plugin? Provavelmente porque você precisa adicionar funcionalidades ao seu tema e, em vez de baixar um plugin pronto (ou talvez você não tenha encontrado um que atenda exatamente as suas necessidades). Há muitos casos em que isso é bom, mas também há casos em que a funcionalidade personalizada é melhor ser adicionada a um plugin. Por que você pode perguntar?

Leia Também:
Melhores plugins de WhatsApp
O que são os MegaMenus em WordPress
Melhores práticas para trabalhar com WordPress
Plugins Obrigatórios para WordPress
Como melhorar a segurança do seu site
Melhores Plugins para Woocommerce
Woocommerce: melhores temas

Considere este cenário:

Você adicionou funcionalidade ao seu tema que altera o avatar padrão para o seu próprio avatar personalizado. O único problema é que você acabou de alterar os temas e agora perdeu a função que você criou. Se você tivesse adicionado esse código em um plugin, ele ainda estaria lá quando você decidisse mudar de tema.

Encontramos esse problema com frequência durante a criação de sites em WordPress. Então, se você deseja evitar esse tipo de coisa e criar um site e transformá-lo em algo ainda mais personalizado, criar seus próprios plugins pode ser a solução. Vamos falar um pouco sobre a criação de plugins para WordPress e caso você fique com alguma dúvida, basta deixar aí nos comentários.

O que é um Plugin?

Um plugin WordPress é um software que “se conecta” ao seu site WordPress. Os plugins podem adicionar novas funcionalidades ou estender a funcionalidade existente em seu site, permitindo que você crie praticamente qualquer tipo de site, de lojas de comércio eletrônico a portfólios e sites de diretório.

Os plugins podem fazer pequenos ajustes em seu site ou grandes mudanças, dependendo de seus recursos. Por exemplo, você pode usar um plugin para adicionar um botão para abrir o WhatsApp direto do seu site, para que o seu cliente converse com um atendente, ou para criar um site totalmente multilíngue. Ou, se você administra uma empresa de comércio eletrônico, pode instalar um plugin para ajudar nos gateways de pagamento ou permitir que os visitantes marquem compromissos online.

Também existem plugins que podem ajudá-lo a aprimorar seus formulários de contato, criar sliders bonitos, fazer backup de seu site em caso de falha de dados e facilitar a ativação de e-mail – e muito mais.

Enquanto muitos fazem alterações no front-end (a parte visual do site) do seu site, alguns plugins fazem alterações no back-end (o código) para que a manutenção seja mais fácil para sua equipe. Esses plugins podem permitir que você verifique se há links quebrados em seu site, execute testes A/B ou coloque seu site no modo de manutenção, por exemplo.

Os plugins permitem que você adicione ou estenda a funcionalidade do seu site WordPress sem alterar os arquivos principais do WordPress. Os plugins usam pontos de acesso, formalmente conhecidos como ganchos de filtro e ação, fornecidos pela API de plug-in do WordPress para “ligar” ao código-fonte. Esses pontos de acesso e métodos chamarão as funções do plugin em horários específicos e modificarão o comportamento padrão do WordPress.

Tipos de plugin do WordPress

Os plugins podem realizar muitas tarefas. O que todos eles têm em comum é que adicionam funcionalidades extras ao seu site. Os tipos de plugin do WordPress incluem:

• Plugins de manutenção do site – para coisas como segurança, desempenho ou backups;
• Plugins de marketing e vendas – para coisas como SEO, mídia social ou comércio eletrônico;
• Plugins de conteúdo – como tipos de postagem personalizados, widgets, códigos de acesso, formulários, galerias e feeds de vídeo;
• Plugins de API – que funcionam com a API REST do WordPress ou extraem conteúdo externo de serviços como o Google Maps;
• Plugins da comunidade – que adicionam recursos de rede social;

… e muito mais! Para ter uma ideia do que os plugins podem fazer, confira o diretório de plugins do WordPress.

Conteúdo de um plugin

Antes de começar a construir seu plugin, vale a pena saber o que se passa dentro de um plugin. A aparência exata do código do plugin dependerá do seu plugin: alguns são pequenos, com apenas um arquivo de plugin, enquanto outros são enormes, com vários arquivos de inclusão, scripts, folhas de estilo e arquivos de modelo. E há muitos que caem em algum lugar no meio. Os elementos que você provavelmente terá em seu plugin são:

• O arquivo de plugin principal (isso é essencial);
• Pastas para diferentes tipos de arquivos;
• Script;
• Folhas de estilo;
• Arquivos Inclusão para organizar o código;

O arquivo de plugin principal: O arquivo de plugin principal é essencial. Sempre será um arquivo PHP e sempre conterá um texto comentado que informa ao WordPress sobre seu plugin. Um exemplo está logo abaixo. Isso informa ao WordPress o que seu plugin faz, onde descobrir mais sobre ele e quem o desenvolveu. Também fornece informações sobre o número da versão e o domínio do texto e caminho para internacionalização, bem como a licença.

//exemplo.php NOTE: ignore esse código por enquanto
<?php
/**
 * Plugin Name: My First Plugin
 * Plugin URI: http://www.meuwebsite.com.br/my-first-plugin
 * Description: Meu Plugin
 * Version: 1.0
 * Author: Seu Nome
 * Author URI: http://www.meuwebsite.com.br
 */

O arquivo de plugin principal também conterá o código que faz o plugin ao ser executado. Às vezes, isso será todo o PHP do plugin, mas para plugins maiores, haverão arquivos contendo código extra. Isso ajuda você a organizar seu código e significa que você não tem um arquivo longo e desorganizado com o qual é difícil trabalhar.

Estrutura de pastas: Embora não existam regras rígidas sobre como você organiza as pastas em seu plugin, faz sentido adotar a mesma estrutura que outros desenvolvedores de plugins usam. Isso irá familiarizá-lo com a forma como outros plugins são construídos e significa que se você compartilhar seu código no futuro, fará sentido para outras pessoas. As pastas em seu plugin podem incluir:

• css ou styles para folhas de estilo
• scripts para JavaScript
• includes para incluir arquivos
• models para arquivos de modelo que seu plugin gera
• assets para mídia e outros arquivos de ativos
• i18n para arquivos de internacionalização

Você pode achar que precisa usar mais pastas se seu plugin for grande ou complexo. Por exemplo, o WooCommerce tem pastas para pacotes, dados de amostra e muito mais. Estes, por sua vez, incluem subpastas para coisas como blocos e arquivos de administração.

Scripts e folhas de estilo: Se o seu plugin produzir conteúdo que precise de estilo, seja no front-end ou nas telas de administração, você pode precisar de folhas de estilo (o CSS). E se o seu plugin usar scripts, você precisará de arquivos para eles. Faz sentido mantê-los em sua própria pasta, mesmo que você tenha apenas um de cada. Você precisará enfileirar esses scripts e folhas de estilo usando uma função dedicada em seu arquivo de plugin principal.

Arquivos de Inclusão: Se o seu plugin precisar de organização, você pode fazer isso dividindo seu código em vários arquivos, chamados de Arquivos de Inclusão. Você então coloca esses arquivos em sua própria pasta e os chama em seu arquivo de plugin principal usando uma função ‘include’ ou ‘require’.

Dessa forma, você pode manter a maior parte do seu código em uma estrutura de arquivos bem organizada, enquanto seu arquivo de plugin principal permanece enxuto e mínimo. Se o seu plugin não for tão grande, você não precisa usar arquivos de inclusão: basta adicionar seu código ao arquivo principal do plugin. Mas você pode achar que precisa organizar esse arquivo e reordenar as funções dentro dele à medida que os adiciona, para manter uma estrutura lógica.

Estes são os elementos mais comuns de um plugin. Em plugins maiores, como o WooCommerce, pode haver muito mais e, em plugins menores, pode haver muito menos. Mas à medida que você aprende mais sobre o WordPress e desenvolve mais plugins, você se verá usando esses elementos cada vez mais.

Crie seu primeiro plugin em cinco passos simples

Você pode criar um plugin do WordPress em cinco etapas simples. Claro, você pode querer saber um pouco de codificação em PHP e ter conhecimento de WordPress para entender o que você pode, dever ou precisa fazer antes de começar, mas, ainda assim, é bem possível fazer um plugin que atenda as suas necessidades se você tiver um conhecimento básico de codificação. Vamos falar sobre os passos para se criar um plugin:

1. FTP em seu site: A primeira coisa que você precisa fazer é acessar seu site via FTP usando o programa FTP de sua escolha (um muito utilizado pelos desenvolvedores se chama Nova). Se você não estiver familiarizado com FTP, recomendo que leia sobre isso antes de continuar.

2. Navegue até a pasta de plugins do WordPress: Depois de acessar seu site via FTP, você precisará navegar até a pasta de plugins do WordPress. Essa pasta está quase sempre localizada em /wp-content/plugins.

3. Crie uma nova pasta para seu plugin: Agora que você está na pasta de plugins é hora de criar uma pasta para a sua! Vá em frente e crie uma nova pasta, dando a ela um nome exclusivo usando letras minúsculas e traços, como my-first-plugin. Depois de fazer isso, insira sua nova pasta e vá para a próxima etapa.

4. Crie o arquivo PHP principal para seu plugin: Em seguida, você precisará criar o arquivo principal para o seu plugin. Para fazer isso, crie um arquivo PHP dentro de sua nova pasta de plugins e dê a ele o mesmo nome, como my-first-plugin.php. Depois de fazer isso, abra o arquivo principal do seu plugin e prepare-se para fazer algumas edições.

5. Configure as informações do seu plugin: Por fim, copie e cole as informações do plugin abaixo em seu arquivo de plugin principal. Certifique-se de editar os detalhes como o nome do plugin e o URL do plugin, pois eles pertencem ao seu plugin.

//my-first-plugin.php
<?php
/**
 * Plugin Name: Meu primeiro plugin
 * Plugin URI: https://marriedgames.com.br/my-first-plugin
 * Description: Coloque aqui a descrição que for adequada para ele, como, por exemplo, a função que ele fará no seu site.
 * Version: 1.0
 * Author: Paulo Fabris
 * Author URI: https://marriedgames.com.br
 */

É isso! Você acabou de concluir o número mínimo de etapas necessárias para criar um plugin do WordPress. Agora você pode ativá-lo no administrador do WordPress e apreciar todo o sue trabalho! Mas, e agora? Neste ponto, você provavelmente está se perguntando o que este plugin faz, não é? Então… ele não faz nada! Eu disse que mostraria como criar um plugin, não disse que mostraria como criar um plugin que faça alguma função, afinal, para isso é preciso uma boa base de conhecimento em WordPress e conhecimento de codificação.

Brincadeiras à parte, o objetivo deste post é ilustrar o quão simples é começar a criar plugins do WordPress. Prepare um com as etapas descritas acima e você estará pronto para começar a fazer as coisas acontecerem.

Fazendo seu plugin fazer algo simples

Agora que você tem um plugin, vamos fazê-lo fazer alguma coisa. A maneira mais fácil de fazer as coisas acontecerem no WordPress é com ações e filtros. Vamos explorar isso criando uma ação simples que adiciona uma linha de texto abaixo de todas as postagens em seu site. Copie e cole este código em seu arquivo de plugin principal (abaixo das informações do plugin) e salve-o.

//my-first-plugin.php
<?php
/**
 * Plugin Name: Meu primeiro plugin
 * Plugin URI: https://marriedgames.com.br/my-first-plugin
 * Description: Coloque aqui a descrição que for adequada para ele, como, por exemplo, a função que ele fará no seu site.
 * Version: 1.0
 * Author: Paulo Fabris
 * Author URI: https://marriedgames.com.br
 */

add_action( 'the_content', 'my_thank_you_text' );

function my_thank_you_text ( $content ) {
    return $content .= '<p>Thank you for reading!</p>';
}

Este código se conecta à ação “the_content” que é acionada quando o WordPress renderiza o conteúdo do post para o seu site. Quando essa ação for acionada, o WordPress chamará nossa função “my_thank_you_text” definida abaixo da chamada “add_action”. Esse código é algo simples que lhe dará um simples texto no seu WordPress, apenas de brincadeira.

Mas e se você quiser criar um plugin que faça mais do que realizar uma tarefa simples? Se você vai começar a codificar seus próprios plugins, é interessante que você se familiarize com a forma como as ações e filtros funcionam e quais estão disponíveis para você usar. Existem tantas funções básicas no sistema e para que você saiba o que cada uma delas é e faz, o ideal é estudar a documentação do próprio WordPress na página do Codex.

O que são block pattern no WordPress?

Os padrões de bloco do WordPress (block pattern) são uma coleção de elementos de design pré-fabricados que você pode usar para criar layouts de conteúdo personalizados mais rapidamente. O WordPress vem com um editor intuitivo comumente conhecido como editor de blocos. Ele permite que os usuários criem belos layouts para suas postagens e páginas usando blocos para elementos de conteúdo comuns.

No entanto, nem todos os usuários do WordPress são designers ou querem gastar tempo criando layouts toda vez que precisam criar um post ou página, então os Padrões de bloco fornecem uma solução fácil para esse problema. O WordPress agora vem com vários padrões de blocos úteis por padrão.

Os temas populares do WordPress também fornecem seus próprios padrões que você pode usar ao escrever conteúdo, esses padrões incluem itens como layouts de várias colunas pré-criadas, padrões de mídia e texto, padrões de call-to-action, cabeçalhos, botões e muito mais. Você pode encontrar ainda mais padrões no site do WordPress e pode até criar e compartilhar seus próprios padrões também.

Criando padrões de bloco do WordPress manualmente

Você também pode criar padrões de bloco manualmente e adicioná-los ao seu tema WordPress ou plugin de trechos personalizados. Basta criar um novo post ou página no WordPress e, na área de conteúdo, use blocos para criar um layout personalizado ou uma coleção de blocos que você deseja salvar como um padrão.

Depois disso, mude para o modo Editor de código e copie todo o conteúdo que você vê no editor de código. Em seguida, abra um editor de texto simples como o Bloco de Notas e cole esse código nele. Você precisará dele na próxima etapa. Agora você está pronto para registrar seus blocos como um padrão.

Para fazer isso, basta copiar e colar o seguinte código no arquivo functions.php do seu tema ou em um plugin específico do site.

//Meu Padrão de Bloco
function wpb_my_block_patterns() {
    register_block_pattern(
        'my-plugin/my-awesome-pattern',
        array(
            'title'       => __( 'Coloque o titulo do Padrão de Bloco Aqui'),
            'description' => _x( 'Escreva aqui uma descrição do que o seu padrão de bloco faz ou porque você o criou' ),
            'categories'  => array( 'columns' ),
            'content'     => ' Seu código de conteúdo de bloco vai aqui'
            )
    );
}
add_action( 'init', 'wpb_my_block_patterns' );

Agora copie e cole os dados de blocos brutos que você copiou anteriormente como o valor para o parâmetro content. Em outras palavras, você precisará substituir o texto que diz “Seu código de conteúdo de bloco vai aqui” pelo seu código de bloco. Certifique-se de deixar as aspas simples ao redor do texto no lugar. Por fim, não se esqueça de alterar o título e a descrição para seus próprios e salvar suas alterações. Agora você pode visitar seu site e editar e postar ou página e então você poderá ver seu padrão de bloco recém-registrado no insersor de bloco.

Habilidades essenciais de desenvolvimento de Plugins

A experiência mais óbvia que você precisa como web designer WordPress e desenvolvimento de plugins é a proficiência nas principais linguagens de programação e noções de web design, incluindo HTML, CSS, JavaScript, PHP, SQL e muitas outras. Esse conhecimento técnico servirá como base de qualquer trabalho com o qual um desenvolvedor do WordPress se envolva bem como para outras coisas que você possa fazer na web.

HTML

O HTML (Hypertext Markup Language) define a estrutura de um site WordPress. É uma linguagem principal do desenvolvimento web em geral, e a experiência nela implica uma compreensão de como uma página web é composta. Mesmo que você use um editor “o que você vê é o que você tem” ou um sistema de gerenciamento de conteúdo, conhecer HTML ainda é uma habilidade essencial, pois dá aos desenvolvedores controle sobre seu trabalho e oferece uma abordagem estruturada para modelagem de páginas da web.

CSS

Outra pedra angular do conteúdo da web é Cascading Style Sheets, ou CSS. Em poucas palavras, ele define a aparência visual de um site WordPress. Os desenvolvedores web front-end (a parte visual do site) devem entendê-lo, embora não seja uma alta prioridade se você trabalhar no back-end (a parte do código do site).

JavaScript

JavaScript controla os elementos interativos de um site. Trabalhando ao lado de HTML e CSS, essa linguagem se destaca no desenvolvimento front-end e serve como o principal componente de aplicativos da web para adicionar comportamento interativo dinâmico aos aplicativos da web. Devido ao enorme crescimento em popularidade nos últimos anos, existem várias estruturas e bibliotecas JavaScript que também podem ser usadas para desenvolvimento de back-end, tornando essa uma ótima habilidade na caixa de ferramentas do desenvolvedor web.

SQL

Significa Structured Query Language e é responsável pela comunicação com bancos de dados em aplicações web. Essa parte é essencial para controlar os dados armazenados no seu site, como o nome de usuário, senhas, dados pessoais dos membros de uma rede social construída com o BuddyPress. É um conceito crucial para entender como desenvolvedor de back-end.

PHP

O PHP é uma linguagem especialmente adequada para desenvolvimento web. O WordPress é construído usando-o, entre outras plataformas populares. Ele permite que os desenvolvedores conectem a interface do usuário com a parte do banco de dados do aplicativo, o que torna o PHP parte integrante de um aplicativo da web.

Plataforma WordPress

Saber não apenas como instalar e configurar um site WordPress, mas como fazê-lo do zero usando recursos como temas e plugins WordPress é de grande importância para desenvolvedores que devem oferecer soluções elegantes e personalizadas para os clientes.

Outros Cursos de Desenvolvimento de Plugins

• Desenvolvimento Web Completo: O que é o PHP? Como funciona um servidor? Diferenças entre Front-End/Back-End e diversos outros conceitos para você entrar com tudo no curso;
• Curso Infraestrutura Web: Aprenda softwares e tecnologias essenciais e atuais na área de infraestrutura para Web;
• Curso Full-Stack Completo: Além de dominar as tecnologias mais poderosas da atualidade, irá desenvolver outras habilidades como CSS 3, Python, MySQL e muito mais;
• Curso de Lógica de Programação: Aprenda a pensar e agir como um programador e crie sistemas inteligentes e robustos;
• Curso JavaScript Completo: Domine a linguagem mais popular de todos os tempos, manipule JavaScript da forma mais pura;
• Curso de Design para Web: Domine o Front-End e aprenda a criar seus próprios design para web;
• Curso de Inglês para Programadores: Muitas vezes, um termo em programação não quer dizer exatamente o mesmo que a sua tradução literal. Aprenda os principais termos da programação e entenda o seu significado;

Criar plugins do WordPress é extremamente recompensador e uma ótima maneira de conseguir um conhecimento mais profundo de como o WordPress funciona. Se você fizer isso e surgir um plugin realmente útil, não se esqueça de que você pode distribuí-lo gratuitamente para outras pessoas através do diretório de plugins do WordPress ou vendê-lo.

FAQ Rápido de Desenvolvimento de Plugins

Você já criou seu primeiro plugin ou planeja criar um em breve? Se sim, deixe sua opinião sobre isso nos comentários abaixo. Aproveite também para ler mais sobre WordPress no nosso site.