Ajouter le bouton «télécharger le média» dans le champ de la boîte méta

14

J'ai un message personnalisé qui comporte une balise méta qui doit utiliser un téléchargement de fichier (pour les fichiers vidéo). Je me demande quelle est la bonne façon d’ajouter un bouton "Télécharger" qui pointe sur le programme de téléchargement de média WordPress et définit l’url du fichier téléchargé sélectionné dans le champ de texte qui a associé le bouton de téléchargement.

Je ne cherche pas de code pour créer l'option de balise méta, mais un moyen d'ajouter un bouton de téléchargement de média Wordpress correctement.

    
posée SpyrosP 04.10.2012 - 02:18

2 réponses

12

Voir ce squelette de téléchargement de média . Vous pouvez également l’utiliser dans votre balise personnalisée, comme Meta Box.

Un indice, vérifiez que vous utilisez uniquement les scripts de la page où vous activez votre Meta Box. Sinon, est-ce souvent un problème sur les pages par défaut et sur le programme de téléchargement.

Essayez maintenant de supprimer les éléments importants pour inclure le programme de téléchargement dans votre élément personnalisé.

Commencez par inclure un bouton dans la boîte méta:

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

Mettez maintenant les scripts en file d'attente:

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

La dernière partie est votre script personnalisé pour utiliser la thickbox et le programme de téléchargement à l'intérieur de celui-ci.

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

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

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

        return false;
    });

});
    
réponse donnée bueltge 04.10.2012 - 08:37
0

Solution:

1) dans votre functions.php , ajoutez le bloc d'enregistrement des scripts nécessaires:

// 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) puis ajoutez le bloc 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']);
  }
});




p.s. Si vous avez besoin de plusieurs champs, vous pouvez facilement procéder comme suit: enlace

    
réponse donnée T.Todua 01.09.2016 - 16:11

Lire d'autres questions sur les étiquettes