Guia de desenvolvimento de plugins para o WooCommerce: Construa suas próprias funcionalidades de comércio eletrônico do zero

Preparação e configuração do ambiente

Antes de começar a escrever a primeira linha de código, você precisa preparar um ambiente de desenvolvimento seguro e profissional. Isso não só melhorará sua eficiência de desenvolvimento, mas também garantirá que o processo de criação dos seus plugins seja estável e confiável.

Criar um ambiente de desenvolvimento local

Nós recomendamos fortemente o uso de um ambiente de desenvolvimento local para a criação de plugins. Isso permite que você faça experimentos e ajustes sem afetar o site online. A escolha mais popular é utilizar…Local、XAMPPouMAMPAmbientes de integração. Esses ferramentas configurarão automaticamente o PHP, o MySQL e o servidor web para você. Certifique-se de que seu ambiente atende aos requisitos mínimos do WooCommerce: a versão do PHP deve ser 7.4 ou superior, e a versão do MySQL deve ser 5.7 ou superior, ou MariaDB 10.3 ou superior. Após o ambiente estar pronto, instale um novo WordPress e ative a versão mais recente do plugin WooCommerce.

Criar arquivos de base para um plugin

Seu plugin começará a partir de um arquivo principal. No WordPress…wp-content/pluginsNo diretório, crie uma nova pasta, por exemplo…my-custom-woocommerceNeste diretório, crie um arquivo principal do plugin, que geralmente é nomeado comomy-custom-woocommerce.phpEste arquivo é a entrada para o seu plugin, e as notas no cabeçalho são de extrema importância, pois elas informam ao WordPress como reconhecer o seu plugin.

Leitura recomendada Desenvolvimento de plugins para WordPress: Construindo plugins com funcionalidades personalizadas do zero。

<?php
/**
 * Plugin Name: My Custom WooCommerce Features
 * Plugin URI:  https://yourwebsite.com/
 * Description: 为WooCommerce添加自定义功能，包括产品额外字段和结账流程优化。
 * Version:     1.0.0
 * Author:      Your Name
 * License:     GPL v2 or later
 * Text Domain: my-custom-wc
 */

Este comentário de cabeça define as informações exibidas pelo plugin na interface de administração do WordPress. Por favor, certifique-se de…Text DomainDefina-o como uma string única para facilitar as traduções internacionais subsequentes.

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

Compreender o mecanismo de extensões (plugins) central do WooCommerce

A força do WooCommerce reside em sua arquitetura altamente extensível, que é alcançada principalmente através de Ganchos de Ação (Action Hooks), Ganchos de Filtro (Filter Hooks) e reescrita de templates.

Utilizar ganchos de ação e ganchos de filtragem.

Os “ganchos” (Hooks) são a pedra fundamental das extensões para o WordPress e o WooCommerce. Os ganchos de ação (Action Hooks) permitem que você insira o seu próprio código em momentos específicos para executar funções. Por exemplo, você pode usar isso após um usuário fazer um pedido.woocommerce_thankyouO “gancho” (hook) permite enviar uma notificação personalizada. Já os “ganchos de filtragem” (filter hooks) permitem que você “modifique” os dados, alterando seus valores antes que sejam utilizados ou exibidos. Por exemplo, você pode usar esses recursos para…woocommerce_product_get_priceOs ganchos de filtragem permitem ajustar dinamicamente os preços dos produtos.

A sintaxe básica para adicionar uma ação ou um filtro é a seguinte:

add_action( 'hook_name', 'your_callback_function', priority, accepted_args );
add_filter( 'hook_name', 'your_callback_function', priority, accepted_args );

Você precisa dehook_nameSubstitua por ganchos (hooks) específicos e, em seguida,your_callback_functionSubstitua por o nome da função que você mesmo definiu.

Leitura recomendada Do Zero: Os Passos Fundamentais e as Melhores Práticas para Desenvolver Plugins para o WordPress。

Reescrever o arquivo de template.

Quando é necessário modificar a exibição do frontend do WooCommerce (como as páginas de produtos ou o carrinho de compras), modificar diretamente os arquivos de template do plugin é uma prática incorreta, pois as alterações feitas serão substituídas com as novas versões do plugin. A maneira correta de fazer isso é através da reescrita dos templates. Você deve extrair os arquivos de template originais do WooCommerce e, em seguida, modificar esses arquivos conforme necessário.plugins/woocommerce/templates/Copie o conteúdo do diretório para o diretório de seus temas.your-theme/woocommerce/No caminho correspondente, modifique essa cópia. O WooCommerce carregará prioritariamente os arquivos de template contidos no tema. Esta é a prática padrão para personalizar a aparência e o layout do site.

Desenvolver módulos de funcionalidades personalizadas

Agora, vamos praticar o desenvolvimento de plugins com dois requisitos comuns: adicionar campos personalizados a um produto e modificar a página de pagamento.

Adicionar campos de gestão ao produto

Suponha que você queira adicionar um campo “Número do Fabricante” para cada produto. Primeiro, você precisa exibir esse campo na página de edição dos dados do produto no backend. Isso pode ser feito através de:woocommerce_product_options_general_product_dataIsso é realizado através de ganchos de ação (action hooks).

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

add_action( 'woocommerce_product_options_general_product_data', 'add_custom_product_field' );
function add_custom_product_field() {
    woocommerce_wp_text_input( array(
        'id'          => '_manufacturer_part_number',
        'label'       => __('制造商编号', 'my-custom-wc'),
        'placeholder' => '例如：MPN-12345',
        'desc_tip'    => true,
        'description' => __('产品的唯一制造商部件号。', 'my-custom-wc'),
    ) );
}

Após adicionar os campos, você precisa usar…woocommerce_process_product_metaGancho para salvar os valores inseridos pelo usuário.

add_action( 'woocommerce_process_product_meta', 'save_custom_product_field' );
function save_custom_product_field( $post_id ) {
    $product = wc_get_product( $post_id );
    $custom_field_value = isset( $_POST['_manufacturer_part_number'] ) ? sanitize_text_field( $_POST['_manufacturer_part_number'] ) : '';
    $product->update_meta_data( '_manufacturer_part_number', $custom_field_value );
    $product->save();
}

Aqui, utilizamos os objetos CRUD do WooCommerce (como…)WC_Product) deupdate_meta_dataesaveÉ uma maneira de armazenar dados, e é o método recomendado para o desenvolvimento moderno de lojas online com o sistema WooCommerce.

Exibir campos personalizados no frontend

Após salvar os dados, você provavelmente desejará exibir essa informação no lado front-end da página do produto. Podemos utilizar isso para…woocommerce_product_additional_information_tab_titleewoocommerce_product_additional_information_tab_contentFiltro de ganchos; adicione-o à página de “Informações Adicionais”.

Leitura recomendada Guia completo para o desenvolvimento de plugins do WordPress: do iniciante ao especialista na criação de plugins funcionais.。

add_filter( 'woocommerce_product_additional_information_tab_title', 'add_custom_field_to_tab_title' );
function add_custom_field_to_tab_title( $title ) {
    // Aqui, podemos modificar o título da guia, mas usámo-lo principalmente para garantir que o conteúdo é carregado
    return $title;
}

add_action( 'woocommerce_product_additional_information_tab_content', 'display_custom_field_on_product_page' );
function display_custom_field_on_product_page() {
    global $product;
    $mpn = $product->get_meta( '_manufacturer_part_number' );
    if ( $mpn ) {
        echo ' <p>Número de peça do fabricante: ' . $mpn . '</p>';
    }
}'<p><strong>'\n' . esc_html__( 'Número do fabricante:', 'my-custom-wc' ) . '</strong> '`. esc_html($mpn)`.'</p>';
    }
}

Processo de pagamento personalizado

Outra solicitação comum é adicionar uma caixa de seleção personalizada na página de pagamento, como por exemplo “Deseja assinar a newsletter?”. Podemos usar isso para coletar essa informação dos usuários.woocommerce_review_order_before_submitO campo é adicionado antes do botão de envio.

add_action( 'woocommerce_review_order_before_submit', 'add_checkout_custom_checkbox' );
function add_checkout_custom_checkbox() {
    woocommerce_form_field( 'subscribe_to_newsletter', array(
        'type'  => 'checkbox',
        'class' => array('form-row-wide'),
        'label' => __('是的，我希望订阅产品新闻和优惠信息。', 'my-custom-wc'),
    ), false );
}

Em seguida, precisamos verificar e processar esse campo. Utilizando…woocommerce_checkout_processUse o gancho para realizar a validação.woocommerce_checkout_update_order_metaO “gancho” (hook) salva os dados no pedido (order).

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

add_action( 'woocommerce_checkout_process', 'validate_custom_checkout_field' );
function validate_custom_checkout_field() {
    // 这里可以根据业务逻辑添加验证，例如在某些条件下必须勾选
    // if ( ! $_POST['subscribe_to_newsletter'] ) {
    //     wc_add_notice( __( '请勾选订阅框以继续。', 'my-custom-wc' ), 'error' );
    // }
}

add_action( 'woocommerce_checkout_update_order_meta', 'save_custom_checkout_field' );
function save_custom_checkout_field( $order_id ) {
    $value = isset( $_POST['subscribe_to_newsletter'] ) && $_POST['subscribe_to_newsletter'] ? 'yes' : 'no';
    update_post_meta( $order_id, '_subscribe_to_newsletter', sanitize_text_field( $value ) );
}

Teste, otimização e lançamento de plugins

Após a conclusão do desenvolvimento, testes abrangentes são de extrema importância, pois garantem a estabilidade e a qualidade profissional do plugin.

Realizar um teste de funcionalidade abrangente.

Você precisa simular cenários reais de uso do usuário para realizar os testes. Crie um pedido de teste e verifique se os campos adicionados (como o número do fabricante) são exibidos corretamente na página do produto no frontend, e se as caixas de seleção inseridas durante o processo de pagamento são salvadas corretamente nos dados do pedido. Na página de detalhes do pedido no backend do WordPress, você deve conseguir visualizar as informações personalizadas que foram salvadas. Além disso, é essencial testar a compatibilidade com as funcionalidades existentes do WooCommerce, com outros plugins populares (como gateways de pagamento e sistemas de cálculo de frete), bem como com diferentes temas do WordPress. Realizar testes de responsividade em vários dispositivos (celulares, tablets e computadores de mesa) também é um passo indispensável.

Otimização de desempenho e considerações de segurança

Em termos de desempenho, certifique-se de que o seu código é carregado apenas quando necessário. Por exemplo, o código de gestão de back-end deve ser carregado apenas quandois_admin()O código relacionado à parte frontal do site é carregado sob determinadas condições; o oposto acontece com o código da parte posterior do site. Para consultas ao banco de dados que podem ser executadas com frequência, considere o uso de cache ou garanta que essas consultas sejam otimizadas. A segurança é de extrema importância: todas as entradas fornecidas pelos usuários devem ser purificadas e verificadas. Utilize as funções disponíveis no WordPress e no WooCommerce.sanitize_text_field(), esc_html(), wc_clean()Ao exibir qualquer dado dinâmico no front-end, é necessário realizar a escape desses dados para evitar ataques de tipo Cross-Site Scripting (XSS).

Preparando a versão final para publicação.

Antes de publicar, certifique-se de que o seu código está em conformidade com os padrões de codificação do WordPress. Use ferramentas como…PHP_CodeSnifferVerifique de acordo com o conjunto de regras padrão do WordPress. Melhore o seureadme.txtArquivo: Descreva em detalhes as funcionalidades do plugin, os passos de instalação, as dúvidas mais comuns e capturas de tela de uso. Considere enviar seu plugin para o diretório oficial de plugins do WordPress, o que pode aumentar significativamente sua visibilidade e credibilidade. Antes de enviar, certifique-se de que você tenha concluído a revisão final do código e esteja preparado para fornecer atualizações e suporte contínuos no futuro.

resumos

O desenvolvimento de plugins para o WooCommerce é um processo que transforma necessidades comerciais específicas em funcionalidades avançadas para lojas online. Ao aprender sistematicamente os mecanismos de extensão do sistema – como ganchos (hooks), reescrita de templates e operações com objetos CRUD – os desenvolvedores podem personalizar cada aspecto do funcionamento da loja de forma segura e eficiente, desde a gestão de produtos até o processo de pagamento. A chave do sucesso reside no seguimento de boas práticas: desenvolver em um ambiente local seguro, escrever código mantível e seguro, realizar testes abrangentes em diferentes cenários e, finalmente, fornecer documentação clara e profissional para os potenciais usuários. Ao dominar essas habilidades essenciais, você será capaz de criar extensões para o WooCommerce que não apenas atendam às necessidades dos clientes, mas também sejam estáveis, profissionais e escaláveis, aumentando assim a competitividade do seu site.

Perguntas frequentes Perguntas frequentes

Quais são os conhecimentos prévios necessários para desenvolver um plugin para o WooCommerce?

Você precisa ter conhecimentos básicos da linguagem de programação PHP e estar familiarizado com os conceitos de programação orientada a objetos. Além disso, é essencial ter uma compreensão clara da arquitetura básica do WordPress (como ganchos, códigos curtos e tipos de artigos personalizados). Conhecimentos em HTML, CSS e JavaScript básico (especialmente jQuery) serão úteis para a personalização da interface do usuário (front-end).

Como encontrar o hook específico do WooCommerce de que preciso?

Os documentos oficiais de desenvolvedores do WooCommerce são o melhor ponto de partida para encontrar os “hooks” (funções de integração), pois contêm um índice detalhado deles. Além disso, você também pode realizar pesquisas diretamente no código-fonte dos plugins do WooCommerce.do_actioneapply_filtersDescubra todos os ganchos (hooks) disponíveis. Muitas comunidades de desenvolvedores e blogs também compilaram listas de ganchos comuns do WooCommerce, que podem servir como referência rápida.

Eu modifiquei o arquivo do plugin, mas por que não vejo nenhuma mudança no site?

Isso geralmente é causado pelo cache. Por favor, verifique e limpe os seguintes caches sequencialmente: o cache de objetos do WordPress (se você estiver usando serviços como Redis ou Memcached), plugins de cache de páginas (como W3 Total Cache ou WP Rocket), o cache do lado do servidor (como OPcache), bem como o cache do seu navegador. Durante o processo de desenvolvimento, é recomendado desativar todos os mecanismos de cache para garantir que as alterações no código sejam aplicadas imediatamente.

Como garantir que meu plugin personalizado seja compatível com futuras atualizações do WooCommerce?

Evitar modificar os arquivos principais do WooCommerce é um princípio fundamental. Insista no uso dos ganchos (hooks), APIs e mecanismos de reescrita de templates fornecidos oficialmente para o desenvolvimento. Acompanhe atentamente o log de atualizações do WooCommerce, especialmente as notificações de desativação (deprecation notices), que informam com antecedência quais funções ou métodos serão removidos em futuras versões. Realize testes de compatibilidade regularmente no ambiente de teste com as versões Beta do WooCommerce, para identificar problemas com antecedência.

É possível criar tabelas de banco de dados personalizadas em plugins para o WooCommerce?

Sim, mas geralmente não é a solução preferida. O WooCommerce e o WordPress oferecem sistemas poderosos de armazenamento de metadados.wp_postmeta, wp_usermeta, wp_commentmetaIsso já é suficiente para a maioria das necessidades de expansão. Somente quando é necessário armazenar dados altamente estruturados, realizar consultas complexas ou lidar com volumes de dados muito grandes, que se considera a criação de tabelas personalizadas. Se isso for realmente necessário, por favor, use-as de forma adequada.dbDelta()Os funções garantem que a criação e atualização da estrutura da tabela sejam realizadas de forma segura.