Come mostrare il numero di post nelle etichette e nelle ricerche di Blogger.

Come mostrare il numero di post se si visualizzano le pagine delle etichette di Blogger. Come modificare il colore del rettangolo grigio del messaggio.

Quando si clicca su una etichetta viene mostrato un rettangolo grigio che informa il lettore che sta visualizzando l'elenco dei post di quella data categoria. Tale rettangolo grigio viene mostrato anche quando si fa una ricerca con il widget ufficiale di Blogger. Mi sono già occupato di illustrare come nascondere questo messaggio e il rettangolo in cui è inserito. L'aspetto di questo rettangolo grigio è lo stesso di quello delle pagine non trovate e modificando il CSS possiamo creare una pagina non trovata per errore 404 personalizzata.

Nei blog con molti articoli ci possono essere etichette che contengono decine se non centinaia di post. Vediamo come mostrare il numero degli articoli visibili in una singola schermata. Vogliamo cioè passare dalla situazione del primo screenshot a quella del secondo

Dopo aver salvato il template si va su Modello > Modifica HTML > Vai al widget > Blog1



Si clicca sulla freccetta nera a sinistra per dispiegare tutto il codice. Tramite Ctrl+F o scorrendo il codice verso il basso si cerca quindi la riga

<b:includable id='status-message'>



Anche in questo caso si clicca sulla freccetta nera di sinistra per visualizzarlo interamente



Si seleziona e si cancella il codice da appunto da tale riga compresa fino alla sua chiusura

</b:includable>

come mostrato nello screenshot precedente. Al suo posto si incolla quest'altro codice

              <b:includable id='status-message'> 
  <b:if cond='data:navMessage'>
    <div class='status-msg-wrap'>
      <div class='status-msg-body'>
        <data:navMessage/>
        <div id='contatore1'/>
      </div>
      <div class='status-msg-border'>
        <div class='status-msg-bg'>
          <div class='status-msg-hidden'>
            <data:navMessage/>
            <div id='contatore2'/>
          </div>
        </div>
      </div>
    </div>
    <div style='clear: both;'/>
    <b:if cond='data:blog.pageType == &quot;index&quot;'>
      <b:if cond='data:blog.pageName != &quot;&quot;'>
        <script type='text/javascript'>
          function CountPosts(contatore) {
            var countLabel = &quot;Numero totale di post: &quot;;
            var numPosts = <data:numPosts/>;
            var opLabel = &quot; su &quot;;
            var numPostsTotal = contatore.feed.openSearch$totalResults.$t;
            document.getElementById(&quot;contatore1&quot;).innerHTML = countLabel + numPosts + opLabel + numPostsTotal;
            document.getElementById(&quot;contatore2&quot;).innerHTML = countLabel + numPosts + opLabel + numPostsTotal;
          }
        </script>
        <b:if cond='data:blog.searchLabel != &quot;&quot;'>
          <script expr:src='&quot;/feeds/posts/default/-/&quot; + data:blog.searchLabel + &quot;?alt=json&amp;amp;callback=CountPosts&quot;'/>
        </b:if>
        <b:if cond='data:blog.searchQuery != &quot;&quot;'>
          <script expr:src='&quot;/feeds/posts/default/?alt=json&amp;amp;q=&quot; + data:blog.searchQuery + &quot;&amp;amp;callback=CountPosts&quot;'/>
        </b:if>
      </b:if>
    </b:if>
  </b:if>
</b:includable>

Si salva il modello. Nel caso si volesse ripristinare la situazione precedente anche dopo mesi o anni basterà cancellare questo codice aggiunto e sostituirlo con quello originale di Blogger

<b:includable id='status-message'>
  <b:if cond='data:navMessage'>
  <div class='status-msg-wrap'>
    <div class='status-msg-body'>
      <data:navMessage/>
    </div>
    <div class='status-msg-border'>
      <div class='status-msg-bg'>
        <div class='status-msg-hidden'><data:navMessage/></div>
      </div>
    </div>
  </div>
  <div style='clear: both;'/>
  </b:if>
</b:includable>

APPENDICE CONCLUSIVA

Volendo si può modificare il colore del rettangolo incollando prima della riga ]]></b:skin> il codice

.status-msg-body {
background-color:#FFFFFF;
}

dove si può personalizzare il codice del colore. I più esperti possono anche cimentarsi nell'introdurre ulteriore modifiche aggiungendo nuove righe alla regola della classe.