Take the 2-minute tour ×
WordPress Development Stack Exchange is a question and answer site for WordPress developers and administrators. It's 100% free, no registration required.

This question already has an answer here:

I need to create a "media uploader metabox" and add it to my custom post type. I've already create normal metaboxes, the function to add to the custom post type and the function to save them, I only need to use the wordpress' media uploader but I can't figured out how to do that. After that I would insert something like "Add more image" that add more metaboxes into the page.

Something like that: enter image description here

share|improve this question

marked as duplicate by ialocin, Pieter Goosen, Wyck, toscho Jul 2 at 5:30

This question has been asked before and already has an answer. If those answers do not fully address your question, please ask a new question.

3  
Have you tried anything? Right now it looks like you want us to do your work for you. Resources: Tutorial on using the media uploader | Codex: Create a Metabox | Repeating Fields | Premium ready-made solution –  helgatheviking Apr 1 at 7:39
    
Nope, I need only something to start because I found only difficult tuts, but I'll check the first you gave me :) –  dborghez Apr 1 at 8:38
    
Well what you are asking is fairly complex (repeating upload fields) so it is fair to expect the tutorials to be challenging. You can save yourself a lot of hassle for <$25 with Advanced Custom Fields' extension. –  helgatheviking Apr 1 at 9:19
    
Yep but I'm developing a theme, I can't include plugin that cost :/ –  dborghez Apr 1 at 9:54
1  
Sometimes a plugin is just what you need. I'm all for learning, but you don't always have to reinvent the wheel. :) Good luck. –  helgatheviking Apr 1 at 10:29

1 Answer 1

I am working on something similar. This is for a podcast upload meta-box. Returns the url to the file. Here is what I have so far:

    /*******************************************************Podcast Meta-boxes  *******************/
//Add Metabox

add_action( 'add_meta_boxes', 'add_upload_file_metaboxes' );
function add_upload_file_metaboxes()
{
add_meta_box('swp_file_upload', 'File Upload', 'swp_file_upload', 'podcasts', 'normal', 'default');
}


function swp_file_upload()
{
global $post;
// Noncename needed to verify where the data originated
echo '<input type="hidden" name="podcastmeta_noncename" id="podcastmeta_noncename" value="' .
wp_create_nonce( plugin_basename(__FILE__) ) . '" />';
global $wpdb;
$strFile = get_post_meta( $post->ID, $key = 'podcast_file', true );
$media_file = get_post_meta( $post->ID, $key = '_wp_attached_file', true );
if(!empty($media_file)) { $strFile = $media_file; }
?>


<script type="text/javascript">

// Uploading files
var file_frame;
jQuery('#upload_image_button').live('click', function( podcast ){

podcast.preventDefault();

// If the media frame already exists, reopen it.
if ( file_frame ) {
file_frame.open();
return;
}

// Create the media frame.
file_frame = wp.media.frames.file_frame = wp.media({
title: jQuery( this ).data( 'uploader_title' ),
button: {
text: jQuery( this ).data( 'uploader_button_text' ),
},
multiple: false // Set to true to allow multiple files to be selected
});

// When a file is selected, run a callback.
file_frame.on( 'select', function() {
// We set multiple to false so only get one image from the uploader
attachment = file_frame.state().get('selection').first().toJSON();

// here are some of the variables you could use for the attachment;
//var all = JSON.stringify( attachment );      
//var id = attachment.id;
//var title = attachment.title;
//var filename = attachment.filename;
var url = attachment.url;
//var link = attachment.link;
//var alt = attachment.alt;
//var author = attachment.author;
//var description = attachment.description;
//var caption = attachment.caption;
//var name = attachment.name;
//var status = attachment.status;
//var uploadedTo = attachment.uploadedTo;
//var date = attachment.date;
//var modified = attachment.modified;
//var type = attachment.type;
//var subtype = attachment.subtype;
//var icon = attachment.icon;
//var dateFormatted = attachment.dateFormatted;
//var editLink = attachment.editLink;
//var fileLength = attachment.fileLength;

var field = document.getElementById("podcast_file");

field.value =url;   //set which variable you want the field to have
});

// Finally, open the modal
file_frame.open();
});

</script>



<div>

<table>
<tr valign="top">
<td>
<input type="text" name="podcast_file" id="podcast_file" size="70" value="<?php echo $strFile; ?>" />
<input id="upload_image_button" type="button" value="Upload">
</td>
</tr>
</table>
<input type="hidden" name="img_txt_id" id="img_txt_id" value="" />
</div>    
<?php function admin_scripts()
{
wp_enqueue_script('media-upload');
wp_enqueue_script('thickbox');
}
function admin_styles()
{
wp_enqueue_style('thickbox');
}
add_action('admin_print_scripts', 'admin_scripts');
add_action('admin_print_styles', 'admin_styles');
}


 //Saving the file
function save_podcasts_meta($post_id, $post)
{
// verify this came from the our screen and with proper authorization,
// because save_post can be triggered at other times
if ( !wp_verify_nonce( $_POST['podcastmeta_noncename'], plugin_basename(__FILE__) )) {
return $post->ID;
}
// Is the user allowed to edit the post?
if ( !current_user_can( 'edit_post', $post->ID ))
return $post->ID;
// We need to find and save the data
// We'll put it into an array to make it easier to loop though.
$podcasts_meta['podcast_file'] = $_POST['podcast_file'];
// Add values of $podcasts_meta as custom fields

foreach ($podcasts_meta as $key => $value)
{
if( $post->post_type == 'revision' ) return;
$value = implode(',', (array)$value);
if(get_post_meta($post->ID, $key, FALSE))
{ // If the custom field already has a value it will update
update_post_meta($post->ID, $key, $value);
}
else
{ // If the custom field doesn't have a value it will add
add_post_meta($post->ID, $key, $value);
}
if(!$value) delete_post_meta($post->ID, $key); // Delete if blank value
}
}
add_action('save_post', 'save_podcasts_meta', 1, 2); // save the custom fields
share|improve this answer
1  
Please: Reformat that code. –  kaiser Apr 2 at 2:49

Not the answer you're looking for? Browse other questions tagged or ask your own question.