javascript – 在媒体窗口中选择图片后添加/更新自定义字段(WordPress)
作者：互联网
我有关于wordpress的问题,我刚刚在添加/编辑帖子页面添加了一个名为Add Slider的按钮.
这是我的function.php中的代码：
//Add button to create slider
add_action('media_buttons','add_my_media_button',15);
function add_my_media_button(){
echo '<a href="#" id="insert-my-media" class="button">Add Slider</a>';
}
function include_media_button_js_file(){
wp_enqueue_script('media_button',get_bloginfo('template_directory').'/js/media_button.js',array('jquery'),'1.0',true);
}
add_action('wp_enqueue_media','include_media_button_js_file');
这是我的media_button.js代码
jQuery(function($){
$(document).ready(function(){
$('#insert-my-media').click(open_media_window);
})
function open_media_window(){
if (this.window === undefined) {
this.window = wp.media({
title: 'Insert a media',
library: {type:'image'},
multiple: true,
button: {text:'Insert'}
});
var self = this; //needed to retrieve the function below
this.window.on('select',function(){
var files = self.window.state().get('selection').toArray();
var values;
for (var i = 0; i < files.length; i++) {
var file = files[i].toJSON();
if(values===undefined){
var values = file.url;
}
else{
var values = values+','+file.url;
}
};
wp.media.editor.insert(values);
});
}
this.window.open();
return false;
}
});
用户在媒体窗口中选择图片并按“插入”按钮后,会将图片的url值添加到内容编辑器的邮箱中.
我的问题是如何在自定义字段框中自动添加此值并自动添加/更新,而无需单击添加自定义字段按钮.
因此,用户可以为该图片网址添加/更新自定义字段,而无需查看/检查自定义字段,以便在Wordpress中的屏幕选项的帖子编辑器中查看.
请帮我解决这个问题,谢谢.
解决方法:
我像这样修改我的jquery / js ..
$(document).ready(function(){
// $('#insert-my-media').click(open_media_window);
if($('#images_id').val() != '' && $('#images_url').val() != ''){
$('#open_media').text("Edit Slider");
}
$('#open_media').click(function(e){
e.preventDefault();
var target = $('#images_id');
var target_url = $('#images_url');
var btnSave = $('#publishing-action input.button');
if(target.val() == '' && target_url.val() == ''){
var wpmedia = wp.media({
title: 'Insert a media',
library: {type:'image'},
multiple: true,
button: {text:'Insert'}
});
wpmedia.on('select', function(){
var ids = [];
var urls = [];
var models = wpmedia.state().get('selection').toArray();
for (var i = 0; i < models.length; i++) {
var file = models[i].toJSON();
ids.push(file.id);
urls.push(file.url);
};
target.val(ids.join(","));
target_url.val(urls.join(","));
$('#deleting_slider').val("");
$('#open_media').text("Adding...");
btnSave.click();
});
wpmedia.open();
}else{
wp.media.gallery
.edit('')
.on('update', function(g){
var ids = [];
var urls = [];
for (var i = 0; i < g.models.length; i++) {
var file = g.models[i].toJSON();
ids.push(file.id);
urls.push(file.url);
};
target.val(ids.join(","));
target_url.val(urls.join(","));
$('#deleting_slider').val("");
$('#open_media').text("Editing...");
btnSave.click();
});
}
});
$('#save_desc').click(function(e){
e.preventDefault();
var target = $('#desc_editor');
var btnSave = $('#publishing-action input.button');
target.val(target.val());
btnSave.click();
});
$('#delete_slider').click(function(e){
e.preventDefault();
/*var target = $('#images_id');
var target_url = $('#images_url');*/
var btnSave = $('#publishing-action input.button');
/*target.val("");
target_url.val("");*/
$('#deleting_slider').val("Deleting...");
$('#delete_slider').text("Deleting...");
btnSave.click();
});
});
然后我创建名为metabox.php的文件来创建元数据箱
<?php
function koplan_add_metabox(){
add_meta_box(
'koplan_metabox_gallery',
'Slider Gallery',
'koplan_show_metabox',
'post'
);
}
function koplan_add_maps_metabox(){
add_meta_box(
'koplan_metabox_maps',
'Maps Descriptions',
'koplan_show_maps_metabox',
'post'
);
}
function koplan_show_metabox($post){
$ids = get_post_meta($post->ID, 'gallery_images', true);
$urls = get_post_meta($post->ID,'images',true);
?>
<a href="#" id="open_media" class="button">Add Slider</a>
<hr>
<input type="hidden" name="gallery_images" id="images_id" value="<?php echo $ids; ?>">
<input type="hidden" name="gallery_urls" id="images_url" value="<?php echo $urls; ?>">
<input type="hidden" name="deleting_slider_post_meta" id="deleting_slider" value="<?php echo $urls; ?>">
<?php
if($ids=="" and $urls==""){
return;
}
else{
echo do_shortcode('');
}
?>
<hr>
<a href="#" id="delete_slider" name="delete_slider_post_meta" class="button">Delete Slider</a>
<?php
}
function koplan_save_gallery_metabox($post_id){
if ( defined( 'DOING_AUTOSAVE' ) && DOING_AUTOSAVE ) {
return;
}
if(! isset($_POST['gallery_images']) && !isset($_POST['gallery_urls'])){
return;
}
$ids = sanitize_text_field( $_POST['gallery_images'] );
$urls = sanitize_text_field( $_POST['gallery_urls'] );
$terms = wp_get_object_terms( $post_id, 'category', array( 'fields' => 'names' ) );
/*$termsname = $terms[0]->name;*/
if(strlen($terms[1]) > strlen($terms[0])){
$term = $terms[1];
}
else{
$term = $terms[0];
}
$sldata = '<slider images="'.$term.'" />';
update_post_meta($post_id, 'slider', $sldata);
update_post_meta($post_id, 'gallery_images', $ids);
update_post_meta($post_id, 'images', $urls);
if(isset($_POST['deleting_slider_post_meta']) && $_POST['deleting_slider_post_meta'] != ""){
delete_post_meta($post_id, 'slider', $sldata);
delete_post_meta($post_id, 'gallery_images', $ids);
delete_post_meta($post_id, 'images', $urls);
}
}
function koplan_show_maps_metabox($post){
$desc = get_post_meta($post->ID,'mapsdesc',true);
if($desc!=""){
?>
<textarea name="maps_descriptions" id="desc_editor" placeholder="Insert Descriptions Here" class="wp-editor-area" cols="40" autocomplete="off" style="height:320px; width:100%;"><?php echo $desc; ?></textarea>
<?php
}else{
?>
<textarea name="maps_descriptions" id="desc_editor" placeholder="Insert Descriptions Here" class="wp-editor-area" cols="40" autocomplete="off" style="height:320px; width:100%;"></textarea>
<?php
}
?>
<hr>
<a href="#" class="button" id="save_desc">Save</a>
<?php
}
function koplan_save_maps_desc_metabox($post_id){
if (define('DOING_AUTOSAVE') && DOING_AUTOSAVE){
return;
}
if(!isset($_POST['maps_descriptions'])){
return;
}
$desc = $_POST['maps_descriptions'];
update_post_meta($post_id,'mapsdesc',$desc);
}
add_action( 'add_meta_boxes', 'koplan_add_metabox' );
add_action('add_meta_boxes','koplan_add_maps_metabox');
add_action( 'save_post', 'koplan_save_gallery_metabox' );
add_action( 'save_post', 'koplan_save_maps_desc_metabox' );
?>
我说问题解决了,案件结案了.谢谢大家,谢谢stackoverflow
标签：jquery,wordpress,php,javascript,custom-fields 来源： https://codeday.me/bug/20190703/1362108.html