Come inserire i commenti dell'autore del blog in un rettangolo colorato.

Per evidenziare i commenti dell'autore del blog rispetto a quelli dei lettori possiamo inserirli all'interno di un rettangolo magari colorato. Per prima cosa bisogna andare su Layout>Modifica HTML>Scarica modello completo per fare il backup se le cose andassero storte. Occorre trovare la sezione dei commenti nel modello. Vi faccio vedere quella che ho trovato nel mio modello, in altri più o meno non dovrebbe differire di molto; in genere inizia con il tag

<dl id='comments-block'> e finisce con </dl>

Ci sono però dei modelli in cui inizia con <ul>. Ecco il codice che ho trovato nel mio modello

<dl id='comments-block'>       <b:loop values='data:post.comments' var='comment'>          <dt expr:class='&quot;comment-author &quot; + data:comment.authorClass' expr:id='data:comment.anchorName'>            <a expr:name='data:comment.anchorName'/>            <b:if cond='data:comment.authorUrl'>              <a expr:href='data:comment.authorUrl' rel='nofollow'><data:comment.author/></a>            <b:else/>             <data:comment.author/>            </b:if>            <data:commentPostedByMsg/>          </dt>          <dd class='comment-body'>            <b:if cond='data:comment.isDeleted'>              <span class='deleted-comment'><data:comment.body/></span>            <b:else/>              <p> <data:comment.body/> </p>            </b:if>          </dd>          <dd class='comment-footer'>            <span class='comment-timestamp'>              <a expr:href='data:comment.url' title='comment permalink'>                <data:comment.timestamp/>              </a>              <b:include data='comment' name='commentDeleteIcon'/>            </span>          </dd>        </b:loop>      </dl>

Se non siete sicuri di dove sia questa sezione cercate una delle tre seguenti linee di codice, p.e. con il sistema mostrato in questo articolo relativo a consigli sull'HTML

<b:loop values='data:post.comments' var='comment'> <data:comment.author/> <data:comment.body/>

 Nel codice trovato nel mio blog le tre linee sono colorate di rosso. Per poter modificare i commenti dell'autore sostituitelo totalmente con quest'altro codice

<ul class='commentlist' style='margin: 0; padding: 0;'> <b:loop values='data:post.comments' var='comment'> <b:if cond='data:comment.author == data:post.author'> <li class='author-comments' style='margin: 0 0 10px 0;'> <b:if cond='data:post.dateHeader'> <div class='commentcount'/> </b:if> <cite> <b:if cond='data:comment.authorUrl'> <a expr:href='data:comment.authorUrl'><data:comment.author/></a> <b:else/> <data:comment.author/> </b:if> </cite> <br/> <div style='clear: both;'/> <b:include data='comment' name='commentDeleteIcon'/> <p><data:comment.body/></p> <div class='commentlink-date'><a class='commentlink' expr:href='"#comment-" + data:comment.id' title='comment permalink'> <data:comment.timestamp/> </a></div> <div class='clear'/> </li> <b:else/> <li class='general-comments' style='margin: 0 0 10px 0;'> <b:if cond='data:post.dateHeader'> <div class='commentcount'/> </b:if> <cite> <b:if cond='data:comment.authorUrl'> <a expr:href='data:comment.authorUrl'><data:comment.author/></a> <b:else/> <data:comment.author/> </b:if> </cite> <br/> <div style='clear: both;'/> <b:include data='comment' name='commentDeleteIcon'/> <p><data:comment.body/></p> <div class='commentlink-date'><a class='commentlink' expr:href='"#comment-" + data:comment.id' title='comment permalink'> <data:comment.timestamp/> </a></div> <div class='clear'/> </li> </b:if> </b:loop> </ul>

 Salvate il modello. Adesso occorre aggiungere lo stile per i commenti dell'autore. Cercate la seguente linea di codice

]]></b:skin>

immediatamente sopra incollate quest'altro codice

.author-comments { background: #EEEEFF; border: 2px solid #19265B; padding: 5px; }

 

La parte del codice colorata di rosso può essere personalizzata

• EEEEFF rappresenta il colore di sottofondo dei commenti, in questo caso un celestino chiaro chiaro ma si può scegliere il colore che si vuole
• 2 sta a indicare il numero dei pixel del bordo, si può mettere anche 1 o 3 se si vuole più sottile o più spesso
• 19265B è il colore del bordo del rettangolo del mio blog che è uguale a quello dell'intestazione, ciascuno naturalmente può mettere il colore che vuole.

Ecco come si presenta l'area dei commenti dopo queste modifiche

Fonte - Blogger Buster