Diferenciar a los comentaristas

¿Es posible hacer que los comentarios anónimos sean diferentes de los que tienen una cuenta? Sí, y de hecho Blogger lo hace sólo, agrega una imagen para usuarios de Google, OpenID y Anónimos, esto lo hace con data:comment.authorClass que genera el tipo de comentarista:

blogger-comment-icon cuando se está logueado en Blogger
openid-comment-icon si comenta logueado con OpenId
anon-comment-icon comentario de un anónimo

En el siguiente ejemplo hay que tener desactivada la opción de mostrar la imagen del perfil (los avatares).

Configuración | Comentarios

¿Mostrar imágenes de perfil en los comentarios? Sí No

Ahora en Diseño | Edición de HTML y marcamos Expandir plantillas de artilugios y buscamos un código como este:
MOSTRAR

      <dl expr:class='data:post.avatarIndentClass' 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'>
            <b:if cond='data:comment.favicon'>
              <img expr:src='data:comment.favicon' height='16px' style='margin-bottom:-2px;' width='16px'/>
            </b:if>
            <a expr:name='data:comment.anchorName'/>
            <b:if cond='data:blog.enabledCommentProfileImages'>
              <data:comment.authorAvatarImage/>
            </b:if>
            <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>

Después de la apertura del loop se abrirá un DIV con la clase de cada tipo comentario y antes del cierre del loop se cerrará dicho DIV.

      <dl expr:class='data:post.avatarIndentClass' id='comments-block'>
        <b:loop values='data:post.comments' var='comment'>
<div expr:class='&quot;comment-author-&quot; + data:comment.authorClass'>
          <dt expr:class='&quot;comment-author &quot; + data:comment.authorClass' expr:id='data:comment.anchorName'>
            <b:if cond='data:comment.favicon'>
              <img expr:src='data:comment.favicon' height='16px' style='margin-bottom:-2px;' width='16px'/>
            </b:if>
            <a expr:name='data:comment.anchorName'/>
            <b:if cond='data:blog.enabledCommentProfileImages'>
              <data:comment.authorAvatarImage/>
            </b:if>
            <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>
</div>
        </b:loop>
      </dl>

Ahora agregamos los estilos antes de ]]></b:skin>:

/* Los comentarios de Blogger */
div.comment-author-blogger-comment-icon {
  background: #FF8020;
  padding:10px;
  -moz-border-radius:10px;
  -webkit-border-radius:10px;
  -khtml-border-radius:10px;
  margin:0 0 5px 0;
}
div.comment-author-blogger-comment-icon .comment-author {

}
div.comment-author-blogger-comment-icon .comment-body {

}
div.comment-author-blogger-comment-icon .comment-footer {

}
div.comment-author-blogger-comment-icon .comment-body p {

}


/* Los comentarios de OpenID */
div.comment-author-openid-comment-icon {
  background: #A0C0ff;
  padding:10px;
  -moz-border-radius:10px;
  -webkit-border-radius:10px;
  -khtml-border-radius:10px;
  margin:0 0 5px 0;
}
div.comment-author-openid-comment-icon .comment-author {

}
div.comment-author-openid-comment-icon .comment-body {

}
div.comment-author-openid-comment-icon .comment-footer {

}
div.comment-author-openid-comment-icon .comment-body p {

}

/* Los comentarios de Anónimos */
div.comment-author-anon-comment-icon {
  background: #80C0C0;
  padding:10px;
  -moz-border-radius:10px;
  -webkit-border-radius:10px;
  -khtml-border-radius:10px;
  margin:0 0 5px 0;
}
div.comment-author-anon-comment-icon .comment-author {

}
div.comment-author-anon-comment-icon .comment-body {

}
div.comment-author-anon-comment-icon .comment-footer {

}
div.comment-author-anon-comment-icon .comment-body p {

}

En mi ejemplo le agregué un color de fondo naranja a los usuarios con cuenta Google, no soy muy bueno para el nombre de los colores así que digamos que para OpenID es una tonalidad de azul y para los anónimos en verde. Las posibles definiciones son muchas, depende de nuestra imaginación y conocimientos. [Ver demo]

Fácil, simple y es poco el código. Seamos más específicos; los comentarios de usuarios registrados se dividen en dos: usuarios con cuenta Google/Blogger y con OpenID, mientras que los anónimos hay tres: los anónimos propiamente dichos y los que comentan como Nombre/URL que dejan sólo un nombre y los que dejan nombre y url.
Para esto usaremos condicionales que detecten a cada tipo y subtipo de comentarista.

Primero detectaremos a los usuarios de Blogger, luego a los de OpenID y de últimos a los subtipos de anónimos:

<!-- Comentarios de Blogger -->
<b:if cond='data:comment.authorClass == &quot;blogger-comment-icon&quot;'>
<div expr:class='&quot;comment-author-&quot; + data:comment.authorClass'>
          <dt expr:class='&quot;comment-author &quot; + data:comment.authorClass' expr:id='data:comment.anchorName'>
            <b:if cond='data:comment.favicon'>
              <img expr:src='data:comment.favicon' height='16px' style='margin-bottom:-2px;' width='16px'/>
            </b:if>
            <a expr:name='data:comment.anchorName'/>
            <b:if cond='data:blog.enabledCommentProfileImages'>
              <data:comment.authorAvatarImage/>
            </b:if>
            <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>
</div>
</b:if>


<!-- Comentarios de OpenID -->
<b:if cond='data:comment.authorClass == &quot;openid-comment-icon&quot;'>
<div expr:class='&quot;comment-author-&quot; + data:comment.authorClass'>
          <dt expr:class='&quot;comment-author &quot; + data:comment.authorClass' expr:id='data:comment.anchorName'>
            <b:if cond='data:comment.favicon'>
              <img expr:src='data:comment.favicon' height='16px' style='margin-bottom:-2px;' width='16px'/>
            </b:if>
            <a expr:name='data:comment.anchorName'/>
            <b:if cond='data:blog.enabledCommentProfileImages'>
              <data:comment.authorAvatarImage/>
            </b:if>
            <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>
</div>
</b:if>


<!-- Comentarios de Anónimos -->
<b:if cond='data:comment.authorClass == &quot;anon-comment-icon&quot;'>
<b:if cond='data:comment.authorUrl'>
<!-- Comentarios de Anónimos con nombre y url -->
<div class='comment-author-anon-comment-icon-anon-url'>
          <dt expr:class='&quot;comment-author &quot; + data:comment.authorClass' expr:id='data:comment.anchorName'>
            <b:if cond='data:comment.favicon'>
              <img expr:src='data:comment.favicon' height='16px' style='margin-bottom:-2px;' width='16px'/>
            </b:if>
            <a expr:name='data:comment.anchorName'/>
            <b:if cond='data:blog.enabledCommentProfileImages'>
              <data:comment.authorAvatarImage/>
            </b:if>
            <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>
</div>
<b:else/>

<!-- Comentarios de Anónimos propiamente -->
<b:if cond='data:comment.author == &quot;Anónimo&quot;'>
<div class='comment-author-anon-comment-icon-anon'>
          <dt expr:class='&quot;comment-author &quot; + data:comment.authorClass' expr:id='data:comment.anchorName'>
            <b:if cond='data:comment.favicon'>
              <img expr:src='data:comment.favicon' height='16px' style='margin-bottom:-2px;' width='16px'/>
            </b:if>
            <a expr:name='data:comment.anchorName'/>
            <b:if cond='data:blog.enabledCommentProfileImages'>
              <data:comment.authorAvatarImage/>
            </b:if>
            <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>
</div>
<b:else/>

<!-- Comentarios de Anónimos con nombre pero sin url -->
<div class='comment-author-anon-comment-icon-anon-name'>
          <dt expr:class='&quot;comment-author &quot; + data:comment.authorClass' expr:id='data:comment.anchorName'>
            <b:if cond='data:comment.favicon'>
              <img expr:src='data:comment.favicon' height='16px' style='margin-bottom:-2px;' width='16px'/>
            </b:if>
            <a expr:name='data:comment.anchorName'/>
            <b:if cond='data:blog.enabledCommentProfileImages'>
              <data:comment.authorAvatarImage/>
            </b:if>
            <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>
</div>
</b:if>
</b:if>
</b:if>

Elaboré una explicación simple del código de anónimos por si a alguien le interesa
MOSTRAR

Anónimos Nombre/URL con nombre y url
Están dentro de dos condicionales, una detecta que sean anónimos y otra que tengan url, si es un anónimo con url por ende tiene un nombre cualquiera.

Anónimos propiamente dichos
Están dentro de la condiconal que verifica que el nombre del comentarista se Anónimo que a su vez está dentro del else de la condicional que verifica que tenga una url (el else indica la acción opuesta) y que está dentro de la primera condicional que detecta que sea un anónimo.
No es algo relevante pero cuando alguien comente como Nombre/URL y en nombre ponga Anónimo y sin dejar url será conciderado un anónimo propiamente dicho, si colocara la url pasaría a ser uno con nombre y url.

Anónimos Nombre/URL con nombre pero sin url
Están dentro del else de la condicional que verifica que el nombre sea Anónimo (como está dentro del else el nombre debe ser cualquiera excepto Anónimo) y dentro del else de la condicional que verifica que tenga una url que también está dentro de la primera condicional que detecta que sea un anónimo.

No sé, tal vez lo expliqué más confuso.

Los tres códigos van dentro de la etiqueta b:loop:

      <dl expr:class='data:post.avatarIndentClass' id='comments-block'>
<b:loop values='data:post.comments' var='comment'>

Aquí van los tres códigos

</b:loop>
</dl>

Falta agregar los estilos antes de ]]></b:skin>:

/* Los comentarios de Blogger */
div.comment-author-blogger-comment-icon {
  background: #FF8020;
  padding:10px;
  -moz-border-radius:10px;
  -webkit-border-radius:10px;
  -khtml-border-radius:10px;
  margin:0 0 5px 0;
}
div.comment-author-blogger-comment-icon .comment-author {

}
div.comment-author-blogger-comment-icon .comment-body {

}
div.comment-author-blogger-comment-icon .comment-footer {

}
div.comment-author-blogger-comment-icon .comment-body p {

}


/* Los comentarios de OpenID */
div.comment-author-openid-comment-icon {
  background: #A0C0ff;
  padding:10px;
  -moz-border-radius:10px;
  -webkit-border-radius:10px;
  -khtml-border-radius:10px;
  margin:0 0 5px 0;
}
div.comment-author-openid-comment-icon .comment-author {

}
div.comment-author-openid-comment-icon .comment-body {

}
div.comment-author-openid-comment-icon .comment-footer {

}
div.comment-author-openid-comment-icon .comment-body p {

}
/* Los comentarios de Anónimos propiamente */
  div.comment-author-anon-comment-icon-anon {
  background: #80C0C0;
  padding:10px;
  -moz-border-radius:10px;
  -webkit-border-radius:10px;
  -khtml-border-radius:10px;
  margin:0 0 5px 0;
}
div.comment-author-anon-comment-icon-anon .comment-author {

}
div.comment-author-anon-comment-icon-anon .comment-body {

}
div.comment-author-anon-comment-icon-anon .comment-footer {

}
div.comment-author-anon-comment-icon-anon .comment-body p {

}
/* Los comentarios de Anónimos con url */
div.comment-author-anon-comment-icon-anon-url {
  background: #91D1D1;
  padding:10px;
  -moz-border-radius:10px;
  -webkit-border-radius:10px;
  -khtml-border-radius:10px;
  margin:0 0 5px 0;
}
div.comment-author-anon-comment-icon-anon-url .comment-author {

}
div.comment-author-anon-comment-icon-anon-url .comment-body {

}
div.comment-author-anon-comment-icon-anon-url .comment-footer {

}
div.comment-author-anon-comment-icon-anon-url .comment-body p {

}
/* Los comentarios de Anónimos con nombre */
div.comment-author-anon-comment-icon-anon-name {
  background: #AEEEEE;
  padding:10px;
  -moz-border-radius:10px;
  -webkit-border-radius:10px;
  -khtml-border-radius:10px;
  margin:0 0 5px 0;
}
div.comment-author-anon-comment-icon-anon-name .comment-author {

}
div.comment-author-anon-comment-icon-anon-name .comment-body {

}
div.comment-author-anon-comment-icon-anon-name .comment-footer {

}
div.comment-author-anon-comment-icon-anon-name .comment-body p {

}

Otra vez en este otro ejemplo sólo cambié los colores, pero podríamos cambiar más cosas.

Para cambiar la imagen de cada caso habría que buscar

<dt expr:class='&quot;comment-author &quot; + data:comment.authorClass' expr:id='data:comment.anchorName'>

Borrar lo que está de color azul, buscar esto:

         <b:if cond='data:comment.favicon'>
          <img expr:src='data:comment.favicon' height='16px' style='margin-bottom:-2px;' width='16px'/>
        </b:if>

Y reemlazarlo por la imagen de nuestro agrado:

<img height='45px' src='URL-IMAGEN' style='margin-bottom:-2px;vertical-align: middle;' width='45px'/>

Aquí hay otro ejemplo un poco más "sofisticado".

Si usamos los avatares todo esto es inútil, no comprendo por qué Blogger desactiva data:comment.authorClass, lo máximo que podríamos personalizar son los avatares de los anónimos y a eso me voy a limitar.

Esto se logra fácilmente con CSS, creo que las definiciones mínimas serían estas:

#comments-block.avatar-comment-indent {
margin-left:0;
}
#comments-block .avatar-image-container {
  float:left;
  height:49px;
  position:static;
  width:49px;
}
#comments-block .avatar-image-container img {
  background:#282C2F url(http://lh5.ggpht.com/_7FKsLpdNk4k/SrWgdBWjBYI/AAAAAAAAIOc/IAElVzxKM7c/anonimo_coment.png) no-repeat 50% 50%;
  border:1px solid #282C2F;
  display:block;
  float:none;
  min-height:45px;
  min-width:45px;
  padding:2px;
  box-shadow: 3px 3px 5px #333;
}

No me gusta el resultado en el caso del icono de OpenID y cuando no hay imagen de perfil, su tamaño es muy pequeño y al redimencionarlo está muy borroso.

Preferí ocultar esos iconos, las definiciones que estoy usando son estas:

/* los avatares en los comentarios */
#comments-block.avatar-comment-indent {
  margin-left:0;
}
#comments-block .avatar-image-container {
  float:left;
  height:49px;
  position:static;
  width:49px;}
#comments-block .avatar-image-container img {
  background:#282C2F url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjat1DvUf23onXetLMUAVBxZs0cj1HUhTKVh4VJuFX6rEcZjSKWKG2wBNor-bpOeJizzZ3x2kOcL9TbrZDHXpErNOCHJHeiQcRGIvu-af8169ppX9CUGrHZXUeuSoC9DnAZTWf5S1N4vkDa/) no-repeat 50% 50%;
  border:1px solid #282C2F;
  display:block;
  float:none;
  min-height:45px;
  min-width:45px;
  padding:2px;
  box-shadow: 3px 3px 5px #333;
}
#comments-block .avatar-image-container.avatar-stock {
  background:#282C2F url(http://lh5.ggpht.com/_7FKsLpdNk4k/SrWgdBWjBYI/AAAAAAAAIOc/IAElVzxKM7c/anonimo_coment.png) no-repeat 50% 50%;
  border:1px solid #282C2F;
}
#comments-block .avatar-image-container.avatar-stock img {
  opacity:0.0;
  filter: alpha(opacity=0);
}

Con Oloman de Oloblogger aprendí a usar otro código usando condicionales.
Localizamos el código que genera la imagen de perfil:
<b:if cond='data:blog.enabledCommentProfileImages'>
<data:comment.authorAvatarImage/>
</b:if>

Y se le sustituye por este:

<b:if cond='data:blog.enabledCommentProfileImages'>

<!-- Comentarios de usuarios registrados y anónimos con url  -->
<data:comment.authorAvatarImage/>
<b:else/>
<b:if cond='data:comment.authorUrl'>

<!-- Anónimo con nombre sin url-->
<b:if cond='data:comment.author != &quot;Anónimo&quot;'>
<div class='avatar-image-container' style='background-image:none !important;'><img src='http://lh5.ggpht.com/_7FKsLpdNk4k/StIiffZ901I/AAAAAAAAIYw/GuoxpoMIbTU/anonimo_nombre.png' style='background-image:none !important;'/></div>
<b:else/>

<!-- Anónimo propiamente -->
<div class='avatar-image-container' style='border:0px;background-image:none !important;'><img src='http://lh5.ggpht.com/_7FKsLpdNk4k/SrWgdBWjBYI/AAAAAAAAIOc/IAElVzxKM7c/anonimo_coment.png' style='background-image:none !important;'/></div>
</b:if>
</b:if>
</b:if>

Oloman aplicó estas definiciones:

#comments-block .avatar-image-container {
  margin-right:5px;
}
#comments-block .avatar-image-container img {
  float: none;
  width:35px;
  height:35px;
  border:1px solid #000000;
}
#comments-block .avatar-image-container.avatar-stock {
  background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgv8kkcgGkZORuUSWMESDCSkcEZKMfsXKLT6-8fo5xSUJ5LdrlKhs7jhC2ahbi_A8stofsQxP3V7T9wdFURVWPK4efSTatV4eK6yHgTzs5aFRC6jArOdU0EYv5g_BGp8LYEIzMxF13XAGXF/s400/sinavatar.gif) transparent no-repeat 50% 50%;}

Esas condicionales no detectan al anónimo con url, lo que hace Blogger es generar la clase avatar-stock para cuando no se tiene imagen de perfil, ya sea usuario de Blogger, OpenID o anónimo. Pero les genera un icono, el de los anónimos es transparente y por eso puede verse la imagen de fondo. [Ver ejemplo].

Personalmente me interesa muy poco diferenciar a los comentaristas unos de otros, prefiero resaltar mis propios comentarios, ¿Cómo hacerlo? Eso lo veremos en otra ocación.

REFERENCIAS:
Personalizar avatares comentaristas
Identificando a los autores de los comentarios
Blogger: Avatares en los comentarios
Blogger: Un poco más sobre los avatares