Creare una pagina archivio immagini senza plugin in WordPress

Ti serve creare una pagina archivio di tutti gli articoli divisi per mese e anno, ma mostrando solamente le immagini d’anteprima e senza plugin (in WordPress)? Allora sei nel posto giusto 🙂 Ecco il risultato:

Per farlo ho adattato il codice che ho proposto nell’articolo come creare una pagina archivio senza plugin.

Per semplificarti la vita, ecco il file già pronto e finito, solo da scaricare… clicca qui per il download.

Ma partiamo dall’inizio…

Per fare il test ho utilizzato il tema Twenty Twelve, quindi probabilmente il file va adattato al tuo tema (anche se dovrebbe andare ugualmente). Ho duplicato il file page.php che contiene tutti i codici che vengono usati dal tema per mostrare le pagine, e l’ho rinominato in page-archive-images.php (ma il nome non è così importante).

Da notare che il file va messo via FTP proprio dove è presente il file page.php (ovvero rimane nella cartella del tema).

Dopodichè ho aggiunto questa intestazione nella parte commentata iniziale:

Template Name: Archivio Immagini

Dice a WordPress che questo file è un file di template di nome Archivio Immagini, ovvero permette di cambiare la struttura delle pagine tramite un semplice menù a tendina che comparirà nella sidebar a destra dell’editor della pagina:

Ovviamente ora devi selezionare questo template 🙂

Attualmente la pagina rimane vuota perchè il file è quello di default, ma fra poco…

Copia questo codice ed incollalo al posto del codice che attualmente viene utilizzato per mostrare il contenuto della pagina (in questo caso tra <div id=”content” role=”main”> e </div><!– #content –>):

[php]

<?php
/*
/ mostra l’archivio di un blog WordPress con solo le immagini, senza usare nessun plugin
*/
$ultimo_articolo = $wpdb->get_var("SELECT ID FROM $wpdb->posts WHERE post_date <‘" . current_time(‘mysql’) . "’ AND post_status=’publish’ AND post_type=’post’ AND post_password=” ORDER BY post_date DESC LIMIT 1");
//$output = get_option(‘hfy_archives_’.$ultimo_articolo);

if(empty($output)){
$output = ”;
$wpdb->query("DELETE FROM $wpdb->options WHERE option_name LIKE ‘hfy_archives_%’");
// Legge tutti i mesi che hanno almeno un post
$query_mese = "SELECT DISTINCT YEAR(post_date) AS year, MONTH(post_date) AS month, count(ID) as posts FROM " . $wpdb->posts . " WHERE post_date <‘" . current_time(‘mysql’) . "’ AND post_status=’publish’ AND post_type=’post’ AND post_password=” GROUP BY YEAR(post_date), MONTH(post_date) ORDER BY post_date DESC";
$risultati_mese = $wpdb->get_results($query_mese);

if ($risultati_mese) {
// Estrae i risultati per ogni mese
foreach ($risultati_mese as $risultato_mese) {
$questo_mese    = zeroise($risultato_mese->month, 2);
$questo_anno    = $risultato_mese->year;

// Estrae tutti i post per il mese corrente
$query_post = "SELECT ID, post_date, post_title, comment_count FROM " . $wpdb->posts . " WHERE post_date LIKE ‘$questo_anno-$questo_mese-%’ AND post_date AND post_status=’publish’ AND post_type=’post’ AND post_password=” ORDER BY post_date DESC";
$risultati_post = $wpdb->get_results($query_post);

if ($risultati_post) {
// Mostra il nome del mese e anno
$text = sprintf(‘%s %d’, $month[zeroise($risultato_mese->month,2)], $risultato_mese->year);
$postcount = count($risultati_post);
$output .= ‘<p><h2>’ . $text . ‘</h2></p>’;
$output .= "<ul class=’archives-images-list’>\n";

foreach ($risultati_post as $risultato_post) {
if ($risultato_post->post_date != ‘0000-00-00 00:00:00’) {
// legge l’URL dell’articolo
$url = get_permalink($risultato_post->ID);
// legge l’URL dell’immagine in evidenza
$ima = get_the_post_thumbnail($risultato_post->ID, ‘thumbnail’);
// Estrae il titolo dell’articolo
$arc_title    = $risultato_post->post_title;
if ($arc_title)
$text = wptexturize(strip_tags($arc_title));
else
$text = $risultato_post->ID;
$title_text = __(‘Leggi’). ‘ &quot;’ . wp_specialchars($text, 1) . ‘&quot;’;
// mostra l’immagine con il relativo link
$output .= ‘    <li>’ . "<a href=’$url’ title=’$title_text’>$ima</a>";
$output .= "</li>\n";
}
}
$output .= "</ul>\n\n";
}
}
update_option(‘hfy_archives_’.$ultimo_articolo,$output);
}
else{
$output = ‘<strong>’. __(‘ERROR:’) .'</strong> ‘. __(‘No items were found to be displayed.’) .”;
}
}
echo $output;
?>
[/php]

Ora devi dargli un po’ di stile, altrimenti le immagini verranno mostrate una sotto l’altra.

Aggiungi questo codice alla fine del file style.css del tema:

[css]
.archives-images-list img{
margin:15px 15px 15px 0;
float: left;
}
[/css]

Ho impostato un margine da 15px e un float sinistro (così da affiancare tutte le immagini). Da notare che è possibile anche modificare le dimensioni delle immagini, agendo sulle thumbnails. Ad esempio, usando ‘array(100,100)’ al posto di ‘thumbnail’, verrà mostrata un’immagine di 100×100 px.

Il risultato è davvero molto semplice, ma è giusto per metterti sulla buona strada 🙂 Sei libero di personalizzare il codice come meglio credi!

Se non vedi niente, è perchè non hai impostato l’immagine in evidenza per gli articoli (c’è proprio un campo a destra nell’editor della pagina).

Quando hai terminato le modifiche, elimina i // che trovi alla riga 6. In questo modo mantiene la pagina salvata in memoria fino a che non viene creato un nuovo articolo (funziona da cache), per evitare di continuare a fare delle richieste inutili al database.