All'inizio di quest'anno, abbiamo lavorato attraverso una serie di tutorial che coprivano il processo di creazione di pagine di amministrazione personalizzate in WordPress. Sebbene questa serie non sia necessariamente un prerequisito per il materiale che stiamo per coprire, non sarebbe male recensirlo.
Fuori dagli schemi, WordPress offre molte funzionalità attraverso le sue numerose API. Se, ad esempio, si desidera lavorare sull'introduzione delle pagine di amministrazione da appena concentrandosi sulle opzioni che verranno presentate all'utente, è possibile farlo utilizzando l'API Impostazioni.
Ci sono molti vantaggi nello scegliere questa particolare API. Alcuni di questi includono:
Ma proprio come abbiamo visto come creare pagine di amministrazione personalizzate, è anche possibile implementare un sistema che ci consente di impostare in modo programmatico i nostri messaggi personalizzati, il loro tipo e quando e dove visualizzarli nella pagina di amministrazione.
Quindi, continuando con lo stesso tema della serie di cui sopra, stiamo andando a vedere come creare il nostro sistema di messaggistica personalizzato per le pagine di amministrazione. Per fare questo, creeremo un plugin per dimostrare i concetti, registreremo i ganci personalizzati con WordPress e vedremo come implementarli,.
Come ho già detto, il tutorial precedente non è necessariamente un prerequisito per questa serie, ma se sei nuovo a qualsiasi cosa menzionata sopra, ti preghiamo di dedicare un po 'di tempo alla revisione della serie perché darà un po' di fondamento alla direzione in cui stiamo andando.
Detto ciò, iniziamo.
Se hai letto uno dei miei tutorial precedenti, sai che mi piace iniziare ogni tutorial (o serie, anche) con due cose:
Facciamolo ora.
In generale, questo è ciò di cui hai bisogno per iniziare con il progetto che costruiremo.
Se sei curioso di sapere come si combino tutto questo, ti consiglio di leggere questa serie.
Generalmente non raccomando un software in termini di miglioramento rispetto ad altri perché ci sono così tante opzioni, ma se sei nuovo di zecca in questo, ti consiglio vivamente la versione gratuita di MAMP. È compatibile con macOS e Windows, quindi dovrebbe essere compatibile con molte delle tue configurazioni. È facile da usare, facile da usare e fornisce tutto ciò che serve al momento dell'installazione.
Detto questo, ecco la ripartizione provvisoria di questa serie:
Nota che ogni esercitazione includerà file sorgente scaricabili; tuttavia, non saranno necessariamente file sorgenti completi in quanto potrebbero non includere documentazione o altre note. Questo è ciò che il tutorial è tutto, dopo tutto.
Ma la versione finale fornita includerà esattamente questo.
Al momento, sappiamo che avremo bisogno dei seguenti elementi per il nostro plug-in:
Quindi prendiamo tutti questi pezzi insieme e funzionali.
La prima cosa che vogliamo fare è introdurre la funzionalità che aggiungerà un elemento di sottomenu a Opzioni menu nel menu di navigazione di amministrazione di WordPress.
Per fare ciò, abbiamo bisogno di due classi e un file: una classe che visualizzerà il sottomenu, una classe che visualizzerà la pagina del sottomenu e un file che visualizzerà il contenuto della pagina.
Prima di fare ciò, raccomando la seguente struttura di directory:
Ciò significa che il Admin
la directory avrà a visualizzazioni
sottodirectory. Il Admin
directory avrà class-submenu.php
e class-sottomenu-page.php
. Parleremo della pagina di amministrazione nella prossima sezione.
Per prima cosa, esaminiamo ciascuno di questi singoli file.
Questa classe è responsabile dell'aggiunta della voce di menu alla pagina delle opzioni:
submenu_page = $ submenu_page; public function init () add_action ('admin_menu', array ($ this, 'add_options_page')); public function add_options_page () add_options_page ('Tuts + Messaggi personalizzati', 'Tuts + Esempio di messaggio personalizzato', 'manage_options', 'tutsplus-custom-messages', array ($ this-> submenu_page, 'render'));
Se hai letto la chiamata API nel Codex, vedrai che questo introdurrà una voce di menu in Utensili menu che sarà accessibile tramite "Tuts + Messaggi personalizzati" e che ospiterà un titolo che vedremo momentaneamente.
Nota anche che c'è un dentro
metodo. Questa funzione registra il add_options_page
con WordPress admin_menu
gancio in modo che sia correttamente registrato (e visualizzato) durante il ciclo di vita della pagina WordPress.
In secondo luogo, questo menu è accessibile tramite chiunque abbia il manage_options
capacità, e chiamerà il metodo render su submenu_page
questo appartiene ad esso.
Il problema? Là è nessuna pagina di sottomenu. Quindi creiamo quella classe ora.
Il codice per questa classe è qui sotto:
Il
Submenu_Page
la classe è chiaramente semplice. Tutto ciò che fa è visualizzare ilsettings.php
pagina, che esamineremo in un momento.Nota che non tutte le pagine dei sottomenu saranno così semplici; tuttavia, la complessità del nostro plugin deve ancora venire. Lo vedremo in un prossimo post.
2. La pagina di amministrazione
Proprio come il
Submenu_Page
era semplice, così è la pagina delle impostazioni. In effetti, se hai familiarità con il markup di base, dovrebbe essere facile capire esattamente cosa sta succedendo:In realtà non visualizzeremo opzioni in questa pagina. Invece, useremo questa pagina per dimostrare come collegarci al nostro messenger personalizzato.
In breve, questo mostra semplicemente un messaggio in WordPress che non useremo questa pagina per qualcosa di diverso dalla visualizzazione di messaggi personalizzati.
Dopotutto, quello è cosa faremo.
3. Portandolo alla vita
A questo punto, siamo pronti per impostare il file di bootstrap per mettere in moto il plugin. Ecco il file bootstrap di base:
dentro();Prendi nota del commento sopra il
per ciascuno
ciclo continuo. Anche se abbiamo coperto l'autoloading in una serie precedente, non voglio presumere che nessuno abbia letto tutte le serie che portano a questo particolare.Una volta che questo è a posto, dovresti essere in grado di accedere al tuo account WordPress, attivare il plugin e vedere la seguente schermata:
In caso contrario, ricontrolla tutto il codice sorgente con quello che è allegato a questo post e verifica che tutto sia esattamente come dovrebbe essere.
In caso contrario, apportare le correzioni necessarie e riprovare. Se ci vogliono alcuni tentativi, non preoccuparti. La programmazione può essere un compito un po 'frustrante, a volte, soprattutto quando si sta per iniziare.
Conclusione
Se hai seguito la maggior parte del mio lavoro fino a questo punto, molto di questo potrebbe sembrare familiare. Se no, allora sono felice di averti a bordo. Mentre aspetti il secondo tutorial, ti consiglio di esaminare alcuni degli altri materiali che ho pubblicato per avere un'idea di ciò che mi piace coprire e del mio approccio all'insegnamento di questi concetti.
Sono anche sempre felice di rispondere alle domande tramite i commenti, e puoi anche sentirti libero di dare un'occhiata al mio blog e seguirmi su Twitter. Di solito parlo anche dello sviluppo del software all'interno di WordPress e di argomenti tangenziali.
Fino al prossimo tutorial, studia il codice, scarica i file e guarda come funziona sul tuo computer locale. Nella prossima parte, riprenderemo esattamente da dove eravamo rimasti.
risorse