Support » Plugins » Hacks » Show only specific media using wp.media

  • I am working on a button which allows you to add images to a post.
    I did so using the following code which open a frame of the media library.

    frame = wp.media({
        title: 'Select or Upload',
        button: {
            text: 'Use this media'
        },
        multiple: false,
        frame: frame_type
    });
    frame.open();

    My problem is that I want the frame to only show specific media types e.g. only images or only videos.
    Is there a way to achieve that behaviour?

Viewing 1 replies (of 1 total)
  • There is a way, checkout https://githu…topic/show-only-specific-media-using-wpmedia/media.js and this gif to see it in action

    // Open the wp.media frame.
    var frame = wp.media( {
    	multiple: false, // Change to true for multiple file selections.
    
    	/*
    	* Here is where the main magic happens.
    	*
    	* We take the type, e.g. video, image, audio,
    	* and we send it to library.type which only
    	* shows the files of that type.
    	*/
    	library: { type : type },
    } );

    By passing audio, video, or image to the library attribute, you can tell wp.media which files to show.

    In my example I add the type to the button directly via a data- attribute.

    /**
     * We need to enqueue our scripts.
     *
     * @author Aubrey Portwood
     */
    function aubreypwd_wp_forums_metabox_add_media_test_scripts() {
    	wp_enqueue_media();
    	wp_enqueue_script( 'aubreypwd-wp-forums-metabox-add-media-test-script', plugins_url( 'media.js', __FILE__ ), array( 'jquery' ), '1.0.0' );
    }
    add_action( 'admin_enqueue_scripts', 'aubreypwd_wp_forums_metabox_add_media_test_scripts' );
    
    /**
     * Display buttons in a metabox.
     *
     * @author  Aubrey Portwood
     */
    function aubreypwd_wp_forums_metabox_add_media_test_display() {
    	?>
    		<p>
    			<!--
    				As you can see below, I've
    				specified the type in a data-attribute.
    
    				This will get passed to wp.media() as the type of file
    				you want to show.
    
    				@see media.js
    			-->
    			<button class="js-add-media-button" data-type="video"><?php _e( 'Select Video', 'wp-forums' ); ?></button>
    			<button class="js-add-media-button" data-type="image"><?php _e( 'Select Image', 'wp-forums' ); ?></button>
    			<button class="js-add-media-button" data-type="audio"><?php _e( 'Select Audio', 'wp-forums' ); ?></button>
    		</p>
    	<?
    }
    
    /**
     * Add a metabox to place our buttons.
     *
     * @author  Aubrey Portwood
     */
    function aubreypwd_wp_forums_metabox_add_media_test() {
    	add_meta_box( 'wp-forums-aubreypwd-add-media-test', __( 'Meta Box', 'wp-forums' ), 'aubreypwd_wp_forums_metabox_add_media_test_display', 'post' );
    }
    add_action( 'add_meta_boxes', 'aubreypwd_wp_forums_metabox_add_media_test' );

    Hope this helps!

Viewing 1 replies (of 1 total)
  • The topic ‘Show only specific media using wp.media’ is closed to new replies.