This post has been marked as old. The code might no longer work. Comments have been disabled as this is no longer maintained. Use the search on the right to find a newer tutorial.
» Download the CMB Library here
It’s been about six months since my original Custom Metaboxes post announcing the release of this code library for easily creating metaboxes. If you haven’t had a look at it since then, I highly recommend you hop on Github and look at the latest version and the wiki.
Some of the features:
- The ability to create metaboxes with a simple array rather than a ton of code. Compare this tutorial (without our library) to these examples (with our library).
- Choose from 20 included field types, or add your own field types
- You can limit the metabox to specific post types, page template, page IDs, or create your own filter for where it should show up
- This can be used by both themes and plugins. And as long as you initialize it correctly (see bottom of example-functions.php), it can be used by a theme and as many plugins as you like at the same time.
My favorite field types:
- WYSIWYG. If you’re using WordPress 3.3, this will automatically use the new wp_editor which gives you a ton of flexibility.
- Taxonomy field types (select, radio, multicheck). If you’re dealing with a lot of taxonomies, the default metabox provided by WordPress takes up a lot of screen real estate. Include taxonomies in your custom metabox instead. Using select or radio is also a great way to force users to only select one taxonomy term.
- File upload. Use the built-in media uploader to allow the user to upload any file they want. You can also store the attachment ID in case you want to retrieve other image sizes.
- Title. If your metabox has a lot of fields in it, use the title field type to create subheadings and instructions.
- Text (standard, medium, and small). This is as simple as it comes, but also the one you’ll use most often.
- text_date_timestamp. This one uses a date picker to let the user select a date, and then saves it as a UNIX timestamp. This is great for event metaboxes because you can then query based on the date.
The contributors of this code library, in no particular order, include: Andrew Norcross, Jared Atchison, Travis Smith, Randy Hoyt, Jeremy Pry, Andrew Ryno, Patrick Forringer, Chris Olbekson, Stefan Crain …and me.
Please use this code, and consider contributing any improvements you make. If you create any field types or show_on filters, post them on the wiki. If you find any bugs, post them in issues (and even better, post the fix!).
Jon Breitenbucher says
Thanks. I think there is an even easier method which I point out at https://gist.github.com/1547439
Paul says
Hey Bill,
how do I display the URL of a file upload?
this gives me the attachment page URL:
get_post_meta( get_the_id(), ‘_cmb_wpc_doc_attachment’, true )
but I want the direct link to the file
thanks
Paul says
I figured it out, it’s because of XAMPP. works fine on a live server.
but another question: how to display the ‘name’ part of the select dropdown? I don’t think it’s saved in the database?
Bill Erickson says
No it isn’t. That is just there so that you can present a different label to the user on the backend than the actual value you’re saving:
array( 'name' => 'Another Value', 'value' => 'another-value' )Joshua Nelson says
Bill,
Have you noticed any issues with multiple custom post types? I tried having three different custom post types at one point and for some reason the meta boxes only showed up on two of them, even those they were all called out correctly and worked if I turned one of them off. Any thoughts?
Cheers,
Joshua
Joshua says
Bill,
I can’t seem to display an uploaded image/file in the loop. I can get any other meta to display, but not the image file. I have ‘type’ set as ‘file’. I tried this: ID,’enrich_image’,true); ?> but no luck. I’m assuming it would just echo the url to the file, correct? It doesn’t display anything.
Thanks,
Joshua
Joshua says
sorry, code: ID,’enrich_image’,true); ?>
Joshua says
Yet again, ignore my comments, sorry!
Jon says
I’m trying to add a file upload to the metabox for a custom post type. The code for the metabox can be seen at https://gist.github.com/2948888 Everything is working fine except for the Business logo upload. When I am editing a post using this custom metabox and click on Upload, nothing happens. This is on my local MAMP setup. I haven’t tried it on a staging server. Any thoughts?
Jon says
It seems to work on a staging server. Any idea what in the world could be going on?
Jon says
I’m using the file upload field allowing users to upload a file, image, or URL. The upload works fine but what I am having trouble with is displaying what is uploaded. Obviously if the user uploads a file or URL then I need to display the link to the file or display the URL as a working URL. If they upload an image then I need to display the image. I’m just not sure what the best way to approach this is. Any ideas?
Bill Erickson says
A URL to whatever file they upload is stored in the post meta field you provide. So if you’re using the example code to generate your file upload field, you would retrieve it on the frontend using
get_post_meta( $post->ID, '_cmb_test_image', true );Jon says
Thanks Bill. So I need to do some conditional check to see if it is an image, URL, or file if I want to display the image and display links in the other cases?
Bill Erickson says
Correct. What I’d do is, on the file upload field, add ‘save_id’ => true, which will save an additional field named “your_key”_id that contains the attachment id.
Then use get_post_mime_type() to determine what kind of file it is, and use that information to determine how it is displayed.
AnyDog says
Wow,
thank you man for this lib. Really very usefull and clever piece of code.
But (there is always on of those … 😉 ), it seems that the issue with CMB_META_BOX_URL and my Win machine is in business here …
I’m not gettin’ any js and css … (no datepicker etc.).
You mentioned that this error is fixed, and I cannot find anything on Wiki … 🙁
Bill Erickson says
Here’s the issue with a possible fix included: https://github.com/jaredatch/Custom-Metaboxes-and-Fields-for-WordPress/issues/31
Try it out and comment! We need people to test this fix before we can add it to core.
AnyDog says
Hey, thnx for fast reply.
Yeah, since I’m not really a programmer, a lot of that stuff there I just don’t understand (yet).
So, I solved it (for my needs) with simple:
define( ‘CMB_META_BOX_URL’, get_template_directory_uri() . ‘/custom_meta/’ );
Could this work ? Nor only on my local machine, I mean …?
In any case, BIG thanks. 🙂
Bill Erickson says
Yes, that will work as long as you place the code in your theme but not if you put it in a plugin. The reason we don’t use that is this code can be used either in a theme or plugin (I always use it in /mu-plugins)
AnyDog says
I will use this in my theme (and use it well 😉 ), not plugin. but in case I’ll decide to make a plugin out of it …. I won’t, because, you’ll make it… LOL … just kidding
Very nice work, and thanks for sharing it … 🙂
Diana says
Thanks for this plugin, really well done and well written.