Php 添加Wordpress"；添加媒体“；按钮形成自己的插件

我正在尝试在我自己的插件表单页面中添加我自己的“添加媒体”按钮，我创建了一个插件，在add-new.php文件中有一个表单，代码如下：

  <div class="wrap">
<h1><?php _e( 'Add Deal', 'webdevs' ); ?></h1>

<form action="" method="post">
                    <!-- I NEED TO CHANGE THIS TO SHOW "ADD MEDIA BUTTON" -->
                     <input id="upload_image" type="text" size="36" name="upload_image" value="" />
        <input id="upload_image_button" type="button" value="Upload Image" />

      <?php wp_nonce_field( 'deal-new' ); ?>
        <?php submit_button( __( 'Add Deal', 'webdevs' ), 'primary', 'submit_deal' ); ?>

  </form>

如何添加html代码并在php中处理

请帮忙

---

Thnaks

我已经用metabox创建了一个自定义图像上传，您可以根据需要设置以下代码

您需要的是在页面上调用新的

WP的thickbox

媒体上传程序CSS和JS。您必须修改为插件页面添加脚本的条件

如果（'post'！=$typenow）修改条件

它会做什么？

它将允许您打开wordpress media uploader并将您选择的图像url发送到文本框，然后您可以使用
update\u post\u meta（）
将url保存在
post\u meta
或任何您想保存它的地方。您可以从中获取url

假定变量
：
$content\u img=$\u POST['content\u img']

Html

<p>
                <label><b>Upload Content Image</b></label><br/>
                <input class="upload_image" name="content_img" type="text" readonly="readonly" value="<?php echo $content_img ?>"/>
                <input type="button" value="Upload" class="button button-primary button-large" onclick="upload_new_img(this)"/>
                &nbsp;<a href="javascript:void(0);" onclick="remove_image(this);" class="remove_image">Remove</a>&nbsp;
            </p>

自定义JSmetabox.JS

function upload_new_img(obj)
{
    var file_frame;
    var img_name  =   jQuery(obj).closest('p').find('.upload_image');

        if ( file_frame ) {
            file_frame.open();
            return;
        }

        file_frame = wp.media.frames.file_frame = wp.media(
            {
                title: 'Select File',
                button: {
                    text: jQuery( this ).data( 'uploader_button_text' )
                },
                multiple: false
            }
        );

        file_frame.on('select', function() {
            attachment = file_frame.state().get('selection').first().toJSON();
            var newwurl = attachment.url.split('/wp-content');
            img_name[0].value = '/wp-content'+newwurl[1];
            file_frame.close();
           // jQuery('.upload_image').val(attachment.url);
        });

        file_frame.open();
}

function remove_image(obj) {
    var img_name;
    if (jQuery(obj).closest('p').find('.upload_image').length > 0) {
        img_name = jQuery(obj).closest('p').find('.upload_image');
    } else {
        img_name = jQuery(obj).closest('td').find('.upload_image');
    }
    if (typeof img_name != "undefined") {
        img_name.val('');
    }
}

我收到一个错误“UncaughtTypeError:无法读取未定义的属性“frames”
function upload_new_img(obj)
{
    var file_frame;
    var img_name  =   jQuery(obj).closest('p').find('.upload_image');

        if ( file_frame ) {
            file_frame.open();
            return;
        }

        file_frame = wp.media.frames.file_frame = wp.media(
            {
                title: 'Select File',
                button: {
                    text: jQuery( this ).data( 'uploader_button_text' )
                },
                multiple: false
            }
        );

        file_frame.on('select', function() {
            attachment = file_frame.state().get('selection').first().toJSON();
            var newwurl = attachment.url.split('/wp-content');
            img_name[0].value = '/wp-content'+newwurl[1];
            file_frame.close();
           // jQuery('.upload_image').val(attachment.url);
        });

        file_frame.open();
}

function remove_image(obj) {
    var img_name;
    if (jQuery(obj).closest('p').find('.upload_image').length > 0) {
        img_name = jQuery(obj).closest('p').find('.upload_image');
    } else {
        img_name = jQuery(obj).closest('td').find('.upload_image');
    }
    if (typeof img_name != "undefined") {
        img_name.val('');
    }
}