我有一个自定义帖子,该帖子的met​​a标签需要使用文件上传功能(对于视频文件)。我想知道,添加指向WordPress媒体上传器的“上传”按钮并将所选上传文件的URL设置为导致与上传按钮相关联的文本字段的正确方法是什么。

我不是在寻找创建实际元标记选项的代码,而是在寻找一种正确添加Wordpress媒体上传按钮的方法。

评论

请参阅教程和使用它制作的简单插件,您可以在这里尝试。帮助了我。

#1 楼

请参阅此媒体上传器框架。您也可以在自定义标记中使用它,例如Meta Box。

提示,请确认您仅使用了激活Meta Box的页面上的脚本。否则,在默认页面和上载器上通常会出现问题。元框中的按钮:

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


现在将脚本排入队列:自定义脚本以在其中使用thickbox和上载器。

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');
}


评论


通过Codex页面的admin_print_scripts提醒一下,admin_print_scripts主要用于回显嵌入式javascript。 admin_print_scripts不应用于在管理页面上加入样式或脚本。请改用admin_enqueue_scripts。

–祖莲
13年1月22日在10:47



我尝试了这种方法,并且永远不会填充文本输入框#upload_image

–巴勃罗先生
16年7月7日在11:19

这个答案不起作用。查看其他答案。

–T.Todua
16/09/1在14:19



#2 楼

解决方案:

1)在您的functions.php中,添加用于注册必要脚本的块:

// 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),然后添加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如果您需要多个字段,则可以轻松地执行以下操作:http://pastebin.com/raw/xpU1ch2W

评论


像魅力一样起作用,但仅与图像有关。如何处理视频文件?

– Alex
18年7月18日在14:57