viernes, 12 de agosto de 2011

Firma en los comentarios del Administrador en Blogger

En este tutorial les enseñaré a añadir una firma de los comentarios del autor tal como yo lo tengo en mi blog. Es un poco complicado por lo que recomiendo que hagan un backup de su plantilla. Además de la firma, se pueden personalizar los mensajes del autor de forma independiente.


El resultado es el siguiente:


Reitero, haz una copia de seguridad de tu plantilla ya que este tutorial es un poco complicado ya que las plantillas no son todas iguales y es muy posible que este tutorial no sea apto para la tuya, las plantillas clásicas de Blogger no funcionan con esta característica.

Paso 1: Añadiendo la nueva estructura:

En ''Diseño | Edición HTML'', deberás marcar la casilla ''Expandir plantillas de artilugios''. Deberás buscar un código muy similar a este, y añade todo lo que se encuentre en verde. Para encontrar mas fácilmente el código es mejor que busques a base de similitudes. El código en cuestión es el siguiente:

<dl id='comments-block'>
<b:loop values='data:post.comments' var='comment'>
<dt class='comment-author' expr:id='"comment-" + data:comment.id'>
<a expr:name='"comment-" + data:comment.id'/>

<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>
dijo...
</dt>

<b:if cond='data:comment.author == data:post.author'>
<dd class='comment-body-author'>
<p><data:comment.body/></p>
 <div id='firma'>
Este es el mensaje que se verá en la firma.
</div>
</dd>

<b:else/>

<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>

</b:if>

<dd class='comment-footer'>
<span class='comment-timestamp'>
<a expr:href='"#comment-" + data:comment.id' title='comment permalink'>
<data:comment.timestamp/>
</a>
<b:include data='comment' name='commentDeleteIcon'/>
</span>
</dd>
</b:loop>
</dl>

Recuerda que los códigos deben estar correctamente posicionados o de lo contrario al guardar puede arrojar errores de estructura.

Paso 2: Añadiendo CSS:

Ahora deberás buscar la siguiente sección en tu plantilla:
]]></b:skin>
Arriba de esta, deberás pegar el siguiente código:

#firma {
border-top: 1px solid #efefef;
border-bottom: 1px solid #efefef;
padding:4px;
font-size:12px;
font-family: 'Arial Narrow', sans-serif;
margin-left:-20px;
text-align:right;
margin-right:-10px;
padding-left:10px;
}
.comment-body-author { /*ESTILOS PARA LOS COMENTARIOS DEL ADMIN*/
background: #fff; /*Color de fondo */
color: #000; /*Color del texto*/
border: 1px solid #223344; /*Borde*/
margin:0; /*Márgenes*/
padding:10px; /*Espaciados internos*/
}
Guarda los cambios y listo.

Importante:
  • Si no consigues que el tutorial funcione en tu plantilla, es posible que no permita el código y por lo tanto será imposible hacer esto.

  • Las plantillas clásicas no funcionan ya que no existen ciertas etiquetas, sólo las collapseable.

  • Si tienes muchos problemas y las etiquetas existen, puedes enviar la plantilla y yo mismo puedo hacer el cambio.



No hay comentarios:

Publicar un comentario