Cum să adaugi un câmp personalizat în editarea rapidă

Există câțiva pași pentru a crea o casetă de editare rapidă personalizată și o coloană personalizată

1. creați o cheie meta personalizată (se presupune că aveți deja una)
2. adăugați titlul și datele coloanei personalizate în administrare (se presupune că doriți să afișați cheia meta personalizată în coloană, dacă nu, puteți modifica puțin logica pentru a obține același efect deoarece principiul este același)
3. adăugați caseta de editare rapidă personalizată
4. adăugați logica de salvare
5. încărcați scriptul pentru a modifica funcția originală inline-edit-post pentru a suporta valoarea meta personalizată
6. pregătiți fișierul de script

Acest exemplu va adăuga o casetă de introducere rapidă în tipul de postare Pagină. Următorul cod a fost testat și funcționează prin plasarea în functions.php.

1. creați o cheie meta personalizată (se presupune că aveți deja una)

Am pregătit o cheie meta personalizată remark pentru tipul de postare page

2. adăugați titlul și datele coloanei personalizate în administrare

pentru tipul de postare personalizat, puteți utiliza

Adăugați titlul coloanei

• Pentru un ID de ecran specific manage_{$screen->id}_columns
• Special pentru Pagini manage_pages_columns
• Special pentru generic (Post implicit sau tip de postare personalizat) manage_posts_custom_column sau pentru un tip de postare specific manage_{$post->post_type}_posts_custom_column pentru a adăuga datele coloanei

Adăugați conținutul coloanei

• Generic (Post implicit sau tip de postare personalizat) manage_posts_columns cu verificarea tipului de postare folosind argumentul post type sau pentru un tip de postare specific manage_{$post_type}_posts_columns pentru a adăuga titlul coloanei

Următorul este un exemplu pentru tipul de postare Pagină, precum și pentru tipul de postare personalizat + implicit Post ca exemplu pentru configurarea mai multor tipuri de postări.

// adăugați titlul coloanei personalizate pentru valoarea meta personalizată
add_filter('manage_edit-page_columns', 'ws365150_add_custom_columns_title' );
function ws365150_add_custom_columns_title( $columns ) {
    $columns['page_remark'] = 'Remarcă'; // puteți utiliza __() mai târziu pentru suport de traducere
    
    return $columns;
}
    
// adăugați datele coloanei personalizate cu valoarea meta personalizată
add_action('manage_pages_custom_column', 'ws365150_add_custom_column_data', 10, 2 );
function ws365150_add_custom_column_data( $column_name, $post_id ) {
    switch ( $column_name ) {
        case 'page_remark':
            echo get_post_meta( $post_id, 'remark', true );
            break;
        
        default:
            break;
    }
}

Următorul este un exemplu pentru tipul de postare personalizat episode + implicit Post cu cheia meta summary

// adăugați titlul coloanei personalizate pentru valoarea meta personalizată
// 'manage_pages_columns' sau 'manage_edit-post_columns' ambele funcționează
add_filter('manage_posts_columns', 'ws365150_add_custom_columns_title_pt', 10, 2 );
function ws365150_add_custom_columns_title_pt( $columns, $post_type ) {
    switch ( $post_type ) {
        case 'post':
        case 'episode':
            $columns['ws365150_summary'] = 'Rezumat'; // puteți utiliza __() mai târziu pentru suport de traducere
            break;
        
        default:
            
            break;
    }
    
    return $columns;
}
    
// adăugați datele coloanei personalizate cu valoarea meta personalizată pentru tipuri de postări personalizate
add_action('manage_posts_custom_column', 'ws365150_add_custom_column_data_pt', 10, 2 );
function ws365150_add_custom_column_data_pt( $column_name, $post_id ) {
    switch ( $column_name ) {
        case 'ws365150_summary': // specificat pentru această coloană asignată în titlul coloanei
            echo get_post_meta( $post_id, 'summary', true );
            break;
        
        default:
            break;
    }
}

3. adăugați caseta de editare rapidă personalizată

// pentru pagină
add_action( 'quick_edit_custom_box', 'ws365150_custom_edit_box', 10, 3 );
function ws365150_custom_edit_box( $column_name, $post_type, $taxonomy ) {
    global $post;

    switch ( $post_type ) {
        case 'page':

        if( $column_name === 'page_remark' ): // același titlu de coloană ca cel definit în pasul anterior
        ?>
                <?php // echo get_post_meta( $post->ID, 'remark', true ); ?>
            <fieldset class="inline-edit-col-right" id="#edit-">
                <div class="inline-edit-col">
                    <label>
                        <span class="title">Remarcă</span>
                        <span class="input-text-wrap"><input type="text" name="remark" class="inline-edit-menu-order-input" value=""></span>
                    </label>
                </div>
            </fieldset>
            <?php
        endif;
            // echo 'custom page field';
            break;
        
        default:
            break;
    }
}

// pentru Post + tip de postare personalizat
add_action( 'quick_edit_custom_box', 'ws365150_custom_edit_box_pt', 10, 3 );
function ws365150_custom_edit_box_pt( $column_name, $post_type, $taxonomy ) {
    global $post;

    switch ( $post_type ) {
        case 'post':
        case 'episode':

        if( $column_name === 'ws365150_summary' ): // același titlu de coloană ca cel definit în pasul anterior
        ?>
                <?php // echo get_post_meta( $post->ID, 'remark', true ); ?>
            <fieldset class="inline-edit-col-right" id="#edit-">
                <div class="inline-edit-col">
                    <label>
                        <span class="title">Rezumat</span>
                        <span class="input-text-wrap"><input type="text" name="summary" class="inline-edit-menu-order-input" value=""></span>
                    </label>
                </div>
            </fieldset>
            <?php
        endif;
            // echo 'custom page field';
            break;
        
        default:
            break;
    }
}

4. adăugați logica de salvare

add_action( 'save_post', 'ws365150_update_custom_quickedit_box' );
function ws365150_update_custom_quickedit_box() {
    // orice logică de verificare aici, omițând și păstrând simplu pentru scopul ilustrării simple (nonce, existența $_POST['remark'], salvare ajax și așa mai departe
    
    // remarcă în Pagină
    if( isset( $_POST ) && isset( $_POST['remark'] ) ) { // unde remark este definit în <input name="remark">
        update_post_meta($_POST['post_ID'], 'remark', $_POST['remark']);
    }

    // rezumat în Post, tip de postare personalizat
    if( isset( $_POST ) && isset( $_POST['summary'] ) ) { // unde summary este definit în <input name="summary">
        update_post_meta($_POST['post_ID'], 'summary', $_POST['summary']);
    }
    
    // pentru depanare în inspector, nu este necesar, activarea acestuia va întrerupe salvarea dar puteți vedea răspunsul ajax
    // wp_send_json_success( array(
    //  'message' => 'Save test!',
    //  'post_data' => $_POST,
    // ) );
    return; // finalizează apelul funcției
}

5. încărcați scriptul pentru a modifica funcția originală inline-edit-post

add_action( 'admin_enqueue_scripts', function( $page ) {

    // adăugați logica de verificare a paginii, aceasta este una simplă, puteți testa tipul de postare și așa mai departe...
    if ( 'edit.php' != $page ) {
        return;
    }
    
    wp_enqueue_script( 'custom-quickedit-box', get_stylesheet_directory_uri() . '/ws365150_custom_quickedit_box.js', array( 'jquery', 'inline-edit-post' ) );
});

6. pregătiți fișierul de script (ws365150_custom_quickedit_box.js, când testați codul de mai sus, puneți-l în folderul temei)

( function( $, wp ) {
    // clonare din funcția originală din inline-post-edit.js pentru suprascriere
    // de fapt nu este necesar să creați un alias de obiect, totuși, crearea unui alias poate fi o notă și un marcaj de suprascriere fără a uita pentru întreținerea ulterioară
    window.customInlineEditPost = window.inlineEditPost;

    // suprascriere funcție: adăugați valoare meta personalizată, baza este copiată din sursă
    customInlineEditPost.edit = function(id) {
            // console.log( 'custom edit' );
            var t = this, fields, editRow, rowData, status, pageOpt, pageLevel, nextPage, pageLoop = true, nextLevel, f, val, pw;
            t.revert();

            if ( typeof(id) === 'object' ) {
                id = t.getId(id);
            }

            fields = ['post_title', 'post_name', 'post_author', '_status', 'jj', 'mm', 'aa', 'hh', 'mn', 'ss', 'post_password', 'post_format', 'menu_order', 'page_template'];
            if ( t.type === 'page' ) {
                fields.push('post_parent');
            }

            // Adăugați noul rând de editare cu un rând gol suplimentar dedesubt pentru a menține dungile zebra.
            editRow = $('#inline-edit').clone(true);
            $( 'td', editRow ).attr( 'colspan', $( 'th:visible, td:visible', '.widefat:first thead' ).length );

            $(t.what+id).removeClass('is-expanded').hide().after(editRow).after('<tr class="hidden"></tr>');

            // Populați câmpurile în fereastra de editare rapidă.
            rowData = $('#inline_'+id);
            if ( !$(':input[name="post_author"] option[value="' + $('.post_author', rowData).text() + '"]', editRow).val() ) {

                // Autorul postării nu mai are capacități de editare, așa că trebuie să îi adăugăm în lista de autori.
                $(':input[name="post_author"]', editRow).prepend('<option value="' + $('.post_author', rowData).text() + '">' + $('#' + t.type + '-' + id + ' .author').text() + '</option>');
            }
            if ( $( ':input[name="post_author"] option', editRow ).length === 1 ) {
                $('label.inline-edit-author', editRow).hide();
            }

            // populați valoarea meta personalizată
            if ( $( ':input[name="remark"]', editRow ).length === 1 ) {
                $( ':input[name="remark"]', editRow ).val( $('#post-' + id + ' .page_remark').text() );
            }

            if ( $( ':input[name="summary"]', editRow ).length === 1 ) {
                $( ':input[name="summary"]', editRow ).val( $('#post-' + id + ' .ws365150_summary').text() );
            }

            for ( f = 0; f < fields.length; f++ ) {
                val = $('.'+fields[f], rowData);

                /**
                 * Înlocuiește imaginea pentru un Twemoji(Twitter emoji) cu textul său alternativ.
                 *
                 * @returns Text alternativ din imagine.
                 */
                val.find( 'img' ).replaceWith( function() { return this.alt; } );
                val = val.text();
                $(':input[name="' + fields[f] + '"]', editRow).val( val );
            }

            if ( $( '.comment_status', rowData ).text() === 'open' ) {
                $( 'input[name="comment_status"]', editRow ).prop( 'checked', true );
            }
            if ( $( '.ping_status', rowData ).text() === 'open' ) {
                $( 'input[name="ping_status"]', editRow ).prop( 'checked', true );
            }
            if ( $( '.sticky', rowData ).text() === 'sticky' ) {
                $( 'input[name="sticky"]', editRow ).prop( 'checked', true );
            }

            /**
             * Creează casetele de selectare pentru categorii.
             */
            $('.post_category', rowData).each(function(){
                var taxname,
                    term_ids = $(this).text();

                if ( term_ids ) {
                    taxname = $(this).attr('id').replace('_'+id, '');
                    $('ul.'+taxname+'-checklist :checkbox', editRow).val(term_ids.split(','));
                }
            });

            /**
             * Obține toate taxonomiile pentru sugestii de auto-completare în timp real când tastați numele
             * al unei etichete.
             */
            $('.tags_input', rowData).each(function(){
                var terms = $(this),
                    taxname = $(this).attr('id').replace('_' + id, ''),
                    textarea = $('textarea.tax_input_' + taxname, editRow),
                    comma = inlineEditL10n.comma;

                terms.find( 'img' ).replaceWith( function() { return this.alt; } );
                terms = terms.text();

                if ( terms ) {
                    if ( ',' !== comma ) {
                        terms = terms.replace(/,/g, comma);
                    }
                    textarea.val(terms);
                }

                textarea.wpTagsSuggest();
            });

            // Gestionează starea postării.
            status = $('._status', rowData).text();
            if ( 'future' !== status ) {
                $('select[name="_status"] option[value="future"]', editRow).remove();
            }

            pw = $( '.inline-edit-password-input' ).prop( 'disabled', false );
            if ( 'private' === status ) {
                $('input[name="keep_private"]', editRow).prop('checked', true);
                pw.val( '' ).prop( 'disabled', true );
            }

            // Eliminați pagina curentă și copiii din meniul derulant părinte.
            pageOpt = $('select[name="post_parent"] option[value="' + id + '"]', editRow);
            if ( pageOpt.length > 0 ) {
                pageLevel = pageOpt[0].className.split('-')[1];
                nextPage = pageOpt;
                while ( pageLoop ) {
                    nextPage = nextPage.next('option');
                    if ( nextPage.length === 0 ) {
                        break;
                    }

                    nextLevel = nextPage[0].className.split('-')[1];

                    if ( nextLevel <= pageLevel ) {
                        pageLoop = false;
                    } else {
                        nextPage.remove();
                        nextPage = pageOpt;
                    }
                }
                pageOpt.remove();
            }

            $(editRow).attr('id', 'edit-'+id).addClass('inline-editor').show();
            $('.ptitle', editRow).focus();

            return false;
    };
})( jQuery, window.wp );

Cele de mai sus sunt pentru editarea rapidă folosind hook-ul quick_edit_custom_box, și poate fi necesar să vă ocupați și de editarea în masă. Puteți explora mai multe citind și folosind bulk_edit_custom_box.