Tôi có một bài đăng tùy chỉnh có thẻ meta cần sử dụng tải lên tệp (đối với tệp video). Tôi tự hỏi, cách chính xác để thêm nút "Tải lên" trỏ đến trình tải lên phương tiện WordPress và đặt url của tệp đã tải lên được chọn vào trường văn bản gây ra liên kết nút tải lên.

Tôi không tìm kiếm mã khi tạo tùy chọn thẻ meta thực tế, nhưng để biết cách thực sự thêm nút tải lên phương tiện Wordpress đúng cách.

Xem bộ xương tải lên phương tiện truyền thông này . Bạn cũng có thể sử dụng nó trong đánh dấu tùy chỉnh của mình, như Meta Box.

Một gợi ý, kiểm tra, rằng bạn chỉ sử dụng các tập lệnh trên trang, nơi bạn kích hoạt Meta Box của mình. Mặt khác, nó thường là một vấn đề trên các trang mặc định và trình tải lên.

Bây giờ là một nỗ lực để xóa các phần quan trọng để đưa người tải lên vào phần tùy chỉnh của bạn.

Đầu tiên bao gồm một nút trong hộp meta:

<input id="upload_image" type="text" size="36" name="upload_image" value="" />
<input id="upload_image_button" type="button" value="Upload Image" />

Bây giờ hãy liệt kê các kịch bản:

function my_admin_scripts() {    
    wp_enqueue_script('media-upload');
    wp_enqueue_script('thickbox');
    wp_register_script('my-upload', WP_PLUGIN_URL.'/my-script.js', array('jquery','media-upload','thickbox'));
    wp_enqueue_script('my-upload');
}

function my_admin_styles() {

    wp_enqueue_style('thickbox');
}

// better use get_current_screen(); or the global $current_screen
if (isset($_GET['page']) && $_GET['page'] == 'my_plugin_page') {

    add_action('admin_print_scripts', 'my_admin_scripts');
    add_action('admin_print_styles', 'my_admin_styles');
}

Phần cuối cùng là tập lệnh tùy chỉnh của bạn để sử dụng hộp dày và trình tải lên bên trong này.

jQuery(document).ready( function( $ ) {

    $('#upload_image_button').click(function() {

        formfield = $('#upload_image').attr('name');
        tb_show( '', 'media-upload.php?type=image&TB_iframe=true' );
        window.send_to_editor = function(html) {
           imgurl = $(html).attr('src');
           $('#upload_image').val(imgurl);
           tb_remove();
        }

        return false;
    });

});

Giải pháp:

1) trong bạn functions.php , thêm khối đăng ký các kịch bản cần thiết:

// add necessary scripts
add_action('plugins_loaded', function(){
  if($GLOBALS['pagenow']=='post.php'){
    add_action('admin_print_scripts', 'my_admin_scripts');
    add_action('admin_print_styles',  'my_admin_styles');
  }
});

function my_admin_scripts(){
  wp_enqueue_script('jquery');
  wp_enqueue_script('media-upload');
  wp_enqueue_script('thickbox');
}

// Proper way to enqueue
// wp_register_script(
//   'my-upload',
//   WP_PLUGIN_URL.'/my-script.js',
//   array('jquery','media-upload','thickbox') /* dependencies */
// );
//
// wp_enqueue_script('my-upload');

function my_admin_styles(){
  wp_enqueue_style('thickbox');
}

2) và sau đó thêm khối metabox :

add_action(
  'add_meta_boxes',
  function(){
    add_meta_box(
      'my-metaboxx1', // ID
      'my-metaboxx1-title', // Title
      'func99999', // Callback (Construct function)
      get_post_types(), //screen (This adds metabox to all post types)
      'normal' // Context
    );
 },
 9
);
function func99999($post){
  $url = get_post_meta($post->ID, 'my-image-for-post', true); ?>
  <input id="my_image_URL" name="my_image_URL" type="text"
         value="<?php echo $url;?>" style="width:400px;" />
  <input id="my_upl_button" type="button" value="Upload Image" /><br/>
  <img src="<?php echo $url;?>" style="width:200px;" id="picsrc" />
  <script>
  jQuery(document).ready( function($) {
    jQuery('#my_upl_button').click(function() {
      window.send_to_editor = function(html) {
        imgurl = jQuery(html).attr('src')
        jQuery('#my_image_URL').val(imgurl);
        jQuery('#picsrc').attr("src", imgurl);
        tb_remove();
      }

      formfield = jQuery('#my_image_URL').attr('name');
      tb_show('', 'media-upload.php?type=image&amp;TB_iframe=true' );
      return false;
    }); // End on click
  });
  </script>
<?php
}

add_action('save_post', function ($post_id) {
  if (isset($_POST['my_image_URL'])){
    update_post_meta($post_id, 'my-image-for-post', $_POST['my_image_URL']);
  }
});

ps trong trường hợp bạn cần nhiều trường, thì bạn có thể dễ dàng làm như thế này: http://pastebin.com/raw/xpU1ch2W