3 Ways To Link Author Avatar To Archive

This code enables you to display the authors avatar adjacent to the entry title and link it to the authors archive or anywhere else you desire.

Here’s what the code produces when used in the Genesis Sample child theme by StudioPress.

avatar

The code can be modified so you can:

  • Change the link target to any URL
  • Add Schema markup to the source code of the author avatar
  • Style & position the author avatar
  • Add the avatar on archives or single posts simply by changing the conditional tag

The code in this tutorial adds the avatar image before & inline with the post title on the front page.

Here’s the PHP code & CSS for logged in members:

3rd Method

This method adds more schema for the author as seen in the following picture of the source code:

author-schema

add_action( 'genesis_entry_header', 'your_avatar', 1 );
function your_avatar() {

  if ( ! is_front_page() ) 
  return;
  
  $url  = get_author_posts_url( get_the_author_meta( 'ID' ));
  $avatar = get_avatar( get_the_author_meta( 'email' ), 48 );

  $output  = sprintf( '<span %s>', genesis_attr( 'entry-author' ) );
		
		$output .= sprintf( '<a href="%s" %s>', esc_url( $url ), genesis_attr( 'entry-author-link' ) );
		$output .= sprintf( '<span %s>', genesis_attr( 'entry-author-name' ) );
		$output .= $avatar;
		$output .= '</span></a>';
		
echo $output;

}

Tips

  1. If you’re already including the post info in the entry header which includes the author link, you won’t need to use code which adds schema again.
  2. The 3rd parameter of 1 positions the image adjacent to the title when using the Sample child theme. You may need to change this to a higher or lower number to achieve the same result in other Genesis child themes.

Related Tutorials

Join 5000+ Followers

Get The Latest Free & Premium Tutorials Delivered The Second They’re Published.