Pubblicato il 25/06/12e aggiornato il

Come diminuire lo spazio tra i post in homepage.

Come diminuire o aumentare la distanza tra i singoli articoli quando si apre la homepage, una pagina di etichette o una di archivio.
In alcuni modelli, specialmente dopo che sono state introdotte delle modifiche, può capitare di vedere i singoli post separati da troppo spazio quando si apre la homepage, una pagina di una etichetta o una pagina di archivio.

Il problema può essere risolto facilmente attraverso l'uso di Firebug e di un appropriato CSS. Nei modelli ufficiali di Blogger la classe di stile che sovrintende al contenitore dell'articolo è post-outer ma non escludo che in taluni modelli personalizzati possa essere diversa.

Per diminuire la distanza tra post e post dobbiamo andare su Modello > Backup/Ripristino e salvare il modello completo. Si torna su Modello > Modifica HTML e si cerca la riga

]]></b:skin>

Alternativamente si può andare su Modello > Personalizza > Avanzato > Aggiungi CSS. In entrambe le soluzioni va incollato questo codice

.post-outer {margin-bottom:-40px;}

rispettivamente sopra alla riga indicata o nel modulo in alto a destra. Si salva il modello se si è operato sul template mentre si va su Applica al blog se si è usato il Designer Modelli 

distanza-tra-post-e-post-blogger

Il valore di -40 pixel può essere modificato in funzione del proprio layout. Naturalmente questo stesso sistema può anche essere usato per aumentare lo spazio tra i vari articoli. Basterà sostituire i valori negativi in margin-bottom con valori positivi.




22 commenti :

  1. come avvicinare i post centrali sulla mia home page visto che ho modificato html della pagina stessa! Grazie...

    RispondiElimina
  2. ho provato con questo codice ma nulla di fatto!
    .post-outer {margin-bottom:-40px;}

    RispondiElimina
    Risposte
    1. @LuigideStefano
      Prova a incollarmi l'URL del tuo blog che guardo un po'

      Elimina
    2. In passato ero riuscito a ridurre lo spazio. Oggi ho provato ad installare il tuo nuovo widget tipo linkwithin ma non funzionava, così ho ripristinato il vecchio linkwhithin modificato(non avevo salvato il template!) Adesso è tornato lo spazio e non c'è verso di toglierlo. Ho provato seguendo le indicazioni di due tuoi post, ma niente da fare. Suggerimenti?

      Elimina
    3. @ Prova con Firebug o Firebug Lite
      http://www.ideepercomputeredinternet.com/2011/05/firebug-e-una-estensione-di-firefox-per.html
      http://www.ideepercomputeredinternet.com/2012/07/firebug-chrome-blogger-css-html.html
      oppure segui le indicazioni di questo post
      http://www.ideepercomputeredinternet.com/2011/05/come-diminuire-lo-spazio-tra-post-e.html

      Elimina
    4. Si l'ho letto nel tuo post ed ho istallato apposta firefox.
      Nel mio blog è post hentry.
      Ho provato con .post hentry {margin-bottom:-40px;} e anche con
      .post hentry {
      margin-bottom: -20px;
      }
      ma non funziona.
      Comunque grazie.

      Elimina
    5. Ho risolto, con Firebug ho scoperto cosa spostava il post più in basso. Grazie.

      Elimina
  3. http://luigidestefano.blogspot.it/

    RispondiElimina
  4. scusami Ernesto perchè a me non funziona? ho usato anche firebug ma niente,non riesco a diminuire lo spazio tra i post
    www.arteinmovimentodemaria.com

    RispondiElimina
    Risposte
    1. Ho dato uno sguardo alla tua homepage e devo dire che non ci si capisce nulla. Ci sono un sacco di immagini di Instagram ma non sono riuscito a vedere neppure un post quindi non si può neppure ridurre la distanza
      @#

      Elimina
  5. ho provato ma mi esce un condice visibile anche al pubblico sopra l'header,come se ci fosse un errore,diciamo che a me servirebbe di piu quello che diminuisce lo spazio tra data e scrittura di un post.

    RispondiElimina
    Risposte
    1. La tua homepage è lentissima a caricare. Ci sono molti video. È difficile anche analizzarla
      @#

      Elimina
  6. Ernesto potresti controllare adesso? ho sistemato il tutto.E' ancora lenta? a me si carica velocemente
    prima in effetti era molto lenta

    RispondiElimina
  7. Ciao Ernesto, innanzitutto Buon Anno. Ho ridotto la distanza tra i post e la sidebar ma si è creato un problema che non riesco a risolvere, il margine dei post e decentrato rispetto all'header, rimane più a sinistra e non so come modificarlo, puoi aiurtami? il sito è www.iformazioneweb.com
    Grazie
    Piergiorgio

    RispondiElimina
    Risposte
    1. Prova a cercare questo codice
      src="http://2.bp.blogspot.com/-LxqFVE_8u7k/UsUUlqEQBcI/AAAAAAAAAYs/MpFDydUMIsg/s1600/Web%2BMarketing_2.jpg" style="display: block" width="984px;"

      e prova a modificarlo in questo modo

      src="http://2.bp.blogspot.com/-LxqFVE_8u7k/UsUUlqEQBcI/AAAAAAAAAYs/MpFDydUMIsg/s1600/Web%2BMarketing_2.jpg" style="display: block" width="1009px; margin-left:-25px;
      Non so se funzionerà e ricordati di salvare il modello prima della modifica
      @#

      Elimina
    2. Questo commento è stato eliminato dall'autore.

      Elimina
    3. Ernesto non la trovo, sembra che non ci sia :-(

      Elimina
  8. Io ho visto il codice dal sorgente pagina mentre tu hai aperto il modello. Al posto dell'URL dell'header nel template probabilmente c'è un tag. Quello che ci dovrebbe essere sicuramente è la larghezza. Prova a cercare
    984px o anche solo 984
    e controlla che ci sia una sola occorrenza. Poi prova a modificare la larghezza e a portare il margine verso sinistra di 25 pixel come detto nel commento 7.a
    @#

    RispondiElimina
  9. Ciao Ernesto, sai che proprio non lo trovo? Ho copiato e incollato il codice e l'ho messo sul drive per fartelo vedere, se hai un po' di tempo naturalmente e senza impegno.

    https://drive.google.com/file/d/0B4TUekyi5EFGS3VSQ3JxVkZWOWc/edit?usp=sharing

    Grazie mille
    Piergiorgio

    RispondiElimina
  10. ciao ho un problema di spaziatura solo tra il primo post e il secondo tutti gli altri con il tuo consiglio si sono sistemati grazie

    RispondiElimina
    Risposte
    1. Mi spiace ma non saprei proprio quale tag possa essere interessato :)
      Un tag che agisce tra il primo e il secondo post ma non tra gli altri della home. Cosa piuttosto strana che probabilmente dipende dal modello che hai scelto ma non posso azzardare di più
      @#

      Elimina

Non inserire link cliccabili altrimenti il commento verrà eliminato. Metti la spunta a Inviami notifiche per essere avvertito via email di nuovi commenti. Se ti ho aiutato con il post o con le risposte ai commenti condividi su Facebook o su Twitter. Grazie.