Blogs / WordPress

Añadir autor de cada post en WordPress sin un plugin

Añadir autor de cada post en WordPress sin un plugin

En casi todas las plantillas de WordPress se muestra en algún lugar el autor de un determinado post o entrada. Si alguien pulsa sobre ese nombre, le llevará a una página específica, en la que se recoge, además de una pequeña biografía, la relación de todos los artículos escritos por esa persona. Si quieres añadir un recuadro con información sobre el autor de un artículo, tal como puedes ver en este sitio, sólo necesitas copiar y pegar unas pequeñas porciones de código en algunos archivos de la plantilla o tema.

Antes de realizar los cambios en el código, debes añadir, si aún no lo has hecho, en la sección de Usuarios -> Tu perfil una pequeña porción de texto en el apartado de Información biográfica. Si aún no tienes creada una cuenta en Gravatar, te recomiendo que lo hagas. Debes también, si quieres añadir los enlaces, tener presentes las URLs de acceso a tus cuentas de Twitter, Facebook y Google+.

Después de efectuar los cambios precisos, debes pegar el código que tienes a continuación en el loop del archivo single.php del tema que tienes activo en WordPress. Lo normal es que lo copies antes de la línea que se encarga de gestionar los comentarios. Algo igual o similar a lo siguiente:

<div id="comments">
<?php comments_template(); ?>
</div>

Este es el código que debes copiar y pegar:

<!-- Inicio Biografía Autor -->
<div class="biografia">
<div class="biografia-avatar">
<?php $author_email = get_the_author_email ();
echo  get_avatar ($author_email, 80);
?>
</div>
<div class="biografia-texto">
<h3>Autor: <a href="http://[tu_sitio]/author/<?php the_author(); ?>"><?php the_author(); ?></a></h3>
<p><?php the_author_description() ; ?></p>
<small><a href="http://[tu_sitio]" title="[titulo_tu_sitio]">Web</a> | <a href="https://twitter.com/#!/[nombre_usuario]" title="
[tu_nombre] En Twitter" target="_blank">Twitter</a> | <a href="http://www.facebook.com/[nombre_usuario]" title="[tu_nombre] En Facebook" target="_blank">Facebook</a> |
 <a href="https://plus.google.com/[ID_tu_cuenta]" title="[tu_nombre] En Google+" target="_blank">Google+</a> | <a href="http://[tu_sitio]/author/<?php the_author(); ?>"
 title="Más Entradas por [tu_nombre]">Más Entradas (<?php the_author_posts(); ?>)</a></small>
</div>
</div>
<!-- Fin Biografía Autor -->

No te olvides de escribir los datos adecuados en [tu_sitio], [titulo_tu_sitio], [nombre_usuario], [tu_nombre] e [ID_tu_cuenta].

En el archivo style.css del tema activo en WordPress pega, al final del mismo, la siguiente porción de código:

/* Inicio Autor */
.biografia h3, .biografia p {
	margin:0 0 10px 0;
	padding:0;
}

.biografia {
	background: #f3f2f0;
	border: 1px solid #000;
	clear: both;
	margin: 20px 0;
	overflow: hidden;
	padding: 20px;
}

.biografia-avatar {
	background: #fff;
	border: 1px solid #e7e7e7;
	float: left;
	height: 80px;
	width: 80px;
	margin: 0 -142px 0 0;
	padding: 10px;
}

.biografia-avatar img {
}

.biografia-texto {
	float: left;
	margin: 0 0 0 120px;
}
/* Fin Biografía */

Si quieres realizar cambios en el color de fondo y en el del borde, sólo tienes que cambiar los valores de background y border en el estilo .biografia. Lo mismo puedes hacer en .biografia-avatar.

Etiquetas

fabriciano

Amante de la informática y de Internet entre otras muchas pasiones. Leo, descifro, interpreto, combino y escribo. Lo hago para seguir viviendo y disfrutando. Trato de dominar el tiempo para que no me esclavice.

Un comentario

  1. Hola te comento intente hacer lo que mencionas en el comentario funciona todo muy bien en cuanto al codigo PHP , pero no se porque razon los estilos los carga y cuando refresco la pagina ya no los toma, osea cuando guardo el editor la pagina toma los estilos y despues refresco la pagina y se borra los estilos css