In questo articolo, partendo da quanto fatto nel precedente articolo, aggiungeremo un form alla nostra pagina opzioni dandogli uno stile coordinato con l’interfaccia di amministrazione di WordPress. Per fare questo installeremo un plugin che ci permetterà di copiare il codice HTML necessario. Il plugin in questione è WordPress-Admin-Style, potete scaricare il file zip installabile da questo link . Una volta installato ed attivato il plugin, nel menu di WP avrete una voce “Admin Style” che vi permetterà di accedere a del codice HTML e PHP, da copiare/incollare nei vostri progetti, nella fattispecie nella pagina opzioni del nostro plugin.

La nostra pagina opzioni avrà un layout a 2 colonne, quindi copieremo ed incolleremo il codice che troverete in “Admin Style” -> “2 Column Layout” e lo incolleremo in un nuovo file “options-page-wrapper.php”, nel nostro plugin, in una nuova cartella “inc”. La struttura sarà la seguente:

Schermata 2014-06-02 alle 12.28.41

Struttura plugin

 

La nostra pagina opzioni conterrà un form con un unico campo “deved_footer” che useremo per salvare il testo da includere nel footer del nostro sito web. Ecco il codice di “inc/options-page-wrapper.php”:

Per visualizzare questa pagina è necessario modificare il file principale del nostro plugin, “deved-options.php”, includendo il file appena creato con require( 'inc/options-page-wrapper.php' );. Il codice completo sarà:

Adesso, accedendo ad “impostazioni-> Deved Options” vedrete la pagina opzioni con il form per il salvataggio del footer con uno stile perfettamente in linea con l’interfaccia di amministrazione di wordpress. Se tutto è andato bene dovreste ottenere questo risultato:

Deved Options Screenshot

Deved Options Screenshot

Cliccando sul pulsante salva ovviamente non succede nulla. Vedremo come rendere funzionale il form nel prossimo articolo!

Scarica il codice completo (2KB)

Leave a Reply