有没有办法将wp gallery短代码插入到自定义metabox文本区域?我想要这样的东西:
在带有文本区域的帖子/页面中新建元框,文本区域下方有一个按钮可打开wp browse media gallery lightbox。然后,当我们选择少量图像作为库时,单击“插入库”按钮将向textarea自定义字段插入短代码。
有可能吗?
谢谢
====== Update: ======
我能够显示媒体库,现在我不知道如何在单击按钮“插入库”时将快捷码插入自定义文本区域
以下是我目前的代码:
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="Browse Gallery"/>
</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;
});
我现在想要实现的是:
打开模式时如何将“创建库”选项卡设置为默认选项卡将库快捷码插入到自定义文本区域请参见下面的屏幕截图了解详细信息
SO网友:Diosney
是的,这是可能的:)我只需要实现这个功能,然后随你的帖子一起来。
假设你有这个HTML:
<input type="hidden" name="shortcode" value="{{ options.shortcode }}"/>
<br />
<a href="#" class="btn gallery-configure">
Configure Gallery
</a>
匹配
JS 要触发Gallery edit(库编辑)模式并将短代码保存到适当的字段中,请执行以下操作:
/**
* Gets initial gallery-edit images. Function modified from wp.media.gallery.edit
* in 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;
// Bail if we didn\'t match the shortcode or all of the content.
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;
/*
* Fetch the query\'s attachments, and then break ties from the query to allow for sorting.
*/
selection.more().done(function () {
// Break ties with the query.
selection.props.set({
query: false
});
selection.unmirror();
selection.props.unset(\'orderby\');
});
return selection;
}
var $body = jQuery(\'body\');
// Media uploaders.
$body.on(\'click\', \'.gallery-configure\', function () {
var $this_button = jQuery(this);
jQuery(\'.media-modal-close\').trigger(\'click\');
var selection = var selection = select($this_button.parent().find(\'[name="shortcode"]\').val()); // Get the saved selection here.
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(); // Get the new/updated shortcode here.
$this_button.parent().find(\'[name="shortcode"]\').val(new_shortcode);
});
frame.open();
return false;
});
希望这对您有所帮助,我花了一些时间才弄明白:)