backbone

Best approach when modifying the Media Manager

This is my go to snippet for things like this. <?php add_action(‘print_media_templates’, function(){ // define your backbone template; // the “tmpl-” prefix is required, // and your input field should have a data-setting attribute // matching the shortcode name ?> <script type=”text/html” id=”tmpl-my-custom-gallery-setting”> <label class=”setting”> <span><?php _e(‘My setting’); ?></span> <select data-setting=”my_custom_attr”> <option value=”foo”> Foo </option> … Read more

Display attachments by ID in a wp.media frame

You can always filter on the client side: var query = wp.media.query(); query.filterWithIds = function(ids) { return _(this.models.filter(function(c) { return _.contains(ids, c.id); })); }; var res = query.filterWithIds([6,87]); // change these to your IDs res.each(function(v){ console.log( v.toJSON() ); }); Disclaimer: found the beautiful filterWithIds function in this SO question.

Using Backbone with the WordPress AJAX API

You need to override the Backbone.sync function to change the URL used for the AJAX call. You can learn from the plugin wp-backbone does this and more. Below you can see from it how it changes all the actions into either POST or GET, create the parameters, add the action parameter and more. (function($) { … Read more

Add filter function in media modal box

The wonderful world of Backbone.js and WP (of which I know barely anything). I think the problem is you are just calling the same default media.view, instead I believe you need to initialize a new one. For example: /** * Replace the media-toolbar with our own */ var myDrop = media.view.AttachmentsBrowser; media.view.AttachmentsBrowser = media.view.AttachmentsBrowser.extend({ createToolbar: … Read more

Pre populate WordPress wp_media modal with image selection

Here is the script: I’m using the function loadImages in following script to load the existing attached images via AJAX and then just pass the function with the IDs of images and it opens up a pre-populated modal. var frame, selection = loadImages(images); $(‘#stag_images_upload’).on(‘click’, function(e) { e.preventDefault(); var options = { title: ‘<?php _e(“Create Featured … Read more

+ More