wordpress media library upload pdf and get url

I have added some controls to the WordPress customizer including an img, an input:text field and a button. On click I want the button to open the media library and allow the upload of a pdf. Once a pdf has been selected I want to populate the input:text field with the url of the pdf and the img field with a preview image.

I have this working with images with the following code, but if I try to use a pdf it is changing the url to include .jpg on the end instead of .pdf like this:
testpdf-pdf-212×300.jpg

My code is as follows:

  'use strict';
    jQuery('body').on('click', button_class, function () {
        var button_id = '#' + jQuery(this).attr('id');
         var pdf_image = jQuery(this).parent().children('img');
        var pdf_field = jQuery(this).parent().children('input:text');
        var _custom_media = true;

        wp.media.editor.send.attachment = function (props, attachment) {

            if (_custom_media) {
                if (typeof pdf_field !== 'undefined' || typeof pdf_image !== 'undefined') {
                    switch (props.size) {
                        case 'full':
                            pdf_field.val(attachment.sizes.full.url);
                            pdf_field.trigger('change');
                            pdf_image.attr("src", attachment.sizes.full.url);
                            pdf_image.trigger('change');
                            break;
                        case 'medium':
                            pdf_field.val(attachment.sizes.medium.url);
                            pdf_field.trigger('change');
                pdf_image.attr("src", attachment.sizes.medium.url);
                            pdf_image.trigger('change');
                            break;
                        case 'thumbnail':
                            pdf_field.val(attachment.sizes.thumbnail.url);
                            pdf_field.trigger('change');
                        pdf_image.attr("src", attachment.sizes.thumbnail.url);
                            pdf_image.trigger('change');
                            break;
                        default:
                            pdf_field.val(attachment.url);
                            
                            pdf_field.trigger('change');
                            pdf_image.attr("src", attachment.url);
                            pdf_image.trigger('change');
                            
                            
                    }
                }
                _custom_media = false;
            } else {
                return wp.media.editor.send.attachment(button_id, [props, attachment]);
            }
        };
        wp.media.editor.open(button_class);
        window.send_to_editor = function (html) {

        };
        
        return false;
    });
}

Can anyone suggest how I can modify this to work with pdf’s?

The other issue I have is that this opens the media frame with all options including things like an ‘actions’ column on the left hand side with options like create gallery, create audio playlist etc. Is it possible to modify the options of what is included in the frame?`

Many thanks in advance

• This topic was modified 2 years, 6 months ago by Steven Stern (sterndata).