Introdução prática para iniciantes: aprenda a desenvolver plugins do WordPress passo a passo

Ambiente de desenvolvimento de plugins para WordPress e preparações básicas

Antes de começar a escrever o código, você precisa de um ambiente de desenvolvimento local adequado. Isso geralmente inclui um servidor local (como XAMPP, MAMP ou Local by Flywheel), um editor de código (como VS Code ou PHPStorm) e uma instalação do WordPress para testes. Certifique-se de que a versão do PHP que você está usando esteja em conformidade com a versão recomendada oficialmente pelo WordPress.

O núcleo de um plugin para WordPress é uma parte que se encontra…/wp-content/plugins/Os arquivos localizados dentro deste diretório são os componentes do seu plugin. O nome deste diretório deve ser o seu identificador de plugin; é recomendado que seja composto por letras minúsculas, números e hifens (-). Dentro deste diretório, deve haver um arquivo PHP principal com o mesmo nome que o diretório. Por exemplo:my-first-plugin.phpEste arquivo é o ponto de entrada do plugin e contém as informações metadadas do mesmo.

Crie o seu primeiro arquivo de plugin.

Vamos começar criando o plugin mais simples possível, que exibirá uma mensagem de boas-vindas no painel de administração do site.

Leitura recomendada Análise aprofundada do plugin WooCommerce: um guia completo, desde a configuração inicial até a personalização avançada.。

A escrita de anotações no cabeçalho do plug-in.

Cada plugin do WordPress deve começar com um comentário de cabeçalho específico. O WordPress lê essas informações para identificar e exibir os plugins. No seu diretório de plugins (por exemplo…my-first-pluginNesse processo, você deve criar o arquivo principal (o “main file”).my-first-plugin.phpE escreva o seguinte código:

Hospedagem para sites WordPress da UltraHost

Garantia de reembolso em 30 dias, largura de banda ilimitada e banco de dados, proteção contra DDoS gratuita; desconto de 50% na compra de 3 anos (planos de 4 TB a 10 TB).

página de acesso

<?php
/**
 * Plugin Name: 我的第一个WordPress插件
 * Plugin URI:  https://example.com/my-first-plugin
 * Description: 这是一个用于学习WordPress插件开发的入门插件，将在管理后台添加一个欢迎提示。
 * Version:     1.0.0
 * Author:      你的名字
 * Author URI:  https://example.com
 * License:     GPL v2 or later
 * Text Domain: my-first-plugin
 */

Após salvar o arquivo, faça login no painel administrativo do seu WordPress e vá para a página “Plugins”. Você deve ver “Meu primeiro plugin WordPress” na lista de plugins. Nesse momento, você pode ativá-lo, embora ele ainda não tenha nenhuma funcionalidade.

Adicionar a primeira funcionalidade ao plugin.

Agora, vamos adicionar uma função simples a este plugin: exibir uma notificação de gerenciamento personalizada no topo do painel de administração. Vamos usar as funcionalidades do WordPress para isso.admin_noticesGancho.

No arquivo principalmy-first-plugin.phpAbaixo dos comentários de cabeça, adicione o seguinte código:

// 在管理后台添加一个欢迎提示
function my_first_plugin_admin_notice() {
    ?>
    <div class="notice notice-success is-dismissible">
        <p>Bem-vindo ao “Meu Primeiro Plugin para WordPress”! Você ativou com sucesso este plugin.</p>
    </div>
    &lt;?php
}
add_action( &#039;admin_notices&#039;, &#039;my_first_plugin_admin_notice&#039; );

Este código define uma estrutura chamada…my_first_plugin_admin_noticeA função em questão gera um trecho de HTML que forma uma caixa de alerta de sucesso com opção de fechamento.add_action()A função “monta” essa função personalizada no WordPress.admin_noticesEssa ação está ativada. Salve o arquivo e atualize o backend do WordPress; então, você verá essa mensagem de boas-vindas em verde no topo da página.

Leitura recomendada Tutorial prático de criação de websites: processo de desenvolvimento completo do zero até a publicação online e guia de seleção de tecnologias.。

Compreender o mecanismo central dos plugins do WordPress: ganchos (hooks) e filtros (filters)

O núcleo do desenvolvimento de plugins para o WordPress reside na interação com o próprio core do WordPress, o que é realizado principalmente através de um mecanismo chamado “ganchos” (hooks). Existem dois tipos de ganchos: ações (actions) e filtros (filters).

Uso dos ganchos de ação (Action Hooks)

Os ganchos de ação (action hooks) permitem que você insira código personalizado em momentos específicos da execução do WordPress, exatamente como usamos há pouco.admin_noticesOutro exemplo comum é…initO “hook” é um mecanismo que é acionado durante a inicialização do WordPress e é frequentemente utilizado para registrar tipos de artigos ou categorias personalizados.

Por exemplo, podemos definir um valor de opção durante a inicialização do plugin:

hospedagem compartilhada da hosting.com

Alto desempenho com CPUs AMD EPYC, armazenamento SSD NVMe e LiteSpeed, suporte interno especializado 24 horas por dia, 7 dias por semana, medidas de segurança avançadas, incluindo SSL, força bruta, malware e proteção contra DDoS, economia de até 73%

página de acesso

function my_first_plugin_set_default_option() {
    // 如果选项不存在，则添加它
    if ( false === get_option( 'my_first_plugin_greeting' ) ) {
        add_option( 'my_first_plugin_greeting', 'Hello from my plugin!' );
    }
}
add_action( 'init', 'my_first_plugin_set_default_option' );

Uso dos ganchos de filtro (Filter Hooks)

Os ganchos (hooks) dos filtros permitem que você modifique os dados transmitidos no processo. Por exemplo,the_contentOs filtros permitem que você modifique a forma como o texto principal de um artigo é exibido. Podemos usá-los para adicionar automaticamente uma informação de copyright no final de cada artigo.

function my_first_plugin_add_copyright( $content ) {
    // 仅对主循环中的单篇文章生效
    if ( is_single() && in_the_loop() && is_main_query() ) {
        $copyright = '<p><em>Este texto está protegido por direitos autorais. Por favor, indique a fonte ao reproduzi-lo.</em></p>';
        $content .= $copyright;
    }
    return $content;
}
add_filter( 'the_content', 'my_first_plugin_add_copyright' );

Neste exemplo, a função…my_first_plugin_add_copyrightReceber o original$contentApós a avaliação de condições (para garantir que a alteração só seja efetiva na página de um único artigo), foi adicionado um trecho de HTML no final do mesmo. Por fim, é necessário garantir que o conteúdo modificado seja exibido corretamente.$contentVoltar.

Construindo plugins mais complexos: Códigos resumidos e páginas de configuração

Um plugin completo geralmente precisa fornecer interação no front-end (como códigos curtos) e configurações no back-end (como páginas de ajustes).

Leitura recomendada Uma ferramenta poderosa para otimização de mecanismos de busca: construir uma estratégia de SEO para um site WordPress do zero.。

Criar códigos curtos personalizados

Códigos curtos permitem que os usuários utilizem etiquetas simples (como…)[my_greeting]Insira funções de plugins em artigos ou páginas. Registre um código curto para usar.add_shortcode()Função.

// 注册一个简单的问候短代码
function my_first_plugin_greeting_shortcode( $atts ) {
    // 使用 shortcode_atts 定义默认属性并合并用户输入
    $attributes = shortcode_atts( array(
        'name' => '访客',
    ), $atts );

// 获取我们之前设置的选项
    $greeting_text = get_option( 'my_first_plugin_greeting', 'Hello' );

// 生成输出
    $output = '<div class="my-plugin-greeting">';
    $output .= esc_html( $greeting_text ) . ', ' . esc_html( $attributes['name'] ) . '!';
    $output .= '</div>';

return $output;
}
add_shortcode( 'my_greeting', 'my_first_plugin_greeting_shortcode' );

Agora, os usuários podem inserir conteúdo no editor.[my_greeting name="张三"]Nesse caso, a parte frontal do aplicativo (front-end) exibirá a mensagem “Olá, do meu plugin! Olá, Zhang San!”.

Hospedagem Compartilhada InterServer

Hospedagem compartilhada $2.50 USD por mês, primeiro mês $0.1 USD código promocional tryinterserver, 461 scripts de aplicativos em nuvem, instalação com um clique.

página de acesso

Página de configuração dos plugins

Para que os usuários possam personalizar suas saudações, precisamos adicionar uma página de configurações no painel de administração. Isso envolve a criação de uma página de menu principal ou de submenu, bem como o processamento do salvamento das opções contidas nos formulários.

// 在后台“设置”菜单下添加子菜单页
function my_first_plugin_add_settings_page() {
    add_options_page(
        '我的插件设置',          // 页面标题
        '我的第一个插件',        // 菜单标题
        'manage_options',       // 所需权限
        'my-first-plugin',      // 菜单slug
        'my_first_plugin_render_settings_page' // 回调函数，用于输出页面内容
    );
}
add_action( 'admin_menu', 'my_first_plugin_add_settings_page' );

// 渲染设置页面的HTML
function my_first_plugin_render_settings_page() {
    ?>
    <div class="wrap">
        <h1>As configurações do meu primeiro plugin</h1>
        <form method="post" action="/pt/options.php/" data-trp-original-action="options.php">
            <?php
            settings_fields( 'my_first_plugin_settings_group' );
            do_settings_sections( 'my-first-plugin' );
            submit_button();
            ?>
        <input type="hidden" name="trp-form-language" value="pt"/></form>
    </div>
    &lt;?php
}

// 注册设置、区域和字段
function my_first_plugin_register_settings() {
    register_setting(
        &#039;my_first_plugin_settings_group&#039;, // 设置组名
        &#039;my_first_plugin_greeting&#039;        // 选项名
    );

add_settings_section(
        &#039;my_first_plugin_main_section&#039;,    // 区域ID
        &#039;问候语设置&#039;,                     // 区域标题
        null,                            // 区域回调函数（可为空）
        &#039;my-first-plugin&#039;                // 页面slug
    );

add_settings_field(
        &#039;greeting_text_field&#039;,            // 字段ID
        &#039;问候语文本&#039;,                     // 字段标题
        &#039;my_first_plugin_greeting_field_callback&#039;, // 字段HTML的回调函数
        &#039;my-first-plugin&#039;,                // 页面slug
        &#039;my_first_plugin_main_section&#039;    // 所属区域ID
    );
}
add_action( &#039;admin_init&#039;, &#039;my_first_plugin_register_settings&#039; );

// 渲染问候语输入字段
function my_first_plugin_greeting_field_callback() {
    $greeting = get_option( &#039;my_first_plugin_greeting&#039; );
    echo &#039;<input type="text" name="my_first_plugin_greeting" value="' . esc_attr( $greeting ) . '" class="regular-text" />';
}

Este código cria uma página de configurações padrão para o WordPress. Quando o usuário altera a saudação na página de configurações e salva as alterações, o código curto (shortcode) criado anteriormente passa a usar o novo texto da saudação.

resumos

Através deste tutorial, completamos um plugin para o WordPress com funcionalidades básicas, partindo do zero. Você aprendeu como criar a estrutura dos arquivos do plugin, escrever as informações de cabeça do plugin, utilizar ganchos de ação (action hooks) para enviar notificações no backend, modificar o conteúdo com filtros, criar códigos curtos (shortcodes) para serem chamados no frontend, e construir uma página de configurações completa para gerenciar as opções do plugin. Estas são as habilidades mais essenciais e fundamentais no desenvolvimento de plugins para o WordPress. Ao dominar essas técnicas, você poderá consultar o manual oficial do WordPress e aprofundar seu conhecimento sobre APIs, como tabelas de banco de dados personalizadas, pontos de extremidade do REST API e tratamento de AJAX, para desenvolver plugins mais poderosos e profissionais.

Perguntas frequentes Perguntas frequentes

Quais conhecimentos em linguagens de programação são necessários para desenvolver plugins para o WordPress?

O desenvolvimento de plugins para o WordPress exige principalmente conhecimentos da linguagem PHP, já que o próprio núcleo do WordPress é escrito em PHP. Além disso, é necessário ter familiaridade com HTML, CSS e JavaScript básico para criar a interface gráfica e a lógica de interação do plugin. Um conhecimento básico de SQL também é útil para lidar com operações de dados mais complexas.

Como depurar o meu plugin do WordPress?

Primeiro, certifique-se de que em seu…wp-config.phpO ficheiro foi aberto.WP_DEBUGEste modo exibirá os erros e avisos do PHP na tela. Em segundo lugar, é possível utilizar…error_log()A função grava as informações de depuração no log de erros do servidor. Para um depuramento mais avançado, você pode considerar usar ferramentas de depuração específicas para PHP, como o Xdebug, ou instalar plugins de depuração para o WordPress para ajudar a identificar problemas.

Como posso publicar o plugin que desenvolvi no diretório oficial de plugins do WordPress?

Você precisa acessar o WordPress.org e criar uma conta de desenvolvedor. Em seguida, use o ferramenta Subversion (SVN) para enviar o código do seu plugin para o repositório de código oficial que lhe for atribuído. O seu plugin deve seguir a licença GPL, e a qualidade do código, a segurança e a documentação devem atender a determinados padrões de revisão. Após a aprovação da revisão, o seu plugin será exibido no diretório oficial para que os usuários possam baixá-lo.

Como os arquivos de CSS e JavaScript do lado front-end do plugin devem ser carregados corretamente?

Para evitar conflitos e garantir o desempenho, não se deve introduzir recursos diretamente nos arquivos de template. O método correto é usar…wp_enqueue_style()ewp_enqueue_script()Funções. Para os recursos do backend de gestão, elas devem ser montadas (acessadas) em um local apropriado do sistema.admin_enqueue_scriptsGancho; no que diz respeito aos recursos do front-end do site, eles devem ser montados (ou vinculados) apropriadamente.wp_enqueue_scriptsGanchos (hooks). Isso garante que as dependências estejam corretas e que o mesmo arquivo não seja carregado repetidamente.