WordPress è la piattaforma più utilizzata in tutto il mondo per creare siti web. E’ infatti possibile creare un sito come questo che state visitando che comprende pagine di descrizione di un’attività e articoli di un blog. Nato principalmente per permettere a qualsiasi persona di creare e gestire un proprio blog su cui pubblicare i propri interessi, negli anni la piattaforma si è evoluta. Ad oggi oltre ad essere utilizzata per i blog, viene anche usata per creare siti e-commerce o di e-learning. Ma come è possibile aggiungere queste funzionalità ad un’installazione base di WordPress? Semplice: cercate il plugin che fa al caso vostro!!!
I plugin sono pacchetti software che si integrano con la piattaforma WordPress per inserire nuove funzionalità. Ad esempio, Woocommerce permette di creare un negozio virtuale, gestire l’inventario dei prodotti, impostare i metodi di pagamento e di spedizione e molto altro. Quindi con pochi clicks e un pò di configurazione un sito e-commerce è pronto per essere lanciato.
Ad oggi esistono una varietà di plugins per ogni esigenza. Esistono però delle esigenze particolari che non sono coperte dai plugins attualmente disponibili. Ad esempio, la creazione di pagine personalizzate per la fornitura di servizi. In questi casi è necessario implementare un plugin dedicato.
L’implementazione di un plugin per WordPress, ahimè, non è per tutti. Bisogna avere delle competenze di programmazione, conoscere il linguaggio PHP, un pò di html e css, e studiare le funzionalità fornite da WordPress. Purtroppo la documentazione fornita da WordPress non fornisce esempi concreti, il che rende lo sviluppo di un plugin molto difficile. In questo articolo andremo a vedere come creare la struttura del codice per un nuovo plugin e la analizzeremo.
Preparazione di un ambiente di sviluppo
Prima di iniziare a creare il nostro plugin abbiamo la necessità di creare un ambiente in cui lo potremo testare. Non vogliamo infatti installare il nostro plugin su un sito già online rischiando di compromettere alcune sue funzionalità.
Per far questo il consiglio è di crearsi un docker che implementi WordPress. Possiamo utilizzare l’esempio già descritto nell’articolo Docker compose – come orchestrare diversi container. In questo modo avremo sul nostro pc un’installazione “pulita” di WordPress su cui potremo lavorarci e sperimentare. Per semplicità vi riportiamo il docker-compose file qui sotto.
version: '3.3'
services:
db:
image: mysql:5.7
volumes:
- db_data:/var/lib/mysql
restart: always
environment:
MYSQL_ROOT_PASSWORD: somewordpress
MYSQL_DATABASE: wordpress
MYSQL_USER: wordpress
MYSQL_PASSWORD: wordpress
wordpress:
depends_on:
- db
image: wordpress:latest
ports:
- "8000:80"
restart: always
environment:
WORDPRESS_DB_HOST: db:3306
WORDPRESS_DB_USER: wordpress
WORDPRESS_DB_PASSWORD: wordpress
WORDPRESS_DB_NAME: wordpress
volumes:
db_data: {}
Il nostro sito di test sarà disponibile all’indirizzo http://localhost:8000. Bisognerà quindi collegarsi a questo indirizzo e iniziare la configurazione di WordPress. Poichè è un sito di test non abbiamo la necessità di installare tutti i plugin che effettivamente utilizzeremo per il sito finale, ma solo quelli strettamente necessari.
Ad esempio, se il nostro plugin inserirà delle pagine personalizzate all’interno del profilo utente di un sito di e-commerce, avremo necessariamente bisogno di installare Woocommerce. Discorso simile se il nuovo plugin dovrà inserire delle nuove funzionalità in un editor grafico quale Elementor, DiVi o Avada.
Ricordate che più plugin installate più il vostro sito risulterà lento e le interferenze con il vostro plugin potrebbero aumentare.
Creare la struttura di un plugin WordPress
Come detto in precedenza, la documentazione relativa allo sviluppo di plugin per WordPress non fornisce tutorial, ma solo linee guida. Risulta quindi difficile definire una struttura standard che rispetti le best practices riportate nella documentazione ufficiale.
Esistono, infatti, plugin costituiti da un solo file come Hello Dolly, o altri molto complessi come Woocommerce. La struttura rispecchia sia le funzionalità fornite sia le capacità del programmatore.
Esiste però una soluzione a questa mancanza di standardizzazione delle strutture dei plugins: WordPress Plugin Boilerplate Generator. Mediante questo software è possibile generare una struttura standard dei nuovi plugin che rispecchi le best practices. Essendo online non c’è la necessità di installare nulla sul nostro pc. Ci basterà riempire il form mostrato qui sotto.
Una volta compilato il form e cliccato sul bottone “Build Plugin” verrà scaricato uno zip contente il codice del nostro nuovo plugin. Ovviamente sarà compito del programmatore implementare le nuove funzionalità. La struttura, però, ci permetterà di inserirle in modo agevole e ottimale. Inoltre, tutte le informazioni e le funzionalità di installazione e disinstallazione del plugin sono già disponibili. Possiamo quindi provarlo ad installarlo senza il timore che questo possa compromettere il funzionamento del sito.
Struttura del plugin
Andiamo a vedere la struttura del plugin per comprendere dove dovranno essere inserite le varie funzionalità. Creiamo con il software descritto in precedenza il plugin con le seguente informazioni:
- Nome: flowygo wp
- Slug: flowygo
- Uri: https://github.com/alefiori82
- Nome autore: Alessandro Fiori
- Email autore: [email protected]
- Uri autore: https://flowygo.com/
In pochi secondi verrà scaricato uno zip di circa 21 KB. Estraiamo il suo contenuto per poterci lavorare. La cartella risultante avrà la struttura seguente.
La struttura è alquanto articolata ma comprende tutto ciò che serve, e forse anche qualcosina di più. Andiamo ad analizzarla per evidenziare le caratteristiche principali che ci aiuteranno a sviluppare il nostro plugin.
Per prima cosa possiamo notare che un file README e LICENSE sono già presenti. La licenza generata è del tipo “GNU GENERAL PUBLIC LICENSE“. Nel caso fosse necessario cambiarla dovete semplicemente sostituire il contenuto di questo file. Nel file README invece ci sono alcune informazioni riguardo al plugin. Alcune di queste informazioni verranno visualizzate nel pannello relativo ai plugins dell’amministratore del sito. Pertanto cambiatele prima di rilasciare il vostro plugin!!!
Nonostante sembra più intuitivo che il file index.php sia quello che gestisca l’intero plugin, ciò non è vero. Tutti i file index.php che trovate nelle varie cartelle servono per definire i “pacchetti” o “moduli” del vostro software. Se arrivate come me dal mondo python potreste paragonarli al file __init__.py.
Il file che definisce il plugin e che verrà eseguito da WordPress durante l’installazione, la configurazione, l’esecuzione e la disinstallazione è il file flowygo.php. In questo file dovrete andare a definire le dipendenze e le inclusioni che vi serviranno. Ad esempio, potrete inserite una funzione che verifica la presenza di determinati plugin attivi.
La cartella includes contiene i file relativi alla gestione delle funzionalità base del plugin. Il file che dovremo modificare per attivare le nuove funzionalità è class-flowygo.php. All’interno di questo file aggiungeremo, ad esempio, le actions per registrare nuovi menù nel pannello dell’amministratore, endpoints e includere scripts.
Le funzionalità che il nostro plugin fornirà saranno invece definite nei file delle cartelle admin e public. La cartella admin includerà tutti i file php, js e css che verranno utilizzati nei menù del pannello di amministrazione. Sarà qui che potremo definire dei forma per impostare i parametri del nostro plugin o intercettare azioni compiute da altri plugin. Diversamente nella cartella public andremo a definire tutto ciò che serve per aggiungere nuove pagine nella parte pubblica del sito.
Infine la cartella languages conterrà i file per le traduzioni delle voci del nostro plugin. In questo modo il plugin potrà essere utilizzato in lingue diverse.
Nei prossimi tutorial dedicati a WordPress vedremo alcuni esempi pratici di come modificare opportunamente i file per aggiungere alcune funzionalità.
7 risposte
Buongiorno, grazie per l’articolo molto ben strutturato. Sono riuscito a ricrearlo correttamente. Quali sono gli step e le funzioni da aggiungere nel file class-flowygo.php, per visualizzare (quindi effettuare un GET) dei due valori salvati nelle opzioni?
Grazie,
Roberto
Buongiorno.
Grazie per il commento. Può trovare indicazioni su come gestire i settings del plugin nell’articolo https://flowygo.com/blog/creare-pagina-di-settings-plugin-wordpress/. Sul blog trova anche altri articoli su come completare il plugin con l’integrazione degli advanced custom fields (https://flowygo.com/blog/gestire-advanced-custom-fields-e-integrarli-in-plugin-wordpress/) e l’interazione con woocommerce (https://flowygo.com/blog/personalizzare-woocommerce-con-un-plugin/).
Buongiorno Alessandro, grazie per la risposta. Ho integrato anche ACF e il tutto funziona correttamente. Nel mio caso ho dovuto personalizzare una sidebar e avere valori dinamici in base alla pagina caricata mi è risultato molto utile.
Avrei bisogno di estrarre i due valori delle opzioni create seguendo questa guida:
https://flowygo.com/blog/creare-pagina-di-settings-plugin-wordpress/
I valori dovranno essere estratti e aggiunti in due variabili da utilizzare all’interno del plugin per essere processati da cicli PHP. Ad esempio tornano utili per attivare o disattivare alcune funzioni slegate da ACF. Quale è la funzione da utilizzare?
Ho provato la configurazione di
get_option( string $option, mixed $default = false )
oppure
echo get_option( ‘_number’ );
ma senza successo.
Grazie e buona giornata,
Roberto
La funzione per recuperare un valore di settings del plugin è get_option(). Attenzione però che usando la struttura proposta il nome dell’opzione è definita da $this->option_name concatenato con il nome scelto. Ad esempio la funzione per richiamare la variabile ‘_general’ sarà
$val = get_option( $this->option_name . '_number' );'_general'.Buongiorno Alessandro, grazie per le informazioni fornite. All’interno del file public>partials>flowygo-public-display.php ho aggiunto questo codice PHP ma restituisce errore server:
option_name . ‘_number’;
echo $developress_display_number;
}
add_action( ‘wp_footer’, ‘develop_footer_sticky_bar’, 100 );
?>
Da cosa è dovuto e come posso risolvere?
Grazie
Roberto
Buongiorno.
Da questo pezzo di codice, l’errore potrebbe essere che option name non è noto poichè è definito all’interno della classe. Deve essere quindi acceduto mediante l’oggetto $this.
Il codice dovrebbe essere quindi
$developress_display_number= $this->option_name . ‘_number’;
echo $developress_display_number;
Non avendo però tutto il codice è difficile individuare il possibile errore.
Lascio il link al codice PHP condividendolo tramite codeshare.io almeno è meglio comprensibile.
https://codeshare.io/zy7eWN
Grazie