En esta publicación, mostraremos el código básico necesario para agregar una biografía de autor a su tema de WordPress. Ahora, esta guía está dirigida a los desarrolladores que quieren el código básico para agregar a su tema. Si no es un desarrollador y el tema que está usando no incluye una biografía del autor, la mejor solución es utilizar un complemento, en cuyo caso puede consultar nuestra otra publicación «Cómo agregar un cuadro de autor a su sitio de WordPress» para algunas sugerencias. Ahora, entremos en el código:
Autor Bio PHP / HTML
El siguiente código de muestra lo ayudará a empezar a agregar la biografía de su autor a su sitio. Este código mostrará el nombre y la descripción del autor. El nombre se vinculará a la página de publicaciones del autor. Por lo general, este código se agregaría debajo de las publicaciones de su blog, por lo que en algún lugar dentro del archivo single.php o singular.php. Solo asegúrate de cambiar text_domain por el de tu tema. Dominio de texto y puede cambiar el «60» al tamaño que desee que tenga su avatar de autor.
<div id="author-bio">
<div id="author-avatar"><?php echo get_avatar( get_the_author_meta( 'ID' ), 60 ); ?></div>
<div id="author-details">
<h2><?php esc_html_e( 'Artículo Written by', 'text_domain' ); ?></strong> <?php the_author_posts_link(); ?></h2>
<?php the_author_description(); ?>
</div><!-- #author-details -->
</div><!-- #author-bio -->Ejemplo de autor Bio CSS
A continuación se muestra algo de CSS que puede agregar a su archivo style.css para darle a su cuadro de autor un estilo básico.
#author-bio {
padding: 20px 0;
border-top: 1px solid #ddd;
border-bottom: 1px solid #ddd;
}
#author-avatar {
float: left;
margin-right: 20px;
border: 1px solid #D6D6D6;
border-radius: 5px;
}
#author-details {
overflow: hidden;
}
#author-details h2 {
font-size: 18px;
font-weight: bold;
margin: 0 0 15px;
}¿Cómo agregar la descripción de la biografía de su autor?
Para que la descripción aparezca en la sección de biografía, debe agregarla a su perfil de usuario en su panel de WordPress. Esto se hace en la pantalla de edición de usuario a la que puede entrar a través de Usuarios> Su perfil y editar el «información biográfica”Campo.
