Question

Does anyone happen to know how to create a simple "attach/browse" button that can be placed into a metabox which upon clicking it would open a lightbox where the user would be able to view all the media files, tick the ones he wants to attach and click an "attach" button on the bottom. After clicking "attach" the post metabox would update with all the files he selected...

Was it helpful?

Solution

For the part of opening a lightbox, browse for something and then performing something on an action within: Wordpress has this already build in. For what you ask is basically the thickbox that opens up like in the post editor when you browse for an image in the gallery.

You find all the code you need for that already in wordpress. The only thing you need to do is to collect the rather more complex chunk of code, package it up in a plugin on it's own and modify it to fit your needs. Those components are not very re-useable on their own, so there is no API which could have made this easier for you. Well, that's not really true, you can use tb_show() to display the thickbox for example.

But overall, this is not trivial. You probably are looking for something that is easier to adopt. I don't know. I once tinkered with thickbox <-> post editor communication (which might be more complex with what you need), and there is a lot to think about to do things. But for the scenario you describe, it's often needed, to signal the page that is opening the thickbox to update something after the selection in the popup has been made.

For the metabox, you should find enough code-snippets how to create one, so I'm pretty sure that there is already code for that.

OTHER TIPS

https://github.com/jaredatch/Custom-Metaboxes-and-Fields-for-WordPress

These guys have made an awesome library for custom field types in WP admin. I think its exactly what you are looking for - it makes creating image upload fields trivial.

This enables metaboxes to be decalred for any post type programticly with fine control.

There was a request for more detail. At the risk of duplicating knowledge, here is an example from the documentation (with some mods to use the file control) . an image metabox:

function be_sample_metaboxes( $meta_boxes ) {
$prefix = '_cmb_'; // Prefix for all fields
$meta_boxes[] = array(
    'id' => 'test_metabox',
    'title' => 'Test Metabox',
    'pages' => array('page'), // post type
    'context' => 'normal',
    'priority' => 'high',
    'show_names' => true, // Show field names on the left
    'fields' => array(
        array(
            'name' => 'Test Text',
            'desc' => 'field description (optional)',
            'id' => $prefix . 'test_image',
            'type' => 'file'
        ),
    ),
);

return $meta_boxes;
}
add_filter( 'cmb_meta_boxes', 'be_sample_metaboxes' );


add_action( 'init', 'be_initialize_cmb_meta_boxes', 9999 );
function be_initialize_cmb_meta_boxes() {
if ( !class_exists( 'cmb_Meta_Box' ) ) {
    require_once( 'lib/metabox/init.php' );
}
}

What i do is put this in my posttype_my_post_type_name.php where i'm creating the post type. Require this from the functions.php file after you have required the metabox library.

Licensed under: CC-BY-SA with attribution
Not affiliated with wordpress.stackexchange
scroll top