Wordpress: creare un file index di un template

Negli articoli precedenti abbiamo visto come creare i file header.php e footer.php di un template di Wordpress. Ora è venuto il momento di concentrarci sulla parte principale del contenuto di un template, ossia il file index.php. Creando questo file abbiamo raggiunto il nostro primo traguardo, ossia quello di creare la struttura minimale di un template. Vediamo insieme i dettagli.

Includere l'header e il footer

Nel nostro file index dobbiamo per prima cosa includere i file header.php e footer.php usando le funzioni di Wordpress get_header() e get_footer():


<?php get_header(); ?>

<!-- contenuto -->

<?php get_footer(); ?>

E se volessimo usare anche una colonna laterale? Basta usare la funzione get_sidebar(), in questo modo:


<?php get_header(); ?>

<!-- contenuto -->

<?php get_sidebar(); ?>
<?php get_footer(); ?>

Ovviamente tale funzione presuppone che noi abbiamo definito un file sidebar.php nel nostro template.

Definire il contenitore dei post

Possiamo a questo punto definire il nostro contenitore HTML che ospiterà i post:


<div id="content">

	<!-- post qui -->

</div>

Lanciare il loop di Wordpress

Il loop di Wordpress è costituito da un semplice costrutto if-while-else:


// inizia il loop

<?php if (have_posts()) : while (have_posts()) : the_post(); ?>
  <!-- post qui -->
<?php endwhile; else: ?>

  <h2>Ooops, non trovato!</h2>
  
  <!-- messaggio personalizzato di errore -->
<?php endif; ?>

Il codice significa: se ci sono post che corrispondo ai criteri passati come parametri, mostrali; altrimenti mostra un messaggio di errore. All'interno del loop possiamo reperire tutte le informazioni desiderate sui post e strutturarle all'interno della marcatura:


<!-- post qui -->

<div class="post">

  <h2><a href="<?php the_permalink() ?>" title="<?php the_title(); ?>" rel="bookmark"><?php the_title(); ?></a></h2>
  <div class="post-content">
    <?php the_content(__('Leggi tutto'));?>
  </div>
  <div class="post-meta">
	<p>Pubblicato il <?php the_time('j F Y'); ?> alle <?php the_time() ?>, da <?php the_author_posts_link() ?></p>
	<p><?php comments_popup_link('Nessun commento', '1 commento', '% commenti'); ?></p>
	<p>Categorie: <?php the_category(', ') ?></p>
	<p><?php if (the_tags('Tag: ', ', ', ' ')); ?></p>

  </div>

</div>

Abbiamo usato le funzioni the_permalink(), the_title() per creare il testo e l'URL all'interno del titolo del post. La prima funzione infatti restituisce l'URL permanente al post, mentre la seconda il suo titolo.

the_content() restituisce il contenuto del post. Il parametro passato a tale funzione serve a fornire un link al post originale qualora si fosse inserita la stringa <!--more--> che fa visualizzare solo una parte del post.

the_time() ci permette di formattare la data e l'ora di un post. Per impostazione predefinita questa funzione usa il formato che abbiamo definito nelle nostre impostazioni. the_author_posts_link() restituisce un link HTML alla pagina dedicata ai post di uno specifico autore (in questo caso l'autore del post elaborato al momento).

La funzione comments_popup_link() usa una sintassi ternaria nel caso non ci sia nessun commento al post, un solo commento o N commenti (rappresentati dal token %). Questa funzione, a seconda dei casi, restituisce del testo o un link HTML che porta ai commenti del post.

Le funzioni the_category() e the_tags() restituiscono dei link alla/e categoria/e del post e al tag o ai tag presenti (se ce ne sono).

Gestire la paginazione

Infine, è necessario mostrare dei link che conducano ai post più recenti o anteriori:


<!-- messaggio personalizzato di errore -->
<?php endif; ?>
<div class="oldernewer">
	<div class="older">
		<p>
		 <?php next_posts_link('&laquo; Post precedenti') ?>
		</p>
	</div>
	<div class="newer">
	  <p>
		<?php previous_posts_link('Post successivi &raquo;') ?>
	  </p>
	</div>
</div>

Le funzioni next_posts_link() e previous_posts_link() restituiscono appunto i link che ci servono e il loro contenuto testuale può essere personalizzato a piacimento.

Torna su