반응형
옵션 페이지에 메타박스 이미지 업로드 옵션 추가
일반 게시물 아래 사용자 정의 메타박스 이미지 업로드 옵션입니다.나는 아래와 같은 옵션을 원합니다.add_options_page
아니면add_menu_page
. 어떻게 할까요?
<?php
/**
* Adds a meta box to the post editing screen
*/
function prfx_custom_meta() {
add_meta_box( 'prfx_meta', __( 'Meta Box Title', 'prfx-textdomain' ), 'prfx_meta_callback', 'post' );
}
add_action( 'add_meta_boxes', 'prfx_custom_meta' );
/**
* Outputs the content of the meta box
*/
function prfx_meta_callback( $post ) {
wp_nonce_field( basename( __FILE__ ), 'prfx_nonce' );
$prfx_stored_meta = get_post_meta( $post->ID );
?>
<p>
<label for="meta-image" class="prfx-row-title"><?php _e( 'Example File Upload', 'prfx-textdomain' )?></label>
<input type="text" name="meta-image" id="meta-image" value="<?php if ( isset ( $prfx_stored_meta['meta-image'] ) ) echo $prfx_stored_meta['meta-image'][0]; ?>" />
<input type="button" id="meta-image-button" class="button" value="<?php _e( 'Choose or Upload an Image', 'prfx-textdomain' )?>" />
</p>
<?php
}
/**
* Saves the custom meta input
*/
function prfx_meta_save( $post_id ) {
// Checks save status
$is_autosave = wp_is_post_autosave( $post_id );
$is_revision = wp_is_post_revision( $post_id );
$is_valid_nonce = ( isset( $_POST[ 'prfx_nonce' ] ) && wp_verify_nonce( $_POST[ 'prfx_nonce' ], basename( __FILE__ ) ) ) ? 'true' : 'false';
// Exits script depending on save status
if ( $is_autosave || $is_revision || !$is_valid_nonce ) {
return;
}
// Checks for input and sanitizes/saves if needed
if( isset( $_POST[ 'meta-text' ] ) ) {
update_post_meta( $post_id, 'meta-text', sanitize_text_field( $_POST[ 'meta-text' ] ) );
}
// Checks for input and saves if needed
if( isset( $_POST[ 'meta-image' ] ) ) {
update_post_meta( $post_id, 'meta-image', $_POST[ 'meta-image' ] );
}
}
add_action( 'save_post', 'prfx_meta_save' );
/**
* Adds the meta box stylesheet when appropriate
*/
function prfx_admin_styles(){
global $typenow;
if( $typenow == 'post' ) {
wp_enqueue_style( 'prfx_meta_box_styles', plugin_dir_url( __FILE__ ) . 'meta-box-styles.css' );
}
}
add_action( 'admin_print_styles', 'prfx_admin_styles' );
/**
* Loads the color picker javascript
*/
function prfx_color_enqueue() {
global $typenow;
if( $typenow == 'post' ) {
wp_enqueue_style( 'wp-color-picker' );
wp_enqueue_script( 'meta-box-color-js', plugin_dir_url( __FILE__ ) . 'meta-box-color.js', array( 'wp-color-picker' ) );
}
}
add_action( 'admin_enqueue_scripts', 'prfx_color_enqueue' );
/**
* Loads the image management javascript
*/
function prfx_image_enqueue() {
global $typenow;
if( $typenow == 'post' ) {
wp_enqueue_media();
// Registers and enqueues the required javascript.
wp_register_script( 'meta-box-image', plugin_dir_url( __FILE__ ) . 'meta-box-image.js', array( 'jquery' ) );
wp_localize_script( 'meta-box-image', 'meta_image',
array(
'title' => __( 'Choose or Upload an Image', 'prfx-textdomain' ),
'button' => __( 'Use this image', 'prfx-textdomain' ),
)
);
wp_enqueue_script( 'meta-box-image' );
}
}
add_action( 'admin_enqueue_scripts', 'prfx_image_enqueue' );
업로드 옵션 아래에 옵션 페이지를 설정하고 싶습니다.
아래는 업로드 이미지에 대한 옵션 페이지 코드입니다.
PHP 코드:
function your_enqueue_scripts(){
wp_enqueue_script('media-upload');
wp_enqueue_script('thickbox');
wp_enqueue_style('thickbox');
}
?>
JS 코드:
jQuery(document).ready(function($){
//upload image
$("#upload_image_button").click(function(event) {
formfield = jQuery('#your_image').attr('name');
tb_show('', 'media-upload.php?type=image&TB_iframe=true');
return false;
});
window.send_to_editor = function(html) {
if(formfield) {
jQuery('#your_image').replaceWith('<input id="your_image" type="text" name="your_image" value="" style="width:500px" />');
fileurl = jQuery('img','<div>'+html+'</div>').attr('src');
jQuery('#your_image').val(fileurl);
jQuery('#your_image_hidden').attr('value',fileurl);
}
tb_remove();
}
});
HTML 렌더링:
if(get_option('your_image')!='')
{
?>
<img src="<?php echo get_option('your_image');?>" name="your_image" id="your_image" height="100" width="100" />
<input id="bos_logo_hidden" type="hidden" name="your_image" value="<?php echo get_option('your_image');?>" style="width:500px" />
<?php
}
else
{
?>
<input id="your_image" type="text" name="your_image" value="" style="width:500px" />
<?php
}
?>
<br/><br/>
<input id="upload_image_id" type="hidden" name="upload_image_id" value="" readonly="readonly" />
<?php
if(get_option('your_image')!='')
{
?>
<input id="upload_image_button" type="button" value="Change Image" class="button-primary " />
<?php
}
else
{
?>
<input id="upload_image_button" type="button" value="Upload Image" class="button-primary" />
<?php
}
언급URL : https://stackoverflow.com/questions/39381072/add-meta-box-image-upload-option-into-options-page
반응형
'programing' 카테고리의 다른 글
데이터베이스 엔진 복구 핸들에서 대기하지 못했습니다.SQL Server 오류 로그에서 잠재적 원인 확인 (0) | 2023.11.06 |
---|---|
MySQL 데이터베이스에서 특정 열 이름을 검색하려면 어떻게 해야 합니까? (0) | 2023.11.06 |
어떤 립을 쓸까요?libmariadbc 클라이언트 또는 libmysql 클라이언트? (0) | 2023.11.06 |
MySQLDB Python 삽입 %d 및 %s (0) | 2023.11.06 |
왜 git가 post-pull merge commit 메시지를 표시합니까? (0) | 2023.11.06 |