How to load only a certain type of image (functions.php)

You can use some JavaScript to add a quick validation that checks the file type when someone tries to add an image. Place this script in your theme’s main JS file or inline in your functions.php.

Here’s a snippet of JavaScript to give you an idea:

jQuery(document).ready(function($) {
    wp.customize.control('themeslug_logo', function(control) {
        control.uploader.params.allowed_extensions = ['png'];
        control.container.on('click keydown', '.upload-button', function() {
            control.uploader.uploader.plupload.uploader.settings.filters.mime_types = [{title: 'Allowed Files', extensions: 'png'}];
        });
    });
});

This will limit the media uploader to only show PNG files when someone tries to upload an image for your logo setting in the Customizer.

Give that a shot and let us know how it works for you! 😊