Aprende en este tutorial cómo mostrar el avatar del autor en las entradas o posts de un child theme de Genesis mediante código.
En anteriores tutoriales te expliqué como puedes modificar la información que se muestras debajo del título de las entradas.
Además, a partir de Genesis 2.9 puedes controlar los metadatos que se muestran desde el personalizador de WordPress, en Ajustes de tema > Contenido individual.
Pero todavía no te había explicado cómo mostrar el avatar del autor de una entrada justo debajo del título. El resultado puede ser algo así:
Pero puedes ajustarlo tu tema. Vamos a ver cómo.
Pasos para mostrar el avatar del autor debajo del título
1. «Engancha» el avatar a un hook de Genesis
Añade el siguiente snippet al fichero functions.php:
Para ver este código y los otros 2055 snippets de esta web,
identifícate o suscríbete aquí.
Con este fragmento aprovechas el filtro genesis_before_entry_content y la etiqueta condicional is_single para colocar la imagen del autor justo antes del contenido de las entradas.
Además, utilizas la función get_avatar y en el segundo parámetro indicas el tamaño de la imagen. En este caso es de 72 píxeles, pero puedes modificarlo a tu gusto.
Para que se muestre solo el nombre del autor puedes hacerlo desde el personalizador de WordPress, en Ajustes de tema > Contenido individual o utilizar este snippet de código:
Para ver este código y los otros 2055 snippets de esta web,
identifícate o suscríbete aquí.
Ya tienes la parte estructural resuelta, ahora vamos a por el diseño. 😉
2. Personaliza los estilos del avatar
Una vez añadido, necesitas editar el CSS para que el nuevo campo se muestre de forma correcta en todos los dispositivos.
Para ello, añade el siguiente snippet al final del fichero style.css:
Para ver este código y los otros 2055 snippets de esta web,
identifícate o suscríbete aquí.
Dependiendo del child themes de Genesis que estes usando (en este caso está basado en Genesis Sample) es posible que necesitas ajustar un poco el CSS.
Conclusiones
Si quieres mostrar el avatar del autor debajo del título de las entradas de un child theme de Genesis ahora ya sabes cómo hacerlo con un poco de código.
¿Prefieres que lo adapte a alguno de ellos en particular? Envíame la propuesta a través del formulario de contacto y prepararé un tutorial a medida.
Ventajas de ser suscriptor. 😉
