Lauryn Web Design - Milano, Edimburgo e online

Anteprima immagine degli ultimi articoli pubblicati. Tutorial wordpress

In molti mi chiedono come si fa a riprodurre l’effetto “Gli ultimi articoli di italianwebdesign” riproposto in fondo alla homepage, in cui oltre a presentare il titolo e data degli ultimi articoli c’è anche l’anteprima dell’immagine usata nel post.

Ebbene, le cose da fare sono principalmente le seguenti:

Predisporre la pagina per gli ultimi articoli

Decidete innanzitutto quanti articoli dovranno vedersi per intero e quanti solo in anteprima. Nel nostro caso sono 2 nella loro interezza e 4 in anteprima, quindi dovremo settare nelle nostre impostazioni di wordpress, dal pannello “impostazioni” – “lettura” appunto, gli ultimi 6 articoli.

A seguire nel template di index.php segnalerete cosa visualizzare nei singoli 6 casi e per fare ciò bisogna modificare leggermente il loop di WordPress che solitamente si usa. Dovremo infatti istituire un contatore che ci permetta di valutare ogni singolo caso ed incrementarsi ogni volta che viene eseguita la scrittura del post.

Esso diventerà infatti:

< ?php if(have_posts()) : ?>
< ?php while(have_posts()) : the_post(); ?>
	< ?php switch ($count++)

{

E fra la scrittura di un articolo e l’altro inserirete:

case 0: ?>

Qui scriverete titolo, data, content del post etc…

e poi ricomincia:

< ? case 1: ?>;

Qui scriverete titolo, data, content del post etc…

Per il secondo post.

E veniamo ai 4 articoli di anteprima. Siamo arrivati al case 2, quindi:

< ? case 2: ?>

GLI ULTIMI ARTICOLI DA ITALIAN WEBDESIGN

 

    • < ?php the_title(); ?>
      < ?php the_time(‘d-m-Y’) ?>

< ? break; ?> < ? case 3: ?>

    • < ?php the_title(); ?>
      < ?php the_time(‘d-m-Y’) ?>

< ? break; ?> < ? case 4: ?>

    • < ?php the_title(); ?>
      < ?php the_time(‘d-m-Y’) ?>

< ? break; ?> < ? case 5: ?>

  • < ?php the_title(); ?>
    < ?php the_time(‘d-m-Y’) ?>

< ? break; ?> < ? } //end of switch ?> < ?php endwhile; ?> //chiusura del loop di wp

Ma non finisce qui.

Pubblicare le anteprime di immagini del post

Per far funzionare le anteprime, così come le abbiamo scritte, bisogna, ogni volta che scriviamo un post, andare su “campi personalizzati”, selezionare “thumbnail” dall’elenco proposto e inserire come “valore” il link assoluto dell’immagine che abbiamo usato. Cliccate su “aggiungi campo personalizzato” e pubblicate il post.
Provare per credere.

Era un tutorial di Geekissimo di tempo fa, lo provai e voilà.

Se ti è piaciuto condividilo

Lascia un commento

Il tuo indirizzo email non sarà pubblicato. I campi obbligatori sono contrassegnati *