Doing more with gravatars: Authors template page

By Justin Tadlock on June 9, 2008

Creating a WordPress authors template page

We’ve learned how to add an author bio to single posts and revamp our comments with gravatars. Now, it’s time to take this one step farther.

We’re going to create a template page for all of our authors.

This can be useful if you have multiple authors on your site and want to have a page that lists all of them. It’ll let users get to know each author a little before diving into their posts.

Note to my theme users: Of course, all of this stuff is being built right into the development versions of my themes. So, you can look forward to some of this stuff being added in future updates.

Here are the steps required in doing this:

Give your authors some biographical information from your WordPress dashboard.
Create a template page to display each author.
Write a new Page and save it with your new template.

Oh, and you might want to get a gravatar if you don’t have one.

Setting up your authors biographical information

Well, there’s no use in having an authors page without showing some biographical information along with each author.

Log into your WordPress dashboard and click on the “Users” link. From there, you can select any user you want to add information for. Scroll down to the bottom of the screen, and you’ll see a section named “Biographical Info.” Just type whatever you want about yourself or a particular author.

Writing author bios in the WordPress dashboard

Click “Update Profile” to save this new information. You’ll probably want each author of your blog to write a short blurb that suits them.

Creating the authors template

The first thing we need to do is name our template (very important!) and get the header file. I’ve named this template “Authors” for simplicity.

<?php /*
Template Name: Authors
*/ ?>

<?php get_header(); ?>

Then, we need to set up a basic loop to show the title and content of the page. This way, you can still write a little describing the page later.

<?php if(have_posts()) : while(have_posts()) : the_post(); ?>

	<div class="post">
		<h2 class="section-header">
			<a href="<?php the_permalink(); ?>" title="<?php the_title(); ?>"><?php the_title(); ?></a>
		</h2>
		<div class="entry">
			<?php the_content(); ?>
		</div>
	</div>

<?php endwhile; endif; ?>

Now, we can move on to the backbone of this template page, which will show all of our author profiles.

Before we display any information, we need to actually grab the information from the database. I tried to comment this well enough for everyone to reasonably understand what’s going on.

<?php

// Get the authors from the database ordered by user nicename
	global $wpdb;
	$query = "SELECT ID, user_nicename from $wpdb->users ORDER BY user_nicename";
	$author_ids = $wpdb->get_results($query);

// Loop through each author
	foreach($author_ids as $author) :

	// Get user data
		$curauth = get_userdata($author->ID);

	// If user level is above 0 or login name is "admin", display profile
		if($curauth->user_level > 0 || $curauth->user_login == 'admin') :

		// Get link to author page
			$user_link = get_author_posts_url($curauth->ID);

		// Set default avatar (values = default, wavatar, identicon, monsterid)
			$avatar = 'wavatar';
?>

Now for the actual display of the author profiles. We’ll just show each author’s gravatar, display name, and description with the gravatar and display name linked to the author’s archive page.

I’m treating each profile as a post, so I won’t have to add additional CSS to my stylesheet to get them to display properly.

<div class="post">

	<a href="<?php echo $user_link; ?>" title="<?php echo $curauth->display_name; ?>">
		<?php echo get_avatar($curauth->user_email, '96', $avatar); ?>
	</a>

	<h3 class="post-title">
		<a href="<?php echo $user_link; ?>" title="<?php echo $curauth->display_name; ?>"><?php echo $curauth->display_name; ?></a>
	</h3>

	<p>
		<?php echo $curauth->description; ?>
	</p>

</div>

After that, we just need to close off everything we’ve opened.

		<?php endif; ?>

	<?php endforeach; ?>

<?php get_footer(); ?>

Just save this file as “authors.php” and drop it in the folder of the theme you’re currently using. You have to save this before moving on to the next step.

Writing our authors page

Once the above is done, all we have to do is create a new page. We go back into our WordPress dashboard and click on “Write > Page” to do this.

Give your new page a title; something like “Authors” might work. Maybe write a few sentences describing what this page is for.

For the most important part (you can’t forget this), find the section titled “Page Template.” There’ll be a drop-down list of page templates to choose from. Select the “Authors” template.

Selecting the Authors template from your WordPress Write Page panel

Once that’s done, you can publish your new page and view it on the Web.

Other things you can display

There are a few other things you can display as well. For example, you might want to give a link back to the author’s personal website or show their email. From the author templates page in the WordPress Codex, there’s a list of things you can show (I’m sure they don’t mind me borrowing them for this post).

These things are all configurable from the user profile edit page. Just make sure you use them after the line:

$curauth = get_userdata($author);

from the above code.

$curauth->aim;
$curauth->description;
$curauth->display_name;
$curauth->first_name;
$curauth->ID;
$curauth->jabber;
$curauth->last_name;
$curauth->nickname;
$curauth->user_email;
$curauth->user_login;
$curauth->user_nicename;
$curauth->user_registered;
$curauth->user_url;
$curauth->yim;

Go ahead and create your authors template

This should be a mandatory page for multi-author blogs. It will let your users get to know each author a little better.

As mentioned earlier, I will be incorporating this template into my themes, so if you’re using one of them, look forward to this feature in the next update.

If you need help implementing this, just stop by the support forums because it’s much easier to post code there.

Posted in WordPress | Tagged Gravatars, WordPress, WordPress Tutorials

Articles in this series