Skip to content

Instantly share code, notes, and snippets.

@remcotolsma
Created September 30, 2015 18:49
Show Gist options
  • Save remcotolsma/851586448a6045db4abf to your computer and use it in GitHub Desktop.
Save remcotolsma/851586448a6045db4abf to your computer and use it in GitHub Desktop.
WordPress sponsors plugin with custom featured image meta box for banners.
jQuery( document ).ready( function( $ ) {
// Image
// @see https://github.com/WordPress/WordPress/blob/4.1/wp-includes/js/media-editor.js#L721-L739
$( '.pronamic-image-control' ).on( 'click', '.set-post-image', function( event ) {
event.preventDefault();
var $imageControl = $( event.delegateTarget );
var config = $imageControl.data( 'image-control' );
var frame = $imageControl.data( 'frame' );
// If the media frame already exists, reopen it.
if ( frame ) {
frame.open();
return;
}
// Create the media frame.
frame = wp.media( {
// Set the title of the modal.
title: config.labels.select,
// Tell the modal to show only images.
library: {
type: config.mime_type,
},
// Customize the submit button.
button: {
// Set the text of the button.
text: config.labels.select,
// Tell the button not to close the modal, since we're
// going to refresh the page when the image is selected.
close: false
}
} );
$imageControl.data( 'frame', frame );
// When an image is selected, run a callback.
frame.on( 'select', function() {
var settings = wp.media.view.settings;
// Grab the selected attachment.
var attachment = frame.state().get( 'selection' ).first();
// Run an AJAX request to set the background image.
config.image_id = attachment.id;
wp.media.post( 'pronamic_set_image', config ).done( function( html ) {
$imageControl.html( html );
frame.close();
});
} );
// Finally, open the modal.
frame.open();
} ).on( 'click', '.remove-post-image', function( event ) {
event.preventDefault();
var $imageControl = $( event.delegateTarget );
var config = $imageControl.data( 'image-control' );
config.image_id = false;
wp.media.post( 'pronamic_set_image', config ).done( function( html ) {
$imageControl.html( html );
} );
} );
} );
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment