How to upload multiple images with WP_Customize_Media_Control

Use this JQuery for multiple image uploads:

<!-- js multi image -->
jQuery(document).ready(function($) {

    // add image uploader functionality
        var meta_image_frame;

      $('.meta-image-button').live('click', function(e){
            e.preventDefault();

            if( meta_image_frame ){
                wp.media.editor.open();
                return;
            }

            meta_image_frame = wp.media.frames.file_frame = wp.media({
                title: 'Portfolio Image Gallery Selection Window',
                button: {text: 'Add to Gallery'},
                library: { type: 'image'},
                  multiple: false
            });

            meta_image_frame.on('select', function(){
                var media_attachment = meta_image_frame.state().get('selection').first().toJSON();

                   var url="";

                $('#meta-image').val(media_attachment.url);


            });

            meta_image_frame.open();

      });

      $('#add-input').click(function(event){

            add_input()
        }); 

        function add_input(){


            var input = "<p><label for="meta-image" class="">Add Project Image</label>"
                              +"<input type="text" name="meta-image" id='meta-image' value="" />"
                              +"<input type="button" class="meta-image-button button" value="Upload Image" />"
                              +"<input type="button" class="meta-image-button button remove-button" value="Remove Image" /></p>";

         <?php   $('#images-container').append(input);

        }

});

Leave a Comment