Cindy di Digital Ramble spiega come creare da zero un plugin WordPress per impostare le favicon di un sito tramite una pagina di opzioni, approfittandone per spiegare in modo semplice e chiaro i concetti basilari della creazione di plugin.
L’articolo originale è disponibile sul blog Digital Ramble, all’indirizzo
http://www.digitalramble.com/2006/06/06/34/
Panoramica
Ho scavato più in profondità nella documentazione di WordPress, perchè volevo che il mio plugin rispettasse alcuni criteri: volevo che avesse un pannello di amministrazione perchè NON volevo che chiunque lo usasse fosse obbligato a fare altro che impostare opzioni tramite il pannello. In altre parole, basta modifiche al codice.
Diverse ragioni per questo. Primo, non tutti gli utenti WordPress sono smanettoni come me. Secondo, è noioso anche per gli smanettoni come me cambiare temi o aggiornare WordPress e dover riapplicare tutte le piccole modifiche. Per questo motivo sto diventando la più grande fan dei plugin plug’n'play.
Per essere onesti, non sempre questo è evitabile. In particolare, gli elementi delle barre laterali non sono facilmente integrabili (credo sia questa l’idea alle spalle dei widget, ma non ho ancora approfondito abbastanza da esserne certa). In ogni caso ho già visto diversi metodi interessanti nel lavoro di altri autori di plugin, e credo sia possibile evitare molti di questi problemi.
Comunque sia, questo plugin riguarda le favicons. Questa era la mia lista dei desideri:
- Poter inserire una immagine arbitraria come favicon
- Poter specificare l’immagine rilevante nella mia cartella WordPress anzichè come URI assoluta.
- Poter modificare questa immagine in qualunque momento.
- Poter usare files gif/icon/png per la favicon
- Eventualmente usare l’immagine nel mio feed rss2
- Eventualmente usare l’immagine nel mio feed atom
- Tutto questo configurabile nel pannello di amministrazione
- Un plugin “plug and play” – da installare e attivare, null’altro.
Con mia sorpresa, questo è stato abbastanza semplice. Più o meno un ora per leggere la documentazione rilevante, circa 15 minuti per programmare, un’altra ora per il collaudo, e quasi due ore di scrittura e documentazione :-D Questa è un proporzione abbastanza tipica…
Il plugin completo è disponibile all’indirizzo
http://www.digitalramble.com/favicon-manager-wordpress-plugin/
(date un’occhiata sul lato).
Agganci agli header
Per aggiungere qualcosa agli header, senza obbligare l’utente a modificare i propri files di WordPress, potete usare
// insert favicon into header using hooks
add_action(’wp_head’, ‘add_favicon_to_headers’);
dove add_favicon_to_headers è una semplice funzione senza parametri che inserisce ciò che volete all’interno degli header. E’ molto semplice. La prima bozza della funzione è in grado di fare ciò che vorremmo facesse, durante i test:
function add_favicon_to_headers()
{
$favicon_location=”http://example.com/example.ico”;
$favicon_type=”x-icon”;
print ‘
‘;
print “\n”;
print ‘
‘;
print “\n”;
}
Ovviamente questa è solo una prima stesura, giusto per essere certi che funzioni. E può funzionare, se inserite il codice qui sopra (all’interno dei codici ?php e con un indirizzo corretto al posto di example.ico) in un file con estensione .php nella vostra cartella dei plugin. Esiste infatti un semplice favicon plugin che fa esattamente questo ma non è configurabile come ho detto nella mia lista dei desideri ;-)
Database
Per avere valori persistenti e recuperabili, ho dovuto fare uso delle utilità a livello database offerte in WordPress. Ci sono add_option, update_option e get_option per un interfacciamento semplice. Quindi farò in modo di verificare che sia presente un dato nel database con l’indirizzo della favicon:
// add the saved items to the database if not already there
function favicon_mgr_add_options()
{
add_option(’fm_favicon_location’, ”);
}
favicon_mgr_add_options();
A questo punto il database ha ora un nuovo elemento, con un valore vuoto (una stringa di testo) disponibile per questo plugin. Ho provato a usare nomi lunghi e descrittivi (nelle funzioni, N.d.T.) per ridurre l’eventualità di una collisione di name space. Sarebbe stato più semplice per le mie dita usare solo “favicon”, ma ovviamente sarebbe stata più alta la possibilità che qualcuno abbia avuto prima o poi la mia stessa brillante idea.
Questo significa che l’aggancio ora può recuperare valori dal database:
function add_favicon_to_headers()
{
$favicon_location=get_option(’fm_favicon_location’);
$favicon_type=get_favicon_type($favicon_location);
print ‘
‘;
print “\n”;
print ‘
‘;
print “\n”;
}
Ora potete vedere perchè ho usato le variabili fino ad ora :-). La funzione get_favicon_type è un’altra funzione che ho scritto (e non ho incluso sopra per chiarezza) che restituisce il tipo corretto (x-icon, gif, jpg, png) a seconda del nome della favicon. In questo modo la funzione è pronta qualunque sia l’input dell’utente (dovrei aggiungere un controllo nel caso l’estensione sia sconosciuta, ma ancora una volta sto cercando di rendere le cose più semplici possibile).
Pannello di amministrazione
WordPress offre anche un set diretto di funzioni per crare un pannello di amministrazione. E’ stato decisamente semplice. Per prima cosa è presente un aggancio per inserire un nuovo menù sotto il menu Opzioni (potete fare anche altro, ma per cose basilari come queste, Opzioni è più che sufficiente).
// create hook for new submenu
add_action(’admin_menu’, ‘favicon_mgr_admin_menu’);
// title of page, name of option in menu bar, which function lays out the html
function favicon_mgr_admin_menu()
{
add_options_page(__(’Favicon Manager Options’), __(’Favicons’), 5, basename(__FILE__), ‘favicon_mgr_options_page’);
}
// html layout for option page, plus detection/update on new settings
function favicon_mgr_options_page()
{
…
}
Quindi, tutto ciò che questo produce è l’inserimento di un oggetto menu. L’oggetto specifica a sua volta la funzione che definirà la pagina. Quindi, la funzione inserirà il codice necessario a permettere gli input e il resto. Questa pagina dovrà inoltre poter aggiornare i record nel database in modo che gli agganci della testata possano ricevere i valori corretti da inserire nella stessa. In questo modo le cose iniziano a essere collegate. Una prima stesura della pagina di opzioni:
function favicon_mgr_options_page()
{
$updated = false;
if (isset($_POST['fm_favicon_location']))
{
$fm_favicon_location = $_POST['fm_favicon_location'];
update_option(’fm_favicon_location’, $fm_favicon_location);
$updated = true;
}
$fm_favicon_location = get_option(’fm_favicon_location’);
if ($updated)
{
?>
Options saved.
}
Prendiamo una pausa rinfrescante. Ricordiamoci che questa pagina verrà mostrata solo quando l'utente entrerà nella pagina di opzioni, oppure dopo aver modificato le opzioni stesse. Quindi la prima cosa da verificare è se l'elemento input del modulo è stato modificato o meno. Nel primo caso, verrà inserito nel database, e verrà impostato update su true.
?>