Как добавить несколько изображений в пользовательский тип публикации?


Я хотел бы создать простой плагин для добавления нескольких изображений в пользовательский тип публикации. Я создал плагин для добавления одного изображения в пользовательский тип публикации, но я не могу понять, как добавить несколько. enter image description here вот где я нахожусь.

Файл Js-

    jQuery(document).ready(function($) {

    // add image uploader functionality
        var meta_image_frame;

      $('.meta-image-button').live('click', function(e){
            e.preventDefault();

            if( meta_image_frame ){
                wp.media.editor.open();
                return;
            }

            meta_image_frame = wp.media.frames.file_frame = wp.media({
                title: 'Portfolio Image Gallery Selection Window',
                button: {text: 'Add to Gallery'},
                library: { type: 'image'},
                  multiple: false
            });

            meta_image_frame.on('select', function(){
                var media_attachment = meta_image_frame.state().get('selection').first().toJSON();

                   var url = '';

                $('#meta-image').val(media_attachment.url);


            });

            meta_image_frame.open();

      });

      $('#add-input').click(function(event){

            add_input()
        }); 

        function add_input(){


            var input = "<p><label for='meta-image' class=''>Add Project Image</label>"
                              +"<input type='text' name='meta-image' id='meta-image' value='' />"
                              +"<input type='button' class='meta-image-button button' value='Upload Image' />"
                              +"<input type='button' class='meta-image-button button remove-button' value='Remove Image' /></p>";

            $('#images-container').append(input);

        }

}); //end main jquery function

Это мой php-файл -

    <?php

/*----------------------------------------------------------
                       Create Post Type
------------------------------------------------------------*/

function portfolio_create_post_type(){
    $labels = array(
            'name' => __('Portfolio', 'portfolio'),
            'singular_name' => __('Project', 'portfolio'),
            'add_new' => __('New project', 'portfolio'),
            'add_new_item' => __('Add new project', 'portfolio'),
            'edit_item' => __('Edit project', 'portfolio'),
            'new_item' => __('New project', 'portfolio'),
            'view_item' => __('View project', 'portfolio'),
            'search_item' => __('Search project', 'portfolio'),
            'not_found' => __('No products Found', 'portfolio'),
            'not_found_in_trash' => __('No products found in trash', 'portfolio')
        );
    $args = array(
            'labels' => $labels,
            'public' => true,
            'supports' => array(
                    'title',
                    'thumbnail',
                    'editor',
                ),
            'taxonomies' => array('post_tag', 'category')
        );
    register_post_type('Portfolio', $args);
}

add_action('init', 'portfolio_create_post_type' );


/*----------------------------------------------------------
                       Create Meta Box
------------------------------------------------------------*/


function portfolio_meta_box(){
    add_meta_box( 'portfolio_gallery', 'Project Gallery', 'project_meta_box_cb','Portfolio', 'normal', 'high' );
}//portfolio_meta_box

add_action( 'add_meta_boxes', 'portfolio_meta_box' );

/*----------------------------------------------------------
                  Meta Box Fields
------------------------------------------------------------*/

function project_meta_box_cb(){
                wp_nonce_field( basename( __FILE__ ), 'prfx_nonce' );
                $prfx_stored_meta = get_post_meta( $post->ID );

                ?>
                <div class="wrap">
                <input type="button" id="add-input" value="Add Image">

                <div id="images-container">


                </div><!-- end images container -->
                </div>
                <?php
            }

/*----------------------------------------------------------
                  Save the Data
------------------------------------------------------------*/
function project_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-image' ] ) ) {
        update_post_meta( $post_id, 'meta-image', $_POST[ 'meta-image' ] );

    }
}

add_action( 'save_post', 'project_meta_save' );

/*----------------------------------------------------------
                  Load Javascript File
------------------------------------------------------------*/
function project_image_enqueue() {
    global $typenow;
    if( $typenow == 'portfolio' ) {
        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');
        wp_enqueue_script( 'meta-box-image' );
    }
}
add_action( 'admin_enqueue_scripts', 'project_image_enqueue' );

?>
Author: fahad.kazi, 2014-08-25

2 answers

Это может быть альтернативой для вас. Плагин Расширенные пользовательские поля содержит поле изображения, которое позволяет загружать и выбирать изображения. Вы можете настроить отображение поля на страницах пользовательских типов записей, а также интегрировать строку кода в файл шаблона. Вы можете создать столько полей изображения, сколько необходимо. Узнайте больше о поле изображения здесь.

 3
Author: streetfire, 2014-08-25 22:58:38

Вы можете использовать плагин Meta Box , который поддерживает различные поля изображений (вы можете выбрать из медиатеки или загрузить изображение, точно так же, как вставлять изображения в редактор сообщений. Вы можете выбрать либо:

  • image_advanced поле, которое действует как кнопка Добавить медиа WordPress
  • file_input, который позволяет выбрать существующее изображение или использовать внешний URL-адрес для изображения
  • plupload_image, которые показывают заполнитель для перетаскивания файлы

Кроме того, этот плагин позволяет клонировать поля, если вы хотите, чтобы вам было проще создавать галерею.

Вы можете интегрировать плагин с любым пользовательским типом записи и создать столько полей, сколько захотите. Вот список поддерживаемых полей.

 0
Author: Anh Tran, 2015-12-07 01:20:30