您正在尝试使用创建新的管理页add_pages_page()
. 元框仅用于现有帖子类型,不用于管理页面。您需要像在普通管理页面上一样创建字段。
您应该先阅读官方法典:Creating Options Pages
要简单地开始,请看以下示例:
function register_homepage_subpage() {
add_pages_page( \'Customize Homepage\', \'Homepage\', \'manage_options\', \'my_homepage\', \'my_homepage_callback\' );
//call to register settings function, to create our settings group
add_action( \'admin_init\', \'register_homepage_settings\' );
}
add_action( \'admin_menu\', \'register_homepage_subpage\' );
我们创建您的管理页面,就像您在代码中所做的那样。我们还添加了
add_action
调用另一个将注册新管理设置的函数:
function register_homepage_settings() {
//register our settings
register_setting( \'my-homepage-settings-group\', \'my_option\' );
}
之后,您现在可以启动回调函数:
function my_homepage_callback() { ?>
<div class="wrap">
<h1>My Title</h1>
<form method="post" action="options.php">
<?php // get registered fields and section
settings_fields( \'my-homepage-settings-group\' );
do_settings_sections( \'my-homepage-settings-group\' ); ?>
<table class="form-table">
<tr valign="top">
<th scope="row">My Field</th>
<td><input type="text" name="my_option" value="<?php echo esc_attr( get_option(\'my_option\') ); ?>" /></td>
</tr>
</table>
<?php submit_button(); ?>
</form>
</div>
<?php }
我们需要
form
在该函数中创建,并且
submit_button();
以便能够保存新字段。
我们使用获得注册设置settings_fields( \'my-homepage-settings-group\' );
.
添加此代码后,您应该会在管理页面上看到一个标题和一个新的文本字段。您可以输入数据并将其保存。
要创建媒体上传/图像选择字段,您需要更多的代码和jQuery。
首先,您需要一个新按钮来打开wp。媒体窗口。在回调函数中,添加一个新按钮directly after (稍后这一点很重要)我们的文本字段:
...
<td>
<input type="text" name="my_option" value="<?php echo esc_attr( get_option(\'my_option\') ); ?>" />
<input type="button" class="button upload_image_button" value="Add Image" />
</td>
...
然后我们必须将默认
wp_enqueue_media();
还有另一个JS文件,它将保存我们的wp代码。媒体窗口。
function prfx_admin_enqueue() {
// enqueue default WP media uploader
wp_enqueue_media();
// enqueue our media uploader script
wp_enqueue_script( \'prfx-media-script\', plugins_url(\'scripts.js\', __FILE__) );
}
add_action( \'admin_enqueue_scripts\', \'prfx_admin_enqueue\' );
现在我们需要创建
scripts.js
文件及其内容:
jQuery(document).ready(function($){
// if button with class upload_image_button is clicked
$( \'.upload_image_button\' ).on(\'click\', function() {
var mediaUploader;
var button = $(this); // the button with the class uploaded_image_button
// If the uploader object has already been created, reopen the dialog
if (mediaUploader) {
mediaUploader.open();
return;
}
// Extend the wp.media object
mediaUploader = wp.media.frames.file_frame = wp.media({
title: \'Choose Image\', // title text
button: { text: \'Add Image\' }, // but7on text
library: { type: \'image\' }, // type
multiple: false // only one selection
});
// When a file is selected, grab the URL and set it as the text field\'s value
mediaUploader.on(\'select\', function() {
var attachment = mediaUploader.state().get(\'selection\').first().toJSON();
// find the text input field (previous element from button) and add the new value (URL from media)
$(button).prev().val(attachment.url);
});
// Open the uploader dialog
mediaUploader.open();
return false;
});
});
如果现在单击“新建”按钮,将打开一个正常的WP介质窗口。如果选择图像并单击“添加图像”,则图像中的URL应作为新值添加到文本字段中。