Post più vecchi e Post più recenti di Blogger
     


Post più vecchi e Post più recenti di Blogger


In tutti i modelli classici di Blogger ma anche quelli non molto personalizzati presenti su internet gratuitamente è possibile trovare sotto il modulo dei commenti oppure sotto l'elenco dei post di una determinata etichetta tre scritte, che sono:

Post più recente = riporta al post successivo o alla pagina dell'etichetta più nuova.
Home Page = riporta alla pagina iniziale del blog.
Post più vecchio = riporta al post precedente o alla pagina dell'etichetta più vecchia.

Prima di procedere salvate il modello.



E' possibile rinominare e quindi cambiare il testo di questi tre link a proprio piacimento andando su Modello > Modifica HTML, utilizzando la casella interna per trovare i codici premendo Ctrl + F cercate questo codice:
<div class='blog-pager' id='blog-pager'>

Subito sotto questo codice dovete sostituire:
<data:newerPageTitle/> che sarebbe Post più recente, sostituitelo con 'Avanti, Successivo o Nuovi Post'.
<data:olderPageTitle/> che sarebbe Post più vecchio, sostituitelo con 'Indietro, Precedente o Vecchi Post'.
 <data:homeMsg/> che sarebbe il link centrale Home page, sostituitelo se volete con 'Torna alla Home'.



Dopo aver applicato queste modifiche Salvate il modello.

Le scritte possono essere personalizzate a proprio piacimento, inserendo le parole precedenti all'interno di un codice HTML, ad esempio: 
<b>Post più recente</b> = per il grassetto.
<i>Post più recente</i> = per il corsivo.


Se volete ingrandire o rimpicciolire le dimensioni di Post più recente o Post più vecchio dovete introdurre il CSS sottostante prima della riga ]]></b:skin>  variando il numero che contraddistingue i pixel del testo:
#blog-pager-newer-link {font-size:14px;}
#blog-pager-older-link {font-size:14px; }

Secondo me è inutile tenere il link 'Home page' perché già c'è il logo per tornare nella pagina iniziale; se la pensate come me inserite anche questo css per nasconderlo:
.home-link {display:none;}

Di norma il pulsante per gli articoli più vecchi sta sulla sinistra (Indietro) mentre quello per gli articoli più recenti sulla destra (Avanti), quelli di Blogger per quanto riguarda questi due link ragionano al contrario. Potete sistemare l'ordine di posizionamento introducendo nel codice precedente i termine float e align nel seguente modo:
#blog-pager-newer-link {font-size:14px;float: right; text-align: right;}
#blog-pager-older-link {font-size:14px; float: left; text-align: left;}

Se invece volete nascondere tutti Post più recente, Post più vecchio e Home page da tutte le pagine del blog il CSS da utilizzare è il seguente:
 #blog-pager { display:none; }



13 commenti :

  1. Ciao, ho usato le tua guida e funziano alla grande , grazie! Volevo chiederti se e' possibile inserire delle immagini al posto delle scritte (magari frecce). Grazie in anticipo!

    RispondiElimina
    Risposte
    1. Si, certo! Anziché inserire delle parole, dovrai inserire nelle stesse posizioni, il codice html per inserire immagini che è il seguente:
      <img src="LINK IMMAGINE"/>

      Devi solo inserire il link dell'immagine che vuoi che appaia.

      Elimina
  2. Ciao, il tuo post mi è stato molto utile! Volevo chiederti anche se è possibile togliere quei puntini grigi che stanno nel mezzo tra le scritte vecchi e nuovi post. Grazie! :)

    RispondiElimina
    Risposte
    1. si, se il tuo codice è simile al mio blog dovrai inserire nello stesso punto in cui hai messo gli altri css, quest'altro codice:
      .blog-pager {background:none;}

      Elimina
  3. HO PROBLEMI AD EFFETTUARE QUESTO PASSAGGIO, PUR SOSTITUENDO IL TESTO RIMANE SEMPRE TUTTO INVARIATO, PERCHè?

    &lsaquo; MI COMPARE QUESTO IN PIù NEL CODICE

    RispondiElimina
    Risposte
    1. Probabilmente si è venuto a creare un errore nel modello e non ti salva la modifica. Presta attenzione quando selezioni il codice. Oppure controlla che non ce ne siano due e che non stai invece "sballando" quello della versione mobile.

      Elimina
  4. Ciao Andrea! Ho provato questa guida sia con una nuova scritta che con l'immagine html ma mi appare sempre questo: Errore di analisi XML, riga 466, colonna 3: The element type "b:skin" must be terminated by the matching end-tag ""

    RispondiElimina
    Risposte
    1. Significa che hai cancellato un pezzo del codice di Blogger e quindi non ti fa salvare le modifiche. In pratica commetti un errore quando vai ad aggiungere il css. Ti posto una guida che potrebbe esserti d'aiuto:
      http://www.scuolissima.com/2014/08/come-aggiungere-codice-css-blogger.html

      Elimina
    2. Grazie mille per l'attenzione! A dire il vero, finora tutte le modifiche al modello non hanno dato problemi. Rispetto alla schermata di sopra il mio codice è leggermente differente, ho provato a fare copia e incolla ma appare questo messaggio: ''Non è possibile accettare il codice Nessun tag di apertura corrispondente al tag di chiusura: A specificato''

      Elimina
    3. È come se tu avessi rimosso <a class... cioè una parte di codice che non andava eliminata. Però così, senza vedere il codice è difficile individuare e risolvere il problema.

      Elimina
    4. Non posso inviarti in privato uno screenshot? Così vedi tu stesso qual è la differenza tra quello che leggo io e la schermata di sopra, visto che purtroppo, come ti ho scritto, non mi è concesso farti qui il copia e incolla del mio codice.

      Elimina
    5. certo, per email o in privato nella pagina facebook di Scuolissima... per me è uguale.

      Elimina

I commenti dovranno prima essere approvati da un amministratore. Verranno pubblicati solo quelli utili a tutti e attinenti al contenuto della pagina. Per commentare utilizzate un account Google/Gmail, altrimenti la modalità "anonimo".