This post goes along with a presentation I gave at the February Seattle WordPress Developers Meetup. The Seattle WordPress group is pretty amazing and I highly recommend joining if you have the opportunity.

Get the slides and code

If you would like to view the slides used during the presentation they are available as a PDF below:

blobaugh-Feb2012-Extending_WordPress_User_Profiles

The complete code from this presentation can be found on the Seattle WordPress Github account

https://github.com/WordPress-Seattle

Synopsis

There are several built-in user contact methods that are already available on user profiles in WordPress, however the services there are not very widely used today. The built-in contact methods are: AIM, Yahoo IM, and Jabber. Of the three AIM and Yahoo IM are rarely used today, and most general audiences do not know what Jabber is (Jabber is pretty awesome and has wide ranges of uses. Google, for instance, uses Jabber for their chat network). More people today are using services such as Twitter or Facebook, or LinkedIn, so it probably makes sense to update the list of contact methods with whichever are most correct for your site.

What this post will show you is how to tap into the user profile to get rid of unneeded contact methods and add a new one for a user’s Twitter handle. Additionally, when we are done each post will show the post author information box below the content. This is to highlight how easy it is to use the new contact methods to display on the frontend.

Filters

Recall that filters are similar to hooks, except that filters are designed to alter output instead of trigger an event. For our purposes we will be tapping into two filters, one which will allow us access to the user’s contact methods and the other to post content.

We will be using the following two filters:

• user_contactmethods
  Holds a list of contact methods on a profile
• the_content
  Holds the content of a post

Setup the user_contactmethods filter

Filters are easily created using the add_filter() function. This function takes several arguments, however will are only focusing on the first two, which are the WordPress filter name and the name of our custom function to send the filter to. Setup the filter with the following code:

add_filter( ‘user_contactmethods’, ‘wpsea_setup_user_profile’ );

When calling our custom function, wpsea_setup_user_profile(), a variable containing an array of the available contact methods will be passed.

function wpsea_setup_user_profile ( $user_contactmethods ) {}

By default the following exist: AIM, Yahoo Messenger, Jabber

Remove unused contact methods

Contact methods are stored in the passed in parameter, which is an array, and can be removed using the built-in PHP method to remove array elements, unset(). None of the existing contact methods are needed so let’s get rid of them all:

function func_name ( $user_contactmethods ) {
    unset( $user_contactmethods[‘aim’] );
    unset( $user_contactmethods[‘yim’] );
    unset( $user_contactmethods[‘jabber’] );
}

Add a new contact method

This is the really complex part, adding a new contact method (sarcasm). The WordPress core developers have made this very easy on us by providing the user contact methods as an array. To create a new one just create a new, uniquely named, element in the array and viola, a new user contact field will show when editing the user’s profile. Make sure to pick something that makes sense when naming the array element.

function wpsea_setup_user_profile ( $user_contactmethods ) {
    $user_contactmethods[‘twitter’] = ‘Twitter Handle’;
}

Take a peek

If we have done everything correctly you should now be able to activate the plugin and see the changes you made on your profile

Move to the front

Well, we have our backend all spiffed up now with the new contact methods, but unless users only look at profiles from within the backend you will probably be wanting to know how to show your new contact method to visitors on the frontend, this is quite simple. If you are following along with my presentation slides you will notice that I am going to diverge here. The slides explain the various functions used to create our author information box, however I am skipping that here and getting right down to the code.

The get_the_author_meta() function allows frontend developers and designers access to any of the user’s profile fields. get_the_author_meta is usually used within The Loop and gets the current post author automagically, however it can be used anywhere and an optional user id supplied. For our purposes we will be using code similar to:

$twitter_handle = get_the_author_meta( 'twitter' );

Now we need to setup a filter for the_content, which is done with the following line of code:

add_filter( 'the_content', 'wpsea_post_user_profile' );

The rest of the code I will give you in a dump because it is regular display code that should make sense to you already, if not check the Codex or leave a comment and I will add more details.

function wpsea_post_user_profile( $content ) {
    
    if( !is_singular( 'post' ))
        return $content;
    
    $id = get_the_author_meta( 'ID' );

    $s = '
';
    
    // Author gravatar
    $s .= '
' . get_avatar( $id, '150' ) . "
";
    
    // Author info
    $s .= '
';
    
        if( $url = get_the_author_meta( 'user_url' )) {
            $s .= '' . get_the_author() . '';
        } else {
            $s .= '' . get_the_author() . '';
        }
        
        $s .= '
' . get_the_author_meta( 'description' ) . '
';
        
        $s .= 'All posts by ' . get_the_author() . '';
        $s .= '

               Follow ' . get_the_author() . ' on Twitter';
    
    $s .= '
';
    
    
    $s .= '
';
    
    return $content . $s;
 }

Want it all?

The Seattle WordPress group utilizes Github to share code amongst members and for presentations. You can find this entire file on their Github page

https://github.com/WordPress-Seattle