Вставьте шорткод галереи WP в настраиваемую текстовую область

Есть ли способ вставить шорткод галереи wp в текстовое поле пользовательского метабокса?
Я хотел бы иметь что-то вроде этого:

Новый метабокс в посте/странице с текстовым полем, а под текстовым полем кнопка для открытия медиабиблиотеки wp. Затем, когда мы выберем несколько изображений для галереи и нажмем кнопку “вставить галерею”, шорткод будет вставлен в текущее текстовое поле.

Это возможно?

Спасибо

====== Обновление: ======

Я смог показать библиотеку медиа, теперь у меня нет идеи, как вставить шорткод в пользовательское текстовое поле при нажатии кнопки “вставить галерею”.

Вот мой код на данный момент:

HTML

<div class="uploader">
 <textarea name="settings[_cs_shortcode_gallery]" id="_cs_shortcode_gallery"></textarea>
 <input class="button tf-browse-btn" name="_cs_shortcode_gallery_button" id="_cs_shortcode_gallery_button" value="Просмотреть галерею"/>
</div>

JS

var _custom_media = true,
      _orig_send_attachment = wp.media.editor.send.attachment;
  $('.tf-browse-btn').live('click', function(e) {
    var send_attachment_bkp = wp.media.editor.send.attachment;
    var button = $(this);
    var id = button.attr('id').replace('_button', '');
    _custom_media = true;
    wp.media.editor.send.attachment = function(props, attachment){
      if ( _custom_media ) {
        $("#"+id).val(attachment.url);
      } else {
        return _orig_send_attachment.apply( this, [props, attachment] );
      };
    }
    wp.media.editor.open(button);
    return false;
  });
  $('.add_media').on('click', function(){
    _custom_media = false;
  });

Что я хочу получить сейчас:

• Как установить вкладку “Создать галерею” в качестве вкладки по умолчанию при открытии модального окна
• Вставить шорткод галереи в пользовательское текстовое поле

Пожалуйста, смотрите скриншот ниже для подробностей

Я уверен, что это возможно, но потребуется немного поработать с PHP и jQuery. Этот плагин от Томаса Гриффина для вставки изображения в метабокс был бы очень хорошей отправной точкой.

Вам нужно будет немного покопаться в js файлах в wp-admin/js и в wp-admin/includes/media.php.

Да, это возможно 🙂 Мне просто нужно было реализовать эту функциональность и написать этот пост.

Допустим, у вас есть этот HTML:

<input type="hidden" name="shortcode" value="{{ options.shortcode }}"/>
<br />
<a href="#" class="btn gallery-configure">
     Настроить галерею
</a>

Соответствующий JS, чтобы вызвать модальное окно редактирования галереи и сохранить шорткод в нужное поле, будет таким:

/**
 * Получает начальные изображения для редактирования галереи. Функция изменена из wp.media.gallery.edit
 * в wp-includes/js/media-editor.js.source.html
 *
 * @params {*} shortcode
 * @return {*}
 */
function select(shortcode) {
    var shortcode = wp.shortcode.next('gallery', shortcode);
    var defaultPostId = wp.media.gallery.defaults.id;
    var attachments;
    var selection;

    // Прекращаем работу, если шорткод не совпадает или если весь контент.
    if (!shortcode) {
        return;
    }

    shortcode = shortcode.shortcode;

    if (typeof shortcode.get('id') != 'undefined' && typeof defaultPostId != 'undefined') {
        shortcode.set('id', defaultPostId);
    }

    attachments = wp.media.gallery.attachments(shortcode);
    selection = new wp.media.model.Selection(attachments.models, {
        props   : attachments.props.toJSON(),
        multiple: true
    });

    selection.gallery = attachments.gallery;

    /*
     * Получаем вложения запросов, а затем разрываем связи с запросом, чтобы позволить сортировку.
     */
    selection.more().done(function () {
        // Разрываем связи с запросом.
        selection.props.set({
            query: false
        });
        selection.unmirror();
        selection.props.unset('orderby');
    });
    return selection;
}

var $body = jQuery('body');

// Загрузчики медиа.
$body.on('click', '.gallery-configure', function () {
    var $this_button = jQuery(this);

    jQuery('.media-modal-close').trigger('click');

    var selection = select($this_button.parent().find('[name="shortcode"]').val()); // Получаем сохраненный выбор здесь.
    var frame = wp.media({
        frame   : 'post',
        title   : wp.media.view.l10n.editGalleryTitle,
        multiple: false,
        state   : 'gallery-edit',
        editing : true,

        selection: selection
    });

    frame.on('update', function () {
        var controller = frame.states.get('gallery-edit');
        var library = controller.get('library');
        var new_shortcode = wp.media.gallery.shortcode(library).string(); // Получаем новый/обновленный шорткод здесь.

        $this_button.parent().find('[name="shortcode"]').val(new_shortcode);
    });

    frame.open();
    return false;
});

Надеюсь, это поможет вам, мне понадобилось некоторое время, чтобы разобраться в этом 🙂