Incluir sección 'Acerca del autor' en el pie de tus entradas
La plataforma Wordpress ofrece una pequeña ventaja: la posibilidad de añadir al pie de cada artículo una pequeña biografía acerca del autor que lo escribe e incluso una imagen de éste. Son muchos los lectores que me han preguntado si podríamos incluir este artilugio en un blog de blogger y por suerte, la respuesta es afirmativa.
No solo podrás incluir una breve descripción de ti sino que dispondrás de un espacio para mostrar una foto o avatar e incluso enlaces a otras páginas.
1) Busca este bloque de código en tu plantilla y elimínalo:
2) Localiza la línea <data:post.body/> y justo debajo añade esto:
3) Tan solo debes escribir tu biografía e incluir tu foto / avatar reemplazando URL IMAGEN con la dirección de ésta. No necesitas escribir tu nombre ya que aparecerá de forma automática. Si lo deseas puedes editar la frase en el código que aparecerá como título "AUTOR DEL ARTÍCULO:".
El recuadro con tu biografía podrá visualizarse al pie de todas las entradas en cualquier apartado del blog. Para mostrarlo únicamente en las páginas de entradas individuales, añade las líneas resaltadas en negrita al principio y al final del primer bloque -respectivamente-:
Guarda la plantilla para terminar.
Si en el blog escribe más de un blogger y deseas aplicar este truco para ofrecer un recuadro de información personal a cada administrador haz lo siguiente.
Sigue los mismos pasos citados anteriormente pero en lugar de incluir el primer bloque de código en el paso 2, haz uso de bloques como estos:
Cada vez que desees añadir un nuevo autor, agrega lo siguiente antes del cierre </div>:
Sustituye NOMBRE AUTOR por el nombre del autor tal y como aparece en su perfil de blogger (utilizando espacios, tildes o carácteres especiales si los posee).
Guarda la plantilla y listo.
Notas:
No solo podrás incluir una breve descripción de ti sino que dispondrás de un espacio para mostrar una foto o avatar e incluso enlaces a otras páginas.
Diseño>Edición de HTML>expandimos artilugios
1) Busca este bloque de código en tu plantilla y elimínalo:
<span class='post-author vcard'>
<b:if cond='data:top.showAuthor'>
<data:top.authorLabel/>
<span class='fn'>
<data:post.author/>
</span>
</b:if>
</span>
2) Localiza la línea <data:post.body/> y justo debajo añade esto:
<div id='Sobreauttrblcn'>
<img border='0' src='URL IMAGEN'/><div id='blAAut'><span style='font-style:italic; font-size:10px;'>AUTOR DEL ARTÍCULO:</span> <strong><data:post.author/></strong></div>
<p>BREVE BIOGRAFIA DEL AUTOR</p>
</div>
<style>
#Sobreauttrblcn {font-family:Arial,helvetica,sans-serif;background:#F4F4F4;border:1px solid #CCCCCC;color:#424242;font-size:12px;letter-spacing:0;margin:20px 0;padding:6px;text-transform:none;}
#blAAut {border-bottom:3px solid #DDDDDD;width:80%;}
#Sobreauttrblcn strong {padding-left:6px;color:#333333;font-weight:bold;font-size:13px;}
#Sobreauttrblcn img {background:#FFFFFF;border:1px solid #CCCCCC;float:right;
height:70px;margin:4px 4px 8px 6px;width:70px;}
</style>
3) Tan solo debes escribir tu biografía e incluir tu foto / avatar reemplazando URL IMAGEN con la dirección de ésta. No necesitas escribir tu nombre ya que aparecerá de forma automática. Si lo deseas puedes editar la frase en el código que aparecerá como título "AUTOR DEL ARTÍCULO:".
El recuadro con tu biografía podrá visualizarse al pie de todas las entradas en cualquier apartado del blog. Para mostrarlo únicamente en las páginas de entradas individuales, añade las líneas resaltadas en negrita al principio y al final del primer bloque -respectivamente-:
<b:if cond='data:blog.pageType == "item"'>
<div id='Sobreauttrblcn'>
<img border='0' src='URL IMAGEN'/><div id='blAAut'><span style='font-style:italic; font-size:10px;'>AUTOR DEL ARTÍCULO:</span> <strong><data:post.author/></strong></div>
<p>BREVE BIOGRAFIA DEL AUTOR</p>
</div>
</b:if>
Guarda la plantilla para terminar.
Para blogs con más de un autor
Si en el blog escribe más de un blogger y deseas aplicar este truco para ofrecer un recuadro de información personal a cada administrador haz lo siguiente.
Sigue los mismos pasos citados anteriormente pero en lugar de incluir el primer bloque de código en el paso 2, haz uso de bloques como estos:
<div id='Sobreauttrblcn'><b:if cond='data:post.author == "NOMBRE AUTOR"'>
<img border='0' src='<span style="color: rgb(204, 102, 0);">URL IMAGEN</span>'/><div id='blAAut'><span style='font-style:italic; font-size:10px;'><span style="color: rgb(51, 102, 102);">AUTOR DEL ARTÍCULO:</span></span> <strong><data:post.author/></strong></div>
<p><span style="color: rgb(0, 153, 0);">BREVE BIOGRAFIA DEL AUTOR</span></p></b:if>
<div id='Sobreauttrblcn'><b:if cond='data:post.author == "NOMBRE AUTOR"'>
<img border='0' src='<span style="color: rgb(204, 102, 0);">URL IMAGEN</span>'/><div id='blAAut'><span style='font-style:italic; font-size:10px;'><span style="color: rgb(51, 102, 102);">AUTOR DEL ARTÍCULO:</span></span> <strong><data:post.author/></strong></div>
<p><span style="color: rgb(0, 153, 0);">BREVE BIOGRAFIA DEL AUTOR</span></p></b:if>
</div>
Cada vez que desees añadir un nuevo autor, agrega lo siguiente antes del cierre </div>:
<div id='Sobreauttrblcn'><b:if cond='data:post.author == "NOMBRE AUTOR"'>
<img border='0' src='<span style="color: rgb(204, 102, 0);">URL IMAGEN</span>'/><div id='blAAut'><span style='font-style:italic; font-size:10px;'><span style="color: rgb(51, 102, 102);">AUTOR DEL ARTÍCULO:</span></span> <strong><data:post.author/></strong></div>
<p><span style="color: rgb(0, 153, 0);">BREVE BIOGRAFIA DEL AUTOR</span></p></b:if>
Sustituye NOMBRE AUTOR por el nombre del autor tal y como aparece en su perfil de blogger (utilizando espacios, tildes o carácteres especiales si los posee).
Guarda la plantilla y listo.
Notas:
- Editar el aspecto del recuadro es muy sencillo. Deja un comentario en caso de necesitar ayuda.
- La biografía de cada autor que se muestra en las imágenes de ejemplo son ficticias.
- La biografía de cada autor que se muestra en las imágenes de ejemplo son ficticias.
0 comentarios:
Publicar un comentario
¡Gracias por comentar!