Sviluppo di plugin per WordPress: dall’approccio iniziale alla maestria: crea il tuo primo plugin funzionale

Perché imparare lo sviluppo di plugin per WordPress?

WordPress, come il sistema di gestione dei contenuti più popolare al mondo, deve la sua notevole flessibilità all’ampia gamma di plugin disponibili. Imparare a sviluppare plugin non solo ti permette di personalizzare le funzionalità del sito in base alle tue esigenze, ma ti aiuta anche a comprendere a fondo l’architettura di base di WordPress, migliorando così le tue competenze tecniche. Inoltre, puoi trasformare le tue idee in prodotti concreti da pubblicare online. Sviluppando plugin personalizzati, hai il controllo totale sulla qualità del codice e puoi garantire la sicurezza del tuo sito, evitando problemi di compatibilità legati all’utilizzo di plugin di terze parti.

Un plugin di base per WordPress è essenzialmente uno o più file PHP situati in una directory specifica; interagisce con il sistema principale di WordPress attraverso l’ampia API fornita da quest’ultimo (come gli “action hooks”, i “filter hooks”, i “shortcodes” e gli “widgets”). Comprendere questo meccanismo è fondamentale per sviluppare con successo qualsiasi plugin.

Preparare l’ambiente di sviluppo e l’infrastruttura di base.

Prima di scrivere la prima riga di codice, è fondamentale creare un buon ambiente di sviluppo. Hai bisogno di un ambiente server locale (come XAMPP, Local by Flywheel o DevKinsta), un editor di codice (come VS Code o PhpStorm), nonché di un’installazione di WordPress per i test.

Si consiglia di leggere Guida definitiva allo sviluppo di plugin per WordPress: padroneggia i principi fondamentali e progetta progetti pratici。

L’ingresso per gli plugin è rappresentato da un file PHP principale. Le note presenti all’inizio di questo file sono fondamentali affinché WordPress possa riconoscere il plugin. Iniziamo quindi creando la struttura di base di un plugin.

UltaHost – Hosting per siti WordPress

Garanzia di rimborso entro 30 giorni, larghezza di banda illimitata e accesso ai database, protezione gratuita contro gli attacchi DDoS; sconto del 50% per l’acquisto di un piano valido per 3 anni (da 3 a 4 TB di spazio di archiviazione).

pagina di accesso

Creare il file principale del plugin

Il file principale di un plugin di solito prende il nome dello stesso plugin. Ad esempio, se creiamo un plugin chiamato “Il mio primo plugin”, il suo file principale può essere chiamato…my-first-plugin.phpQuesto file deve essere posizionato in…/wp-content/plugins/my-first-plugin/All’interno della directory.

La parte iniziale del file deve contenere le note di informazione standard relative ai plugin. Ecco un esempio molto semplice:

<?php
/**
 * Plugin Name:       我的第一个插件
 * 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
 * Domain Path:       /languages
 */

Dopo aver salvato il file, accedi alla pagina “Plugin” nell’interfaccia amministrativa di WordPress. Dovresti vedere il nuovo plugin nell’elenco dei plugin disponibili e poterlo attivare. Al momento non dispone di alcuna funzionalità, ma la struttura di base è già stata creata.

Creare la struttura di directory di base per un plugin

Un plugin con una struttura chiara facilita la manutenzione a lungo termine. Si consiglia di creare i seguenti directory:
* /assets/Utilizzato per archiviare risorse statiche come CSS, JavaScript e immagini.
* /includes/Destinato a contenere i file delle classi PHP principali e i file delle funzioni essenziali.
* /languages/Utilizzato per conservare i file di traduzione internazionalizzati (.po/.mo).

Si consiglia di leggere Il cuore dei principi di Tailwind CSS: sveliamo il funzionamento di questo framework CSS atomico che dà priorità all’efficacia pratica.。

File principalemy-first-plugin.phpDovrebbe essere responsabile soltanto dell’inizializzazione del plugin, ad esempio della definizione di costanti, dell’importazione di altri file, dell’ registrazione di eventi (hook) e simili.

Implementare le funzionalità principali: creare un menu di gestione e le relative pagine.

Una funzione comune dei plugin è quella di aggiungere una pagina di menu di gestione nell’interfaccia di back-end di WordPress. Realizzeremo questo utilizzando l“”API per le pagine di menu” di WordPress.

Aggiungere un menu principale in background.

Dobbiamo utilizzare…add_menu_page()Funzione. Questa funzione viene solitamente utilizzata…admin_menuQuesto “action hook” viene eseguito quando viene attivato. Aggiungiamo il seguente codice nel file principale:

hosting.com Hosting condiviso

Prestazioni elevate con CPU AMD EPYC, storage SSD NVMe e LiteSpeed, supporto interno di esperti 24 ore su 24, 7 giorni su 7, misure di sicurezza avanzate, tra cui SSL, brute force, malware e protezione DDoS, risparmi fino a 73%

pagina di accesso

// 定义在管理员菜单初始化时执行的功能
function mfp_add_admin_menu() {
    add_menu_page(
        '我的插件设置',         // 页面标题
        '我的插件',            // 菜单标题
        'manage_options',      // 所需权限
        'my-first-plugin',     // 菜单slug
        'mfp_display_settings_page', // 用于显示页面内容的回调函数
        'dashicons-admin-generic', // 菜单图标（Dashicon）
        6                      // 菜单位置
    );
}
// 将函数挂载到 `admin_menu` 钩子上
add_action('admin_menu', 'mfp_add_admin_menu');

Creare il contenuto da visualizzare sulla pagina delle impostazioni.

Nel codice sopra,mfp_display_settings_pageSi tratta di una funzione di callback responsabile di generare il contenuto HTML della pagina di configurazione. Dobbiamo definire questa funzione:

// 设置页面的显示内容
function mfp_display_settings_page() {
    // 检查用户权限
    if (!current_user_can('manage_options')) {
        wp_die(__('你没有权限访问此页面。'));
    }
    ?>
    <div class="wrap">
        <h1><?php echo esc_html(get_admin_page_title()); ?></h1>
        <form action="/it/options.php/" method="post" data-trp-original-action="options.php">
            <?php
            // 输出设置字段和安全nonce字段
            settings_fields('mfp_options_group'); // 设置组的名称
            do_settings_sections('my-first-plugin'); // 页面slug
            submit_button('保存设置');
            ?>
        <input type="hidden" name="trp-form-language" value="it"/></form>
    </div>
    &lt;?php
}

Questo codice crea un framework standard per una pagina di configurazione di WordPress, all’interno del quale vengono utilizzati…settings_fields()和do_settings_sections()Si tratta di una funzione che ci permette di utilizzare l’API WordPress Settings per gestire le nostre opzioni. Questo rappresenta il metodo più sicuro e standardizzato per farlo.

Gestire le opzioni degli plugin utilizzando l’API Settings

Trattare direttamente.$_POSTEsistono rischi per la sicurezza dei dati. L’API WordPress Settings ci aiuta nella verifica dei dati, nella gestione della sicurezza e nell’archiviazione delle informazioni, rendendola il metodo preferito per la configurazione degli plugin.

Si consiglia di leggere Guida definitiva agli plugin per WooCommerce: costruire da zero un sito web e-commerce internazionale professionale e indipendente。

Impostazioni di registrazione, campi e sezioni

Abbiamo bisogno di…admin_initInizializziamo le nostre impostazioni all’interno del “hook”. Per prima cosa, utilizziamo…register_setting()Registra un’opzione di configurazione.

function mfp_register_settings() {
    // 注册一个设置：`mfp_options` 是存储在`wp_options`表中的键名
    register_setting(
        'mfp_options_group', // 设置组名，需与`settings_fields()`参数一致
        'mfp_options',       // 选项名
        'mfp_sanitize_options' // 可选：数据清洗回调函数
    );

// 添加一个设置章节
    add_settings_section(
        'mfp_main_section',                // 章节ID
        '主要设置',                         // 章节标题
        'mfp_main_section_callback',       // 章节介绍的回调函数
        'my-first-plugin'                  // 所属页面slug
    );

// 在章节中添加一个文本字段
    add_settings_field(
        'mfp_text_field',                  // 字段ID
        '示例文本',                         // 字段标签
        'mfp_text_field_callback',         // 用于渲染字段HTML的回调函数
        'my-first-plugin',                 // 所属页面slug
        'mfp_main_section'                 // 所属章节ID
    );
}
add_action('admin_init', 'mfp_register_settings');

Definire le funzioni di rendering e pulizia per i campi

Ora dobbiamo definire le varie funzioni di callback utilizzate in precedenza, per generare il codice HTML relativo ai campi da visualizzare e per pulire i dati.

Hosting condiviso InterServer

Hosting condiviso $2,50 USD al mese, primo mese $0,1 USD codice promozionale tryinterserver, 461 script di applicazioni cloud, installazione con un clic.

pagina di accesso

// 主章节的描述文本
function mfp_main_section_callback() {
    echo '<p>Questa è la sezione principale per la configurazione degli plugin.</p>';
}

// 文本字段的HTML输出
function mfp_text_field_callback() {
    // 从数据库获取现有值
    $options = get_option('mfp_options');
    $value = $options['mfp_text_field'] ?? ''; // PHP 7.0+ 空合并运算符
    echo '<input type="text" name="mfp_options[mfp_text_field]" value="' . esc_attr($value) . '" class="regular-text">';
}

// 数据清洗函数（可选但推荐）
function mfp_sanitize_options($input) {
    $sanitized_input = [];
    if (isset($input['mfp_text_field'])) {
        // 对文本字段进行基本的清洗，如去除标签
        $sanitized_input['mfp_text_field'] = sanitize_text_field($input['mfp_text_field']);
    }
    return $sanitized_input;
}

A questo punto, il plugin completo, dotato di una pagina per la configurazione della sicurezza, è pronto per l’uso. Dopo aver attivato il plugin, potrai trovare il menu “I miei plugin” nell’interfaccia di amministrazione di WordPress; cliccandoci, potrai impostare e salvare un’opzione di tipo testo. Tutti i dati vengono memorizzati in modo sicuro tramite l’API di WordPress.wp_optionsNella tabella.

Aggiungere funzionalità front-end al plugin: creare codice breve.

Le funzionalità di back-end sono fondamentali, ma i plugin di solito devono anche influenzare l’aspetto visivo del sito web (l’interfaccia front-end). Creare dei “shortcode” rappresenta un ottimo modo per integrare le funzionalità di un plugin all’interno di articoli, pagine o widget.

Registra un semplice codice breve.

Ci registriamo con un nome che è…[my_greeting]Questo è il codice breve utilizzato per visualizzare un saluto sul lato front-end.add_shortcode()Funzione.

Aggiungere nel file principale o in un file funzionale dedicato:

// 注册短代码
function mfp_greeting_shortcode($atts, $content = null) {
    // 使用shortcode_atts设置默认属性并合并用户输入
    $atts = shortcode_atts(
        array(
            'name' => '访客', // 默认值
        ),
        $atts,
        'my_greeting' // 短代码名称
    );

// 获取插件选项中存储的文本
    $options = get_option('mfp_options');
    $custom_text = $options['mfp_text_field'] ?? '';

// 构造输出
    $output = '<div class="mfp-greeting">'$output = '<p>Ciao, '. esc_html($atts['name'])'. ‘! Benvenuto/a sul nostro sito.</p>';
    if (!empty($custom_text)) {
        $output .= '<p><strong>Messaggio personalizzato:</strong>'`. esc_html($custom_text)`.'</p>'$output = '</div>';

// 返回输出内容，而不是直接echo
    return $output;
}
add_shortcode('my_greeting', 'mfp_greeting_shortcode');

Ora, gli utenti possono inserire contenuti nell’editor di articoli.[my_greeting name="张三"]Il front-end renderizza quindi messaggi di saluto personalizzati; inoltre, se nel back-end è stato impostato un “testo di esempio”, anche questo verrà visualizzato. Questo approccio consente di collegare in modo efficace le impostazioni del back-end con l’output del front-end.

Riassumendo

Attraverso i passaggi descritti, abbiamo completato un plugin per WordPress con funzionalità complete. Abbiamo iniziato da zero, creando i file di base e la struttura del plugin, utilizzando…add_menu_page()È stato creato un sito di configurazione backend sicuro utilizzando l’API Settings, e tale configurazione viene condivisa tramite…add_shortcode()È stata realizzata l’uscita delle funzionalità front-end. Questo processo ha coperto il flusso principale dello sviluppo di plugin: pianificazione, inizializzazione, integrazione con le API del backend, elaborazione dei dati e fornimento delle interfacce front-end.

Una volta acquisita una solida conoscenza di queste nozioni di base, potrai proseguire nell’esplorazione di argomenti più avanzati, come la creazione di tipi di articoli personalizzati, l’utilizzo dei metadati (Meta Box), la modifica delle tabelle del database, lo sviluppo di endpoint REST API, l’elaborazione dei dati tramite AJAX e l’internazionalizzazione dei plugin. Ricorda che rispettare gli standard di codifica e le migliori pratiche di WordPress è fondamentale per sviluppare plugin di alta qualità e facili da mantenere.

FAQ - Domande frequenti

Quali conoscenze di PHP sono essenziali per lo sviluppo di plugin?

È necessario padroneggiare almeno la grammatica di base di PHP, inclusi variabili, array, funzioni, condizioni di controllo e cicli. La conoscenza della programmazione orientata agli oggetti (OOP) è particolarmente utile per lo sviluppo di plugin di dimensioni medie e grandi. Inoltre, è essenziale comprendere il funzionamento di WordPress nel contesto del caricamento dei plugin, nonché il modo corretto per utilizzare variabili e funzioni globali in modo sicuro.

Come debuggare un plugin per WordPress che si è sviluppato personalmente?

Prima di tutto, assicurati che nelwp-config.phpIl file è stato aperto.WP_DEBUG和WP_DEBUG_LOGIn questo modo, i messaggi di errore verranno registrati nel file di log. Inoltre, è possibile utilizzare…error_log()La funzione visualizza informazioni di debug. Per logiche complesse, è possibile utilizzare strumenti di debug professionali come Xdebug per eseguire il codice passo dopo passo.

Come garantire la sicurezza di un plugin durante lo sviluppo?

Verifica e pulisci sempre gli input forniti dagli utenti. Utilizza le funzioni integrate di WordPress, come…esc_html(), esc_attr(), sanitize_text_field()和wp_kses()Occupati di elaborare l’output. Utilizza un metodo diverso da “ce”.wp_nonce_field()Vengono utilizzati meccanismi di sicurezza per prevenire la falsificazione delle richieste tra siti web (Cross-Site Request Forgery, CSRF). Per le operazioni sul database, si adotta un approccio simile.$wpdbI metodi forniti dalla classe, o il loro utilizzo.prepare()Esempi di frasi utilizzate per prevenire gli attacchi di iniezione SQL:

I plugin dovrebbero essere sviluppati su un server locale o su un server remoto (online)?

Si consiglia vivamente di svolgere il lavoro di sviluppo principale nell’ambiente locale (ad esempio, Local o XAMPP). L’ambiente locale offre una risposta rapida, non è influenzato dalla rete e permette di effettuare test in modo libero, senza rischi di danneggiare il sito web online. Una volta completate le funzionalità principali, il software può essere distribuito nell’ambiente di test online per verificare la compatibilità finale.

Come pubblicare il proprio plugin nel catalogo ufficiale di WordPress?

Devi accedere a WordPress.org, registrare un account per sviluppatori e inviare il codice del tuo plugin tramite Subversion (SVN). Il plugin deve essere conforme agli standard di codifica ufficiali e alle esigenze della struttura dei directory, e deve contenere tutti i componenti necessari.readme.txtDopo l’approvazione del file, gli utenti di tutto il mondo potranno cercare e installare il tuo plugin direttamente dal pannello di controllo (backend).