EcletticaMente

Questo è il secondo articolo di una serie dedicata ai “custom fields” di WordPress.

Vi rimando al primo post per una spiegazione generale sul loro uso e con un semplice esempio. In questo articolo invece vedremo in maniera più approfondita come realizzare le “schede libro” utilizzate dal tema “EcletticaMente” ed attualmente disponibili sia per i libri che per gli album musicali. L’idea di base della realizzazione delle schede dei libri con questa metodologia viene dal blog di Justin Tadlock che ha scritto due tutorial sull’argomento.

Per iniziare

Innanzitutto, cercate di capire esattamente quali sono le informazioni che volete mostrare e come. Dopo aver navigato un po’ sul web, ho deciso che volevo avere una serie di informazioni disponibili nella scheda del mio libro. Innanzitutto volevo mappare il Nome dell’Autore, il Titolo del Libro, la Casa Editrice, il numero di Pagine, il Prezzo, l’Anno di Pubblicazione, la Coeprtina. Ed infine volevo attribuirvi una valutazione.

Per fare ciò, è quindi necessario effettuare il set-up di una serie di Custom Fields. Vediamoli nel dettaglio:

• Name: Value.
• Autore: Nome dell’Autore.
• Anno Pubblicazione: Anno di pubblicazione del libro.
• Copertina: link al file con l’immagine di copertina.
• Pagine: numero di pagine.
• Prezzo: prezzo del libro.
• Titolo: titolo del libro.
• Voto: voto espresso in numeri.

Come già sottolineato, occorre creare le chiavi una sola volta. Il sistema le terrà in memoria e saranno facilmente raggiungibili attraverso il menu a tendina per un più facile utilizzo.

Una volta realizzato un post di prova, con i custom field alimentati opportunamente, possiamo dedicarci alla formattazione del tema.

Il codice

Per prima cosa decidete dove mostrare la scheda del libro. Nel mio esempio ho lavorato essenzialmente sul file “single.php” del team WordPress.

Appena sotto l’avvio del loop, ovvero sotto questa riga di codice,

<?php while(have_posts()) : the_post(); ?>

possiamo iniziare ad inserire il codice necessario a richiamare i vari custom fields utilizzati, come abbiamo del resto già imparato a fare nella parte1 del tutorial.

<?php
 // Autore del Libro
 $author = get_post_meta($post->ID, 'Autore', $single = true);

 // Copertina
 $book_cover = get_post_meta($post->ID, 'Copertina', $single = true);

 // Titolo del Libro
 $book_title = get_post_meta($post->ID, 'Titolo', $single = true);

 // Pagine del Libro
 $book_page = get_post_meta($post->ID, 'Pagine', $single = true);

 // Prezzo del Libro
 $book_price = get_post_meta($post->ID, 'Prezzo', $single = true);

 // Voto del Libro
 $book_rating = get_post_meta($post->ID, 'Voto', $single = true);

 // Editore del Libro
 $publisher = get_post_meta($post->ID, 'Editore', $single = true);

 // Data di Pubblicazione
 $published_year = get_post_meta($post->ID, 'Anno Pubblicazione', $single = true);

 ?>

Quello che stiamo facendo con questo codice è trasformare ogni Custom Field in una variabile che utilizzeremo poi nel resto del tema per realizzare la formattazione desiderata. Utilizzare variabili, in particolare se non sono molto lunghe, permette di mantenere pulito il codice, rendendolo più facile da gestire. A questo punto siamo pronti a realizzare la porzione di Tema dedicata alla formattazione delle informazioni. Ma… si pone subito una questione, già menzionata in precedenza. A meno che il nostro non sia un sito che pubblica solo recensioni di libri, per evitare problemi con la formattazione dei post normali, vogliamo utilizzare un output condizionale ossia dire a WordPress di creare la scheda solo in presenza dei vari campi.

Per fare ciò utilizzeremo delle semplici condizioni “if”. Ecco come:

<?php

// Verifica se Esistono i tag del libro

 if($book_title !== '') {
    echo '<div id="recensione">';
    echo '<h3>Scheda:</h3>';
    echo '<img src="' . $book_cover . '" title="Copertina di ' . $book_title .' di ' . $author .'" width="198"></a>';
    echo '<ul><li>';
    echo '<em>' . $author . '</em>: ' . $book_title . '</a> ';
    echo '</li>';
    echo '<li>'. $published_year . ', '. $bookpage . ' pagine,';
    echo ' ' . $book_price . '.</li>';
    echo '<li>Voto:<strong>'. $book_rating . '/10</strong></li>';
    echo '</ul></div>';
 }
 ?>

Vediamo dunque l’output che ne consegue nell’immagine qui di fianco. per brevità non documenterò il CSS necessario per formattare il div “recensioni” nel modo che vedete. Ma è tutto sommato molto semplice, e sicuramente ognuno di voi potrà trovare la creatività necessaria per realizzare un “suo” stile.

Ma esaminiamo un attimo il codice inserito. Il primo “if”, applicato all’intero blocco, verifica se il div debba essere creato o no. Nel mio esempio dico a WordPress di creare un div “recensione” ogni qualvolta la variabile $book_title (ovvero il Titolo) sia alimentata. All’interno del blocco dispongo poi la copertina, prelevando il link dalla variabile $book_cover, a cui aggiungo un title contenente sia $book_title che $author.

Successivamente creo una lista non ordinata del tipo <ul> con in una riga autore ($author) e titolo ($book_title), su una seconda riga l’anno di pubblicazione ($published_year), il numero di pagine ($bookpage) il prezzo ($book_price) ed infine il voto ($book_rating).

Come vedete di lato la scheda è abbastanza scarna, ma possiede già tutta una serie di informazioni molto utili. Potete però subito notare un problema. Avendo dimenticato di salvare nell’apposito campo custom il valore del numero di pagine, la riga “2007, pagine, 15 Euro.” suona un po’ ridicola (a meno che non si pensi che il libro stesso abbia 2007 pagine). Ecco quindi che ho deciso di aggiungere una serie di altre informazioni, al fine di produrre l’output definitivo che trovate oggi sul sito.

Popularity: 13% [?]

Articoli e Traduzioni collegati:

• Usare i "Custom Fields" di Wordpress - Parte 1