Creare un Tema WordPress – Gestiamo la ricerca

In questa breve lezione vedremo come aggiungere il form per la ricerca interna di WordPress (che nella scorsa lezione abbiamo inserito nella sidebar del tema) insieme alla relativa pagina che gestirà i risultati di ricerca. Successivamente vedremo come funziona la pagina di errore 404, che WordPress caricherà ogni volta che si cercherà di aprire un contenuto o una pagina non esistente.

Il form di ricerca.

Per integrare il modulo è necessario utilizzare la funzione get_search_form(), che caricherà il contenuto del file searchform.php, presente nel nostro tema. Se il file non fosse presente, WordPress genererà il seguente codice:

<form role="search" method="get" id="searchform" action="<?php echo home_url( '/' ); ?>">
<div><label class="screen-reader-text" for="s">Cerca per:</label>
<input type="text" value="" name="s" id="s" />
<input type="submit" id="searchsubmit" value="Cerca" />
</div>
</form>

Quindi, per personalizzare il form di ricerca, dobbiamo creare il file searchform.php e scrivere:

<form method="get" id="searchform" action="<?php echo home_url( '/' ); ?>">
<div>
<input type="text" value="cerca nel sito ..." name="s" id="s" onblur="if (this.value == '') {this.value = 'cerca nel sito ...';}" onfocus="if (this.value == 'cerca nel sito ...') {this.value = '';}"/>
<input type="submit" id="searchsubmit" class="button-search" value="<?php _e( 'Cerca', 'WIP' ) ?>" />
</div>
</form>

Quello che abbiamo fatto è assegnare, come valore della text input, la frase “Cerca nel sito“, così da eliminare la label e guadagnare un pò di spazio.
In alternativa possiamo creare una funzione apposita, all’interno di function.php, agganciandola ad un filter hook :

function modulo_ricerca( $form ) {
$form = '<form method="get" id="searchform" action="<?php echo home_url( '/' ); ?>">
<div>
<input type="text" value="cerca nel sito ..." name="s" id="s" onblur="if (this.value == '') {this.value = 'cerca nel sito ...';}" onfocus="if (this.value == 'cerca nel sito ...') {this.value = '';}"/>
<input type="submit" id="searchsubmit" class="button-search" value="<?php _e( 'Cerca' ) ?>" />
</div>
</form>';
return $form;
}
add_filter( 'get_search_form', 'modulo_ricerca' );

In questo caso la funzione che abbiamo appena creato, verrà utilizzata solamente se non è presente il file searchform.php.

Se vogliamo visualizzare il form in altri punti del sito, basterà richiamarlo utilizzando la funzione get_search_form(), di cui vi ho parlato all’inizio della lezione.

<?php get_search_form(); ?>

Risultati della ricerca.

Adesso occupiamoci del template che gestirà i risultati della ricerca, creiamo un file vuoto e rinominiamolo come search.php, non è necessario integrarlo in altri template poiché verrà utilizzato da WordPress, nel momento in cui un visitatore dovesse svolgere una ricerca interna.
Al suo interno copiamo il contenuto di uno degli altri template in cui viene richiamato il loop, ad esempio archive.php. Questo è sufficiente per ottenere i risultati di una ricerca, ma è necessario correggere alcuni punti del loop. Ad esempio, come inserire un messaggio che informa quale parola o frase è stata cercata? Semplicemente restituendo il valore della variabile $s. Scriviamo, dopo

<div class="post">:

<?php
if (is_search())  { 
echo '<h2>Risultati ricerca per : "'.$s.'" </h2>';
}
?>

Ora visualizziamo la paginazione degli articoli anche alla fine dei risultati di ricerca, se dovesse rendersi necessario. Troviamo

if (is_category()) { 
echo '<div class="pagination">';

E sostituiamo la prima riga con:

if ( (is_category()) || (is_search()) ) { 

Pagina di errore 404.

Nel caso i visitatori cercassero di aprire una pagina che è stata eliminata oppure non esistente, è possibile avvisarli realizzando una pagina di errore 404. Creiamo un file vuoto e rinominiamolo come 404.php in cui copieremo il contenuto di page.php o single.php, successivamente inseriremo un messaggio di errore sostituendolo al loop.

<?php get_header(); ?>

<!-- inizio content -->
<div id="content">

<div class="post">

            <?php _e('Ci spiace, ma la pagina o il contenuto richiesto non è stato trovato.') ?><br/>
            <?php _e('Puoi tornare alla ') ?> <a href="<?php echo home_url() ?>">homepage</a> <?php _e(', oppure effettuare una nuova ricerca tra i contenuti del blog.') ?>
            <?php get_search_form(); ?>
            
<div class="clear"></div>

</div>

<!-- fine content -->
</div>

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

Il nostro tema è quasi finito, nella prossima lezione, l’ultima dedicata a questo argomento, aggiungeremo il footer e potrete inoltre scaricare un archivio contenente il tema che abbiamo sviluppato.
Alla prossima settimana.