...
✅ Nowości, motywy, wtyczki WEB i WordPress. Tutaj dzielimy się wskazówkami i najlepszymi rozwiązaniami dla stron internetowych.

Jak dostosować formularz komentarzy w WordPress

294

WordPress zawiera w swoim rdzeniu formularz komentarza. Ten formularz komentarza będzie zwykle wyświetlany w Twoich postach. Odwiedzający mogą zostawić swoją opinię za pomocą formularza komentarzy. Udostępnianie funkcji komentarzy dla odwiedzających pomaga zrozumieć, co myślą o Twoich treściach. Pomoże to ulepszyć twoją treść i pracować nad innymi opiniami.

Domyślnie WordPress udostępnia pola, takie jak wiadomość, imię i nazwisko, adres e-mail, witryna internetowa i pole wyboru (aby zapisać swoje dane w przeglądarce do następnego komentarza) w formularzu komentarza. W zależności od wymagań może być konieczne dodanie lub usunięcie pól z formularzy komentarzy.

Można również dodać stylizację do renderowanego formularza komentarza. WordPress zapewnia unikalną klasę pól formularza i komentarza. Korzystając z tych klas, użytkownicy mogą stosować własne style.

W tym artykule zobaczymy, jak dodać jeszcze jedno pole do istniejącego formularza komentarzy. Jako przykład wezmę pole numeru telefonu komórkowego i dodam je do formularza. Tak więc, aby dostosować formularz komentarza, wykonamy poniższe kroki jeden po drugim.

  • Dodaj pole do formularza komentarza
  • Sprawdź, czy pole jest puste, czy nie
  • Zapisz to pole jako meta komentarza
  • Wyświetl Meta Box w formularzu edycji komentarzy (na zapleczu)
  • Zapisz meta komentarza (z zaplecza)

Oprócz tego pokażę Ci również, jak usunąć pole z formularza komentarza WordPress.

Dodaj pole do formularza komentarza

Formularz komentarza jest renderowany z podstawowych plików WordPressa i nie powinniśmy dotykać żadnych plików podstawowych. Na szczęście WordPress udostępnia haki rozszerzające podstawowe funkcje. Mimo to WordPress udostępnia hak akcji, comment_form_after_fieldsza pomocą którego możemy dodawać pola do formularza komentarza.

Dodajmy numer telefonu komórkowego za pomocą tego haka akcji. Umieść poniższy kod w functions.phppliku.

add_action( 'comment_form_after_fields', 'additional_fields' );
function additional_fields() {
    echo '<p class="comment-form-mobile-number">'.     '<label for="mobile-number">'. esc_html__( 'Mobile Number' ). '<span class="required">*</span></label>'.     '<input id="mobile-number" name="mobile-number" type="text" size="30" tabindex="5" /></p>';
}

Teraz przejdź do swojej strony internetowej i załaduj ją ponownie. Powinieneś zobaczyć nowe pole „Numer telefonu komórkowego" dodane do twojego formularza komentarza.

Jak dostosować formularz komentarzy w WordPress

Sprawdź, czy pole jest puste, czy nie

Ten krok jest opcjonalny. Jeśli nie chcesz, aby pole mobilne było obowiązkowe, pomiń ten krok. Jeśli to pole jest wymagane, musimy sprawdzić, czy odwiedzający je wypełnili, czy nie. Aby dodać te sprawdzenia w czasie wykonywania, użyjemy filtru preprocess_comment. Gdy użytkownik kliknie przycisk przesyłania, ten filtr sprawdza, czy określone pole jest puste, czy nie. Jeśli jest pusty, zatrzymuje wykonywanie i wyświetla komunikat użytkownikom.

Użyj filtra, preprocess_commentjak pokazano w poniższym kodzie. Ten kod również wchodzi do functions.phppliku.

add_filter( 'preprocess_comment', 'verify_comment_mobile_number' );
function verify_comment_mobile_number( $commentdata) {
    if (empty( $_POST['mobile-number'])) {
        wp_die( esc_html__( 'Error: You did not add a mobile number. Please resubmit your comment with a mobile number.') );
    }
 
    return $commentdata;
}

Zapisz nowe pole przed komentarzem

W poprzednich krokach dodaliśmy nowe pole, a także zobaczyliśmy, jak uczynić je obowiązkowym. Teraz powinniśmy zapisać to pole w bazie danych pod tym samym komentarzem. Aby to osiągnąć, użyjemy akcji comment_post. Ta akcja daje nam identyfikator aktualnie przesłanego komentarza. Korzystając z id komentarza, możemy zapisać nasze pole mobilne z add_comment_metafunkcją.

add_action( 'comment_post', 'save_comment_mobile_number' );
function save_comment_mobile_number( $comment_id) {
    if (( isset( $_POST['mobile-number'])) && (! empty( $_POST['mobile-number']) )) {
        $mobile_number = wp_filter_nohtml_kses($_POST['mobile-number']);
        add_comment_meta( $comment_id, 'mobile-number', $mobile_number );
    }
}

Tutaj użyłem wp_filter_nohtml_ksesfunkcji do oczyszczenia wprowadzonych danych.

Wyświetl Meta Box w formularzu edycji komentarzy (na zapleczu)

Jak dotąd skończyliśmy z dodawaniem nowego pola do formularza komentarza frontendowego i zapisywaniem tego nowo dodanego pola. Teraz jako administrator powinieneś widzieć to pole na zapleczu.

Jeśli przejdziesz do listy komentarzy na zapleczu, zobaczysz, że każdy komentarz ma swój własny formularz edycji. Z tego formularza administrator może edytować komentarz. Naszym następnym celem jest pokazanie numeru telefonu komórkowego w tym formularzu edycji komentarza.

W tym celu dodam metabox, pod którym umieścimy numer telefonu komórkowego. Użyj poniższego kodu, functions.phpktóry doda metabox z numerem telefonu komórkowego.

add_action( 'add_meta_boxes_comment', 'comment_add_meta_box' );
function comment_add_meta_box() {
    add_meta_box( 'title', __( 'Comment Metadata' ), 'comment_meta_box', 'comment', 'normal', 'high' );
}
 
function comment_meta_box( $comment) {
    $mobile_number = get_comment_meta( $comment->comment_ID, 'mobile-number', true );
    wp_nonce_field( 'comment_update', 'comment_update_nonce', false );
    ?>
    <p>
        <label for="mobile-number"><?php esc_html_e( 'Mobile Number' ); ?></label>
        <input type="text" name="mobile-number" value="<?php echo esc_attr( $mobile_number ); ?>" class="widefat" />
    </p>
    <?php
}

Zapisz meta komentarza (z zaplecza)

Prawie skończyliśmy z zadaniem. Ostatnią rzeczą, która pozostaje, jest edycja numeru telefonu komórkowego, gdy administrator go zaktualizuje. Można to łatwo zrobić za pomocą edit_commentdziałania w następujący sposób.

add_action( 'edit_comment', 'comment_edit_metafields' );
function comment_edit_metafields( $comment_id) {
    if (! isset( $_POST['comment_update_nonce']) ||! wp_verify_nonce( $_POST['comment_update_nonce'], 'comment_update')) {
        return;
    }
  
    if (( isset( $_POST['mobile-number'])) && (! empty( $_POST['mobile-number'])) ):         $mobile_number = wp_filter_nohtml_kses( $_POST['mobile-number'] );
        update_comment_meta( $comment_id, 'mobile-number', $mobile_number );
    else:         delete_comment_meta( $comment_id, 'mobile-number' );
    endif;
}

Wszystko sprowadza się do dodania nowego pola poprzez dostosowanie formularza komentarza w WordPress. Zobaczmy teraz, jak można usunąć pola z formularza komentarza.

Usuń pole z formularza komentarza w WordPress

Jak wszyscy wiemy, WordPress udostępnia kilka pól (wiadomość, imię, adres e-mail, strona internetowa i pole wyboru) w formularzu komentarza. Możesz usunąć dowolny z nich. Załóżmy, że chcesz usunąć pole witryny z formularza. Możemy to zrobić za pomocą filtra comment_form_default_fields. Powinieneś znać klucz pola strony. Teraz pytanie brzmi, jak zdobyć klucze pól formularza komentarza.

Robię to zapisując pola do fikcyjnego pliku tekstowego.

add_filter('comment_form_default_fields', 'remove_comment_form_fields');
function remove_comment_form_fields($fields) {
    file_put_contents('test.txt', print_r($fields, true));
}

Teraz, jeśli przeładujesz stronę, która ma formularz komentarza, plik test.txtzostanie utworzony w folderze głównym. W moim przypadku ten plik ma następującą zawartość.

Array (    [author] => <p class="comment-form-author"><label for="author">Name <span class="required">*</span></label> <input id="author" name="author" type="text" value="" size="30" maxlength="245" required='required' /></p>
    [email] => <p class="comment-form-email"><label for="email">Email <span class="required">*</span></label> <input id="email" name="email" type="email" value="" size="30" maxlength="100" aria-describedby="email-notes" required='required' /></p>
    [url] => <p class="comment-form-url"><label for="url">Website</label> <input id="url" name="url" type="url" value="" size="30" maxlength="200" /></p>
    [cookies] => <p class="comment-form-cookies-consent"><input id="wp-comment-cookies-consent" name="wp-comment-cookies-consent" type="checkbox" value="yes" /> <label for="wp-comment-cookies-consent">Save my name, email, and website in this browser for the next time I comment.</label></p>
)

Wyraźnie podaje klucze pól formularza. Dla pola strony kluczem jest „url”. Zmodyfikuję więc powyższy kod w następujący sposób, co spowoduje usunięcie pola witryny z formularza komentarza.

add_filter('comment_form_default_fields', 'remove_comment_form_fields');
function remove_comment_form_fields($fields) {
    if(isset($fields['url'])) {
       unset($fields['url']);
    }
 
    return $fields;
}

W ten sam sposób możesz również usunąć inne pola formularza komentarza.

Mam nadzieję, że rozumiesz, jak dostosować formularz komentarzy w WordPress. Podziel się swoimi przemyśleniami i sugestiami w sekcji komentarzy poniżej.

Powiązane artykuły

Źródło nagrywania: artisansweb.net

Ta strona korzysta z plików cookie, aby poprawić Twoje wrażenia. Zakładamy, że nie masz nic przeciwko, ale możesz zrezygnować, jeśli chcesz. Akceptuję Więcej szczegółów