How to use media upload on theme option page?

I want implement upload logo to my theme option page. Currently I follow this code

What I have done for now load a related jquery for the media upload

function load_only() {
    add_thickbox();
    wp_enqueue_script('jquery-option', get_template_directory_uri() . '/admin/js/jquery.option.js', array('jquery','media-upload','thickbox','jquery-ui-core','jquery-ui-tabs'), '1.0');
}

Question

How to implement the upload form using existing media upload?

<input id="theme_options_upload" type="text" name="theme_options_upload" value="<?php esc_attr_e( $options['theme_options_upload'] ); ?>" />
<input type="button" name="just_button" value="<?php esc_attr_e('Upload'); ?>" />

I want to know

  1. How to link the button to media-upload.php
  2. After we upload image and click Insert into Post button on media-upload the image will place into field name="theme_options_upload"

Let me know.

Answers:

Thank you for visiting the Q&A section on Magenaut. Please note that all the answers may not help you solve the issue immediately. So please treat them as advisements. If you found the post helpful (or not), leave a comment & I’ll get back to you as soon as possible.

Method 1

You are most likely to save the url of the image and not the whole image tag,
and there is a great tutorial that explains just how to use the media uploader in your own theme or plugin:
http://www.webmaster-source.com/2010/01/08/using-the-wordpress-uploader-in-your-plugin-or-theme/

update

In case of using this in a meta box you will need the post id so change the js code from:

jQuery('#upload_image_button').click(function() {
 formfield = jQuery('#upload_image').attr('name');
 tb_show('', 'media-upload.php?type=image&amp;TB_iframe=true');
 return false;
});

to

jQuery('#upload_image_button').click(function() {
 formfield = jQuery('#upload_image').attr('name');
 post_id = jQuery('#post_ID').val();
 tb_show('', 'media-upload.php?post_id='+post_id+'&amp;type=image&amp;TB_iframe=true');
 return false;
});


All methods was sourced from stackoverflow.com or stackexchange.com, is licensed under cc by-sa 2.5, cc by-sa 3.0 and cc by-sa 4.0

0 0 votes
Article Rating
Subscribe
Notify of
guest

0 Comments
Oldest
Newest Most Voted
Inline Feedbacks
View all comments
0
Would love your thoughts, please comment.x
()
x