...
✅ WEB- und WordPress-Nachrichten, Themen, Plugins. Hier teilen wir Tipps und beste Website-Lösungen.

So passen Sie das Kommentarformular in WordPress an

55

WordPress kommt mit dem Kommentarformular im Kern. Dieses Kommentarformular wird normalerweise in Ihren Beiträgen angezeigt. Die Besucher können ihr Feedback über das Kommentarformular hinterlassen. Die Bereitstellung einer Kommentarfunktion für Besucher hilft Ihnen zu verstehen, was sie über Ihre Inhalte denken. Es wird Ihnen helfen, Ihre Inhalte zu verbessern und auch an anderem Feedback zu arbeiten.

Standardmäßig bietet WordPress im Kommentarformular Felder wie Nachricht, Name, E-Mail, Website und Kontrollkästchen (um Ihre Daten für den nächsten Kommentar im Browser zu speichern). Abhängig von Ihren Anforderungen müssen Sie möglicherweise Felder zu den Kommentarformularen hinzufügen oder entfernen.

Sie können auch Stil für das gerenderte Kommentarformular hinzufügen. WordPress bietet eine einzigartige Klasse für die Formular- und Kommentarfelder. Mit diesen Klassen können Benutzer ihr eigenes Styling anwenden.

In diesem Artikel erfahren Sie, wie Sie dem vorhandenen Kommentarformular ein weiteres Feld hinzufügen. Als Beispiel nehme ich ein Handynummernfeld und füge es dem Formular hinzu. Um das Kommentarformular anzupassen, werden wir die folgenden Schritte nacheinander ausführen.

  • Feld zum Kommentarformular hinzufügen
  • Überprüfen Sie, ob das Feld leer ist oder nicht
  • Dieses Feld als Kommentar-Meta speichern
  • Meta-Box im Kommentarbearbeitungsformular anzeigen (im Backend)
  • Kommentar-Meta speichern (aus dem Backend)

Darüber hinaus zeige ich Ihnen auch, wie Sie das Feld aus dem WordPress-Kommentarformular entfernen.

Feld zum Kommentarformular hinzufügen

Das Kommentarformular wird aus den Kerndateien von WordPress gerendert und wir sollten keine Kerndateien berühren. Glücklicherweise bietet WordPress Hooks, um die Kernfunktionen zu erweitern. Allerdings bietet WordPress einen Action-Hook, comment_form_after_fieldsmit dem wir Felder zum Kommentarformular hinzufügen können.

Fügen wir mit diesem Action-Hook eine Handynummer hinzu. Fügen Sie den folgenden Code in die functions.phpDatei ein.

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>';
}

Gehen Sie nun zu Ihrer Webseite und laden Sie sie neu. Sie sollten das neue Feld ‘Mobile Number’ zu Ihrem Kommentarformular hinzugefügt sehen.

So passen Sie das Kommentarformular in WordPress an

Überprüfen Sie, ob das Feld leer ist oder nicht

Dieser Schritt ist optional. Wenn Sie ein mobiles Feld nicht obligatorisch beibehalten möchten, überspringen Sie diesen Schritt. Wenn dieses Feld erforderlich ist, müssen wir prüfen, ob Besucher dieses Feld ausgefüllt haben oder nicht. Um diese Prüfungen zur Laufzeit hinzuzufügen, verwenden wir den Filter preprocess_comment. Wenn ein Benutzer auf die Schaltfläche "Senden" klickt, überprüft dieser Filter, ob das bestimmte Feld leer ist oder nicht. Wenn es leer ist, stoppt es die Ausführung und zeigt den Benutzern die Nachricht an.

Verwenden Sie den Filter preprocess_commentwie im folgenden Code gezeigt. Dieser Code geht auch in die functions.phpDatei.

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;
}

Neues Feld gegen einen Kommentar speichern

In den vorherigen Schritten haben wir ein neues Feld hinzugefügt und auch gesehen, wie man es obligatorisch macht. Jetzt sollten wir dieses Feld in der Datenbank gegen denselben Kommentar speichern. Um dies zu erreichen, verwenden wir die Aktion comment_post. Diese Aktion gibt uns die aktuell übermittelte Kommentar-ID. Über die Kommentar-ID können wir unser mobiles Feld mit der add_comment_metaFunktion speichern .

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 );
    }
}

Hier habe ich die wp_filter_nohtml_ksesFunktion verwendet, um die eingegebenen Daten zu bereinigen.

Meta-Box im Kommentarbearbeitungsformular anzeigen (im Backend)

Bisher sind wir damit fertig, dem Frontend-Kommentarformular ein neues Feld hinzuzufügen und dieses neu hinzugefügte Feld zu speichern. Jetzt sollten Sie als Administrator dieses Feld im Backend sehen.

Wenn Sie im Backend zur Kommentarliste gehen, können Sie sehen, dass jeder Kommentar ein eigenes Bearbeitungsformular hat. In diesem Formular kann der Administrator den Kommentar bearbeiten. Unser nächstes Ziel ist es, die Handynummer in diesem Kommentarbearbeitungsformular anzuzeigen.

Dazu füge ich eine Metabox hinzu, unter der wir die Handynummer platzieren. Verwenden Sie den unten stehenden Code, der functions.phpeine Meta-Box mit der Handynummer hinzufügt.

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
}

Kommentar-Meta speichern (aus dem Backend)

Wir sind fast fertig mit der Aufgabe. Als letztes müssen Sie die Handynummer bearbeiten, wenn der Administrator sie aktualisiert. Es kann leicht mit Hilfe der edit_commentAktion wie folgt durchgeführt werden.

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;
}

Es geht darum, ein neues Feld hinzuzufügen, indem Sie das Kommentarformular in WordPress anpassen. Sehen wir uns nun an, wie Sie Felder aus dem Kommentarformular entfernen können.

Entfernen Sie das Feld aus dem Kommentarformular in WordPress

Wie wir alle wissen, bietet WordPress im Kommentarformular nur wenige Felder (Nachricht, Name, E-Mail, Website und Kontrollkästchen). Sie können einen von ihnen entfernen. Angenommen, Sie möchten das Website-Feld aus dem Formular entfernen. Wir können dies mit dem Filter comment_form_default_fields tun. Sie sollten den Schlüssel des Website-Felds kennen. Nun stellt sich die Frage, wie man die Schlüssel der Kommentarformularfelder erhält.

Ich mache es, indem ich die Felder in die Dummy-Textdatei schreibe.

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));
}

Wenn Sie nun die Seite mit einem Kommentarformular neu laden, wird die Datei test.txtim Stammordner erstellt. In meinem Fall hat diese Datei folgenden Inhalt.

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>
)

Es gibt Ihnen eindeutig die Schlüssel der Formularfelder. Für das Website-Feld lautet der Schlüssel ‘url’. Daher werde ich den obigen Code wie folgt ändern, wodurch das Website-Feld aus dem Kommentarformular entfernt wird.

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;
}

Auf dieselbe Weise können Sie auch andere Felder des Kommentarformulars entfernen.

Ich hoffe, Sie verstehen, wie Sie das Kommentarformular in WordPress anpassen. Bitte teilen Sie Ihre Gedanken und Vorschläge im Kommentarbereich unten mit.

Zum Thema passende Artikel

Aufnahmequelle: artisansweb.net

Diese Website verwendet Cookies, um Ihre Erfahrung zu verbessern. Wir gehen davon aus, dass Sie damit einverstanden sind, Sie können sich jedoch abmelden, wenn Sie möchten. Annehmen Weiterlesen