Since I’ve been playing around with user management a lot lately, I thought I’d share a simple technique I picked up. This technique will allow you to easily add new user profile fields that your blog’s users can use to input more information about themselves.
Management of these fields will be coming in a later version of my user management plugin, but some of you may want to do this now.
In this tutorial, I’ll show you how to add an input box for a Twitter username and how to display it on your site, which will look a little something like this:
My profile and Twitter link
If you want to see a live example, check out one of my latests posts on Pop Critics.
Adding custom user fields
Open your theme’s functions.php file and drop this PHP code in:
add_action( 'show_user_profile', 'my_show_extra_profile_fields' );
add_action( 'edit_user_profile', 'my_show_extra_profile_fields' );
function my_show_extra_profile_fields( $user ) { ?>
<h3>Extra profile information</h3>
<table class="form-table">
<tr>
<th><label for="twitter">Twitter</label></th>
<td>
<input type="text" name="twitter" id="twitter" value="<?php echo esc_attr( get_the_author_meta( 'twitter', $user->ID ) ); ?>" class="regular-text" /><br />
<span class="description">Please enter your Twitter username.</span>
</td>
</tr>
</table>
<?php }This will create a new area in the user edit screen that looks like this:
Additional profile fields
The custom part of the code is this bit:
<tr>
<th><label for="twitter">Twitter</label></th>
<td>
<input type="text" name="twitter" id="twitter" value="<?php echo esc_attr( get_the_author_meta( 'twitter', $user->ID ) ); ?>" class="regular-text" /><br />
<span class="description">Please enter your Twitter username.</span>
</td>
</tr>Note that if you want to add more fields, copy that and change twitter to something unique for each additional field. Just make sure you change each instance of twitter.
Saving the custom user fields
Just because we’re displaying these extra fields, doesn’t mean they’ll be saved when the user profile is updated. So, we need one more function to handle this. Drop this PHP code in your theme’s functions.php file.
add_action( 'personal_options_update', 'my_save_extra_profile_fields' );
add_action( 'edit_user_profile_update', 'my_save_extra_profile_fields' );
function my_save_extra_profile_fields( $user_id ) {
if ( !current_user_can( 'edit_user', $user_id ) )
return false;
/* Copy and paste this line for additional fields. Make sure to change 'twitter' to the field ID. */
update_usermeta( $user_id, 'twitter', $_POST['twitter'] );
}Now, your information will be saved.
Displaying custom user fields on the site
For getting these additional fields, WordPress has two nifty functions: the_author_meta() and get_the_author_meta(). The former displays the meta information, and the latter returns it for use in PHP. Each takes in two parameters:
the_author_meta( $meta_key, $user_id );You can use this to grab the information from any of the fields you’ve created. For example, the $meta_key for our Twitter field is twitter. We just need to call it up somewhere in our theme.
So, what we’re going to do is build an author box to add to the end of our single posts. Once again, we visit our theme’s functions.php file and drop some PHP code in:
function my_author_box() { ?>
<div class="author-profile vcard">
<?php echo get_avatar( get_the_author_meta( 'user_email' ), '96' ); ?>
<h4 class="author-name fn n">Article written by <?php the_author_posts_link(); ?></h4>
<p class="author-description author-bio">
<?php the_author_meta( 'description' ); ?>
</p>
<?php if ( get_the_author_meta( 'twitter' ) ) { ?>
<p class="twitter clear">
<a href="http://twitter.com/<?php the_author_meta( 'twitter' ); ?>" title="Follow <?php the_author_meta( 'display_name' ); ?> on Twitter">Follow <?php the_author_meta( 'display_name' ); ?> on Twitter</a>
</p>
<?php } // End check for twitter ?>
</div><?php
}Now, all you need to do call the function in your theme’s single.php file somewhere after the post has been displayed:
<?php my_author_box(); ?>If you’re using a child theme, your theme author can probably tell you a more appropriate action hook to add this function to so you don’t mess up your theme’s template files.
What other custom user field uses can you think of?
This is just another one of those powerful features of WordPress that I don’t see used much. I have several things in mind that I could use this technique for, but I’d like to hear what you’d do with it.
Surely we can do some cooler stuff than just displaying a link to Twitter?
Such a great tutorial that you give up there. I will definitely use it for my blog. The best part of the above tutorial is the way you integrate Twitter with user profile – by adding another part of the page when I key in my twitter user profile.
Besides Twitter’s profile link, it will definitely a good idea to put social bookmarking site especially Stumble Upon’s thumb up icon as I believe that by having that section, it can channel reader’s attention into the section.
Other than that – link to the latest post of the user maybe – especially for guest blogger as it can help to increase the incentive and motivation of the guest blogger.
Hi Justin. Is there a way to extend this to registration, so that the extra fields are required (maybe optionally required, but the input fields would be there) upon registering? Or alternately, maybe just direct people to their profile upon logging in, to complete their profile? I am thinking of using something like this for extended profiles, sort of a membership database, something I haven’t found a good version of yet (and I think you had similar trouble finding a while back?) It’s an area that’s lacking WordPress plugins.
I would use this for simple things like name, address, phone, interests, etc. All the things you’d need to know about a member of a club.
Justin,
I’m never disapointed with the quality of your work. This tutorial is simply excellent, I have learnt something soooo cool today
Thanks for sharing all this usefull info with us. Have a nice day!
Jean
Huzzer Magazine — Other social networks and bookmarking sites would definitely be something to consider. As for linking to guest bloggers’ latest posts, you can use the already available website info from their profiles to do something with.
Chris Hajer — Yeah, it’s entirely possible, but it’s a little more complex than what’s shown here.
You’d have to add your form elements to the
register_formhook. Then, I believe you’d have to overwrite thewp_new_user_notification()function (it’s pluggable) to save it because I don’t think there’s a hook when saving that’ll give you the user ID (you need that ID). I could be wrong about overwriting the function, but I don’t see anything right now that would make it easier.It’s definitely something I’ll be working into my plugin when I implement all of this.
Jean-Baptiste Jung — Thanks. I just like sharing back the things I learn with the community. If I had the time, I’d write a new tutorial every day.
Justin, I’m using Hybrid News and love that you have included a “Register” page template. I’ve used this tutorial to add a field for “Company Name” and it shows up on the Register page, but I’m not able to get the text entered into the field to populate and save in the custom field created in the user profile.
You offered a couple of tips earlier…
…But I’m not sure how to implement this. Any tips you…or anyone else have would be greatly appreciated.
Just a note the `user_register` hook works for processing custom fields added using the `register_form` hook.
You get access to both the new user id as well as the $_POST variables using that hook which is all you need to use `update_usermeta`
Just had to do this earlier today on a project I’m working on (using WP 2.9.2)
As for usage ideas I am slowly planning collaboration/hobby site, most probably on P2 theme (if I don’t find something more fitting).
I want to give users some degree of control over what parts (probably compartmentalized as widgets) of site they see, as well as option to filter RSS-embebed content with their keywords.
I hadn’t even started on actual code, but this technique seems like it will be of use. Thanks for explaining it!
This week we decided, for the project I’m involved in, that we want to use extra profile-info which the users can manage by themselves; and here is the answer to it.
Thanx, it’s really a timesaver and right on time
[...] segnalo un’ottima guida che vi permetterà di aggiungere un campo personalizzato nel profilo utente del vostro blog con [...]
Nicely done – here’s another idea, instead of the code in functions.php, roll it all into one file, drop it in mu-plugins. Add some shortcode options then users across a WPMU install can whip up their own profile area wherever they like.
[...] Adding and using custom user profile fields – In another great tutorial from Justin Tadlock, he goes over how to use user profile fields in your theme, as well as how to make your own custom user profile fields such as a “Twitter” field. This can be useful on a multi-author blog to display author info on each of their respective posts. [...]
Great tutorial Justin, thanks a lot. I had the same thought as Chris above. I know there are a couple plugins out there that attempted the addition of form input fields on the registration form, but if this could ultimately be included in your user role plugin, it would simply be fantastic.
Hey Justin,
it’s become a lot easier to do this with a patch that I proposed and wrote a couple months back: http://core.trac.wordpress.org/changeset/11784. This is in trunk and will be included, as it looks right now, in 2.9, after that, user fields are filterable, and you could easily add the Twitter profile field just by doing this:
I’ll do a quick post detailing it all
i use that code but when trying to edit user profiles user.php have error promt
I could think about custom user fields like “Hobbies”, “Location” or “Occupation” to make the users less faceless.
Post done, check it out: User Contact Fields in WordPress 2.9.
Rarst — The
update_usermeta()function could definitely be your friend when coding it. There’s loads of different things you can do with it.visaap — You’re welcome. I hope it comes in handy.
Andrea_R — Fortunately, the shortcodes are done. I’ll definitely be rolling this up into version 0.2 of my upcoming user/role plugin.
Adam W. Warner — It’s on my to-do list, so you can look forward to it in a future release.
Joost de Valk — Yes, I’ve seen the patch. Unfortunately, it does not make user fields filterable. It only makes a certain type of user field filterable — input boxes for contact information.
While the patch is wonderful, it doesn’t take into account textareas, checkboxes, radio boxes, select boxes, or any other type of form element I want to add other than a text input box under the “Contact Info” section.
Andreas Graf — Those are definitely some good ideas for extending the user fields.
I have a feeling your to-do list looks a lot like this.
This is wonderful and so easy to follow, thanks so much for sharing!
I’m trying to incorporate it into the author archives using this method: http://codex.wordpress.org/Author_Templates
Is there a way to code the twitter link so that it’ll work outside of the loop?
Adam W. Warner — I’ve been looking all over for that. Where’d you find it?
Amanda — Just use the
the_author_meta()shown above in the post. You’ll need to add in the second parameter (user’s ID).Justin this look cool and familiar (http://blog.ftwr.co.uk/archives/2009/07/19/adding-extra-user-meta-fields/)
With regard to the improvements in 2.9 – what use-case do you have for anything other than a text box for a contact info attribute of a user?
(BTW – You don’t need the current_user_can() check when processing the new form fields as the capability has already been checked by the main form processing code but it is always better to be safe than sorry)
i’m doing a site whereby each member has their own post… I’d like to see this profile page used as a means to set up their post…. maybe even incorporate a basic tinymce editor?
Another very informative post Justin. I keep coming back to your site to learn more. Keep up the good work.
I learn so much from you Justin!
Thanks for this.
(may I take this opportunity to tell you how nice it would be to have a search option on your site?)
I’m using something similar to this to add links to iTunes and CDbaby for the discography pages on a site I’m working on (http://burntsugarindex.com/making-love-to-the-dark-ages/) but I think your method is a bit more elegant.
I’m going to have to revisit that…
westi — Man, I wish I would’ve seen that before I had to figure this out all on my own. It would’ve been helpful.
As for use cases, I’d rather show you an example than describe it.
CG — I don’t think the user profile page is the best place to be posting from. I’d recommend just using the normal post editor.
amy gail — Maybe I’m missing something, but I don’t see what the iTunes and CDBaby things have to do with user profiles.
You’re right – Not so much user profiles
- I’m thinking along the line of the way you’ve inserted the twitter user name via custom fields and hooked them into the author meta.
In my case – each CD has it’s own link to iTunes and CDbaby- I’m using custom fields (in custom single post templates) for that now and it works. Your post has me thinking that I can do it a bit more elegantly.
That’s all
I’m jealous- what I wouldn’t give to be able to create this kind of code myself! For now, I’ll just have to rely on you.
Hey Justin… I would love to see this code along with your user management code to be used for a comprehensive dating site for wordpress…. but integrated with a paypal/different costs for different features thingy.
hi Justin.. how would I use this with a text area, checkboxes, drop down list etc…
As to extra fields, it would be nice to show either the most recent posts by the user, ‘title-date’ format, or even better allow the author to set permanent links to their favorite posts or both.
This is one area of wordpress that has really been overlooked. So many volunteer organizations use wordpress and could use a membership directory.
It should be easy to add extra users fields as needed (address, phone, etc).
The user should have an option button to opt in or out of appearing in the directory.
The directory would be protected and not viewable unless you were log in.
The admin would have a slightly different view of directory so everyone is included.
Even better would be option buttons next to each field to decide which info is ok to display.
A drag and drop interface to customize where info goes on your directory page.
This would make wordpress more useful to churches, neighborhood associations, hobby groups etc.
[...] Campos personalizados: como adicionar informações extras, na hora de cadastrar posts, páginas ou usuários; [...]
I’m going to look into doing that – adding custom fields helps your audience tell you more about themselves, and that creates a nice report between you, which, needless to say, is highly beneficial for your blog and online business.
Great tutorial.. Thanks Justin..
Great TUT! Can you think of a way to add an mp3 upload field that will allow the visitor to listen to an mp3 sample of someone’s music, such as a band?
Justin, really a outstanding Tut. Thank you fort sharing this.
Like Vince I would like to know if there is a way to upload. In my case an .jpg or .gif file.
Any ideas on that.?
thats a cool tutorial, thank you very much!
i’m running a website for a cycling club, and i wanted a (protected) page to list all the members full names and contact info like mail adress, home and work phone nr etc.
Also, each member should be able to modify his own (but only his) data.
Think your tutorial gave me exactly the tools needed for this..
great idea.
short and powerful.
Thks
[...] Adding and using custom user profile fields – In another great tutorial from Justin Tadlock, he goes over how to use user profile fields in your theme, as well as how to make your own custom user profile fields such as a “Twitter” field. This can be useful on a multi-author blog to display author info on each of their respective posts. [...]
[...] Shared Adding and using custom user profile fields [...]
Hya, ty for the code/tutorial. You are mentioning an plugin, what will this plugin do exactly?
Will it add custom fields to User Profile, and automaticly add them to the register process? Maybe also an customized register ‘page’?
If so I would gladly beta test anything for you. Else I have to write them myself, or together even.
I’ve been working on building up a new theme profile page that conglomerates all of the writer’s social media profiles into one spot, and I think this will work perfectly! Thanks for the tutorial.
Great work and easy to follow instructions. Keep up the excellent work
Hi Justin… you still alive these days?
Just wondering…
1. Are you planning to release this nifty little code as a plugin?
Thanks for good article. I appreciate your thoughts and information presented at this time.
This is so awesome .. thanks! It would be cool to be able to upload various images as well associated with authors .. that could be your next tutorial .. great work!
You are a bloody champion!!!!
I will use it Justin, thanks for this tips
Another very informative post Justin. I keep coming back to your site to learn more. Keep up the good work.
This is a Life!
is there a way to add the First Name and Last Name fields onto the regitration page?
Awesome tutorial, thanks!
I’ve used it to create a load of biography fields for a band site, so ‘Instrument’, ‘Musical History’ and ‘Influences’ all feature in there. So cool
Great tutorial!!! I just wonder how you get a textarea instead of regular text field?
Justin– as always, great tutorial.
I’d love to take some of these custom fields and show them in the comments form next to “Website” for instance. Is this possible with these custom fields?
Steve
This is a great tutorial.
I’m doing something similar to what you’ve shown, but have run into one problem – the custom meta data I enter on the profile form gets saved (it displays in my custom author template fine), but once submitted the custom fields are blank on the profile form unless I’m looking at it from within the admin side.
This is the basic formatting for all the text fields:
Is there something obvious that I’m doing wrong?
Let me try that again:
For some reason I can’t get this to work.
My profile page doesn’t contain the twitter section & going to a post having put the php my_author_box in single.php brings up this error:
Fatal error: Call to undefined function my_author_box() in /home/mobileus/public_html/blog/wp-content/themes/inove/single.php on line 58
(line 58 is where the php my_author_box thing is.)
Anyone help by any chance? (REALLY WANT THIS LOL!)
[...] reconsider this approach, as there is now a way to add custom user meta via core functions. Visit Justin Adlock's blog for a short and sweet summary of how to do [...]
Hi! Thanks for your guide it’s really usefull.
But I need some more suggestion, what I need to do if I want to upload a pdf file also?
Something like a resume attached to the profile.
Thank you so much.
I’m interested in this too-how do you make a file upload field? This puts the field on the profile page, but I’m not sure where the resume is going or how to display a link to it on author.php page:
Hello !This is nice and wonderful, all the tips so easy to follow, thanks so much for sharing! nice post carry on ….
Justin this is awesome. You just saved me tons of time.
Has anyone attempted to replicate this with friending/supporting on Facebook?
I successfully implemented this with Twitter.
Also…any way to add graphics to spruce it up a little bit?
Thanks much.
How can I do the same with checkboxes, textareas etc?? I greatly appreciate any advice anyone can offer with this. Thanks.
Hi Justin,
thank you for the tutorial. I am looking around on how to add some custom user profile field and then use it in a condition. Let’s say to give an access to a page only to some users.
I guess I can use get_the_author_meta for the condition but how can I add the and edit the field by admin?
I cannot find anything on that.
Thank you,
Radek
Hi again. I was not clear the first time. I want only users with admin role to be able to edit the extra profile field and if it is not already there create one. Then I can use get_the_author_meta in a condition. Any idea how to do that? Thank you. R
Is it possible to add this new fields during the registration process?
Great work mate, you are the php man!
Fantastic tutorial Justin! Thanks a lot!
Excellent code. Thanks to this article, I’ve actually taken it several steps further and totally redesigned the user profile form: putting the fields I want, in the order I want them.
So for my own sanity, I created a separate custom-profile.php file and simply ‘included’ it in the theme’s function.php file.
Then I hid ALL the default WP user profile areas by adding inline CSS to this custom php file:
#profile-page h3 {display: none;}
#profile-page .form-table {display: none;}
Then I rebuilt the WP user profile form within my custom-profile.php, reusing WP fields where I could (e.g. first name, last name, email, website etc) and creating new fields where I had to e.g. contact details: address 1, 2, 3, 4, zip, tel etc
I’ve even been able to keep the Password area in (but moved to a more logical section), so users can still change their password.
The whole user profile section now fits in one screen (no scrolling!).
This sounds fantastic, MrArrow. Can you give us a link?
hi MrArrow
that sounds fantastic. Could share your code with us?
[...] Justin Tadlock on Adding User Profile Fields [...]
[...] After doing some research on the most extensible way to do this I’ve come across Justin Tadlock’s excellent little tutorial “Adding and using custom user profile fields“. [...]
Thanks for the tutorial Justin. I’m a designer not a developer, so a lot of times my options are limited. I appreciate your work on this subject and will be using the User Profile in sites to come. Keep up the good work!
Thanks,
Ralph
teamcolab.com
[...] lists the author’s posts to have the author’s name in the link. The solution is to Add User Profile Fields and substitute user_nicename for twitter in the code. Thanks to Change the WordPress Author Archive [...]
One more time, trying the code tag…I’m not spamming, I promise!
Thanks so much for posting this! I’m creating a corporate intranet and this paired with the (modified) WordPress Users plug-in will basically create a mini social network! Good stuff.
Some people had asked how to do this with other forms of input, and, praise God for it, I figured out how to do it with the select menu! Here’s the code (I don’t know if there’s a way to format it as code?):
Hope this helps someone!
This is fantastic and just what I’ve been looking for – we run a multi-author blog, and want to include a list of selected contributors in the sidebar; I’m thinking we can set a custom field for ‘include in sidebar’, and then code a widget to pull through just those contributors that have that flag set.
What about radio fields?
Would this be correct:
And would I have to add just one POST, or multiple?
One:
Or Two:
If I am on the right path..
I figured it out:
So for the first bit of code, where exactly do you place it in the functions.php file?
Justin,
I’ve added the code above to write to the usermeta SQL table and got it to work in Thesis. But, I’d like to save the new field to the “users” database table instead of the usermeta table. I need to query the users database because I’m attempting to omit authors that have a new_field set to “guest” and would like to use the code below for this.
Any idea how would modify your code above to save to the users databse table instead of the usermeta? To me, the two tables look so different that I decided against just substituting “users” for “usermeta” above. I’m pretty new to coding in WP and appreciate any guidance.
I have been looking how to do this for a couple of days and I was stuck with the code.
This really works!!
But I had to change my function to work because I was putting the code outside The_loop. I wanted twitter and facebook to show in the header of every post by the respective author. This is what I did and it works fine.
Thank you so much for your input.
my blog is still in development, that’s why I don’t post the link just yet..
Really great post! Very helpful, I am working on a project where I am using wordpress as a company intranet CMS and this has come very handy. I was sent here from: http://www.dquinn.net/extending-user-profiles-wordpress/ where I had some other great ideas that I integrated into the mix.
My question for you is can this method be used to create a date of birth field? I want to be able to send birthday cards to each member based on a dob field in the user profile. I am not sure how I would implement this so anything you can contribute would be great.
Again thanks for the great insight.
I know this is an old post, but it’s still a fantastic resource.
What most people don’t know is that you can call these fields not only in a function, but also in an author template.
For example, instead of using the_author_meta, you use
twitter; ?>
Allows for some SWEET Mashable style profile pages with bio, social networks, etc on top, and recent posts by author on the bottom.
[...] Cforms to prefill the fields. Note: The methods described here are based on Justin Tadlock’s tutorial. I recommend reading it. You may also want to look at all his [...]
Justin,
First off THAN YOU THANK YOU for this post, works perfectly!!! Any ideas on when you’ll release v 0.2 of your members plugin? Would love to make my new fields available upon registering without having to hack any of the core WP files like you mentioned above.
Thanks again!!
Great information as always. Here is something I’m trying to figure out and I’m not quite sure if that method above works.
I want to generate automatically unique playerID for each new registered user. This id will be used at live events and later on in a custom app I’m building.
Later on I want to display this ID view author profile page
thoughts?
Really old comment thread I know, but just letting you know I just implemented this on a site I work for that needed a “school” field and it worked like a charm.
Your tutorials hit the sweet spot of (a) very cool functionality and (b) simple to implement. Thanks a lot.
I know this is an older thread but I need some help here…
When I do what is displayed above I can see the fields added to the profile page and when I put data in it goes to the tables, BUT it doesn’t get shown when you go back to the profile page. The fields show blank every time you go back to your profile.
Again, the data DOES go to the database but does NOT populate the field when I return to the profile page.
Any ideas? I took the code EXACTLY as in the article.
Dude seriously your work is awesome but since i am not a coder i didn’t get anything… please help where to add those codes in php after something or just anywhere?
[...] http://dquinn.net http://blog.ftwr.co.uk http://rubenwoudsma.nl http://justintadlock.com [...]
Just a huge FYI, I don’t know exactly why but WordPress does not like form field names with dashes in them. ex) profile-twitter
I just spent a lot of time watching the saving process fail without any output or reasoning. Hope this helps someone from pulling all their hair out.
What I would do with custom profile fields? I would like to see something like Magic Fields but user centered instead of post centered, where I can add custom profile fields (all types), custom profile write panels for WP backend or even for frontend.
Then I could turn Wordpress in something like a medical records system, where the patients are registered users. I can display a unique page and capture the current logged in user to fill it with the subscriber medical data.
I can also make hidden alternate pages and change the author value to a specific user then fill the page with that user information (such as for doctors view).
[...] credit goes to Justin Tadlock for his excellent article on Adding and Using Custom User Profile Fields and George Clooney for being such an excellent model in our [...]
Love your site. I know that this post was written last September, but the function update_usermeta is depreciated in version 3.0 and you should use update_user_meta.
Keep up the great website. Thank you.
Hm, is there posibility to save data from custom page in user menu in this way?
Thanks so much for this awesome article!
Thanks you too for your great article. Maybe you could help me out with a tip…
I totally stuck with a solution to sort/show last modified user profiles. In theory i thought it may be possible that a hidden field with the actual time and date will be stored in a seperate user_meta field. Everytime when a user hit the button “update profile” a function should store the time/date in a field like “last modified”. This would give the admin the possibilty to show/sort “last modified” user profiles.
Sorry for the request, but i searched a couple of days for a tip or solution without success.
Hi Justin congrats for the amazing tutorial!
I am trying to do the same but with checkboxes, just like CG and Tom Fischer.
In the user profile page I am trying to create a list of selectable checkboxes, because like hobbies the user can have more than one hobby choosable from my given examples.
The problem is when I am trying to show the saved information of the user the function
esc_attr( get_the_author_meta( 'hobbies', $user->ID ) );does not show nothing.The call at the function update_user_meta( $user_id, ‘hobbies’, $_POST['hobbies'] ); is present in to the save function.
Could you please be so kind to help me up with that?
Thanks!