WordPress: aggiungere dei pulsanti di navigazione tra un articolo e l’altro (pulsanti inclusi)

Nella realizzazione del mio tema personale ci sto prendendo davvero gusto, come vedete sono state aggiunte ancora altre novit come la barra a sinistra ritoccata e le nuove icone “sociali”, anche il form di registrazione alla newsletter molto pi gradevole secondo me.

Ma parliamo della vera novit ovvero quei piccoli pulsanti sotto il titolo di ogni articolo:
bt down[1] Successivo e bt up[1] Precedente.
Che ne pensate non sono graziosi? Permettono di saltare direttamente alla notizia successiva sulla pagina senza dover per forza scorrerla tutta.

Vediamo velocemente come implementare questa piccola soluzione nel vostro template preferito per [tag]WordPress[/tag], naturalmente questa modifica possibile soltanto a coloro che hanno accesso ai file dei propri temi grafici.

Il file in questione index.php, la modifica pu essere portata allo stesso modo anche su archive.php e su tutti gli altri file che mostrano una lista di post in un loop.

Ci basta trovare l’inizio del nostro loop sul file index.php e aggiungere qualche variabile e un paio di collegamenti, oggi mi sento buono pertanto vi posto direttamente le righe da sostituire, mi raccomando lavoro sempre con il template default di WordPress ma molto facile fare altrettanto con le altre template basta soltanto trovare il loop e la posizione in cui inserire i link con i pulsanti (vedi a fine post per alcuni pulsanti da scaricare).

Sostituisci queste righe

<?php if (have_posts()) : ?>

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

<div class="post" id="post-<?php the_ID(); ?>">
<h2><a href="<?php the_permalink() ?>" rel="bookmark" title="Permalink a <?php the_title(); ?>"><?php the_title(); ?></a></h2>
<small><?php the_time('j F Y') ?> <!-- di <?php the_author() ?> --></small>

Con queste
<?php if (have_posts()) : ?>

<?php $postCounter = 1; $postStopCounter = get_option('posts_per_page'); ?>

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

<div class="post" id="post-<?php the_ID(); ?>">
<h2 id="post-<?php echo $postCounter; ?>"><a href="<?php the_permalink() ?>" rel="bookmark" title="Permalink a <?php the_title(); ?>"><?php the_title(); ?></a></h2>
<small><?php the_time('j F Y') ?> <!-- di <?php the_author() ?> -->
<?php
if ($postCounter!=$postStopCounter)
echo '&nbsp; <a href="#post-'.($postCounter+1).'" title="Vai al post successivo">
<img src="http://www.tuosito.com/img/bt_down.png" alt="Next Post" />Successivo</a> ';
if ($postCounter!=1)
echo '&nbsp;<a href="#post-'.($postCounter-1).'" title="Vai al post precedente">
<img src="http://www.tuosito.com/img/bt_up.png" alt="Prev Post" />Precedente</a>';
$postCounter++;
?>
</small>

Alcune icone da poter utilizzare come pulsanti:
bt down[1] bt up[1] back forward
, bt down bt up bt left bt right, bt rw bt fw bt skip rw bt skip fw, arrow_down.gif arrow_up.gif
Grazie a Paolo di Flashmotus per le ultime due icone ๐Ÿ˜‰
Potete scaricare moltre altre icone da questo sito http://fasticon.com/freeware/

25 pensieri su “WordPress: aggiungere dei pulsanti di navigazione tra un articolo e l’altro (pulsanti inclusi)”

  1. Mi dite gentilmente in pagina o pagine .php di word press va inserito questo codice, per far visualizzare in modo automatico chi scrive, o se magari ci sono impostazioni diverse.Grazie

  2. Ok, nel tema di default ci sono giรƒย , nella pagina single.php, i link per la navigazione da una notizia all’altra. Il mio problema che usando postexpire (per la scadenza degli articoli) mi trovo anche a navigare negli articoli scaduti, anche se il link mi porta in una pagina vuota giustamente, io non vorrei arrivare in quella pagina e quindi il link non dovrebbe apparire quando arrivo in fondo alle notizie non scadute… c’รƒยจ una soluzione?
    Grazie

  3. Uncino ti confido un segreto, non sono molto capace di usare i wiki! Pi volte ho provato a fare qualcosa su WP Italy ma non so neppure da dove cominciare, sai come l’imbarazzo della prima volta su un qualcosa ๐Ÿ˜€

    Ho chiesto aiuto tramite forum, almeno giusto per le prime nozioni il tempo di cominciare a pedalare da solo e poi vedi quanta roba ti metto ๐Ÿ˜›

  4. No Tony non in spam, sto moderando i commenti in questo periodo non so perch ma mi arrivano un sacco di commenti stupidi tipo Hi great post, oppure thanks for this con link a siti spam spesso anche italiani, sto istruendo oltre ad akismet anche il filtro interno a wordpress sperando che finisca questa situazione perch non amo i codici captcha.

    Grazie per la segnalazione ๐Ÿ˜€

  5. Dov’ finito il mio trackback? O_o
    raff, puoi guardare nella coda di moderazione? ma come? proprio ora che ci sto prendendo la mano a fare i trackback!!

  6. Pingback: La settimana in pillole | Il Blog Informatico

  7. @Flashmotus
    Dici che i pulsanti non sono molto visibili ora come ora nelle pagine index e archivio??? Magari potrei mettere il rosa del titolo all’interno delle frecce al posto del giallo per rimanere a tema.

    @Hidaba
    Ma io non ho mai fatto un tema da zero in vita mia ๐Ÿ˜‰ Non saprei neppure farlo, questo tema figlio del famoso regulus di BinaryMoon, vedi:
    http://www.binarymoon.co.uk/projects/regulus/

    Eheheh non ci assomiglia pi per niente ๐Ÿ˜›

  8. ottimo davvero una funzionalit tanto originale quanto utile, e grazie per la condivisione, ne terr conto anch’io per il prossimo tema. Rifletterei un p sulla visibilit dei bottoni, forse ci sarebbe da agire o sulla grafica o sulla loro posizione.

  9. @ Tutti
    Grazie mille a tutti voi per il prezioso contributo! ๐Ÿ˜€

    @Luigibio
    La procedura leggermente diversa ma totalmente semplificata, basta mettere nel file single.php le seguenti stringhe:
    <?php next_post_link(); ?>
    <?php prev_post_link(); ?>

    Se nel caso nel tuo tema ci sono invece richiami alle funzioni next_post() e prev_post() rimuovili perch sono stati deprecati e sostituiti da quelli sopra. Per maggiori informazioni per la formattazione e inclusione dei link per categoria ti rimando alla pagina di Codex:
    http://codex.wordpress.org/Template_Tags/next_post_link

  10. cavolo ci stavo giusto lavorando in questi giorni… ma il tuo lavoro pi migliore del mio. Per cui ne attingo e lo implemento sul mio blog. Bravo, grazie.

  11. Ottimo Raffaele! l’ho trovata subito un’idea graziosa gi quando l’ho vista in opera 1-2 giorni fa ๐Ÿ˜‰
    Bravo!

  12. Bravo! Molto carine le icone sociali e veramente utili i pulsanti “precedente” , “successivo”.

    Comode le stringhe di codice. Le terr presenti quando avr finalmente un po’ di tempo da dedicare alla personalizzazione del mio wordpress.

    Per il momento, prendo atto…e, naturalmente, grazie!

  13. la cosa molto carina, stavo pensando che quasi quasi la implemento anche io, per preferirei inserirlo nella lettura dell’articolo singolo, funzionerebbe uguale semplicemente togliendo il # o sono necessarie modifiche?
    saluti luigibio

I commenti sono chiusi.