Personnaliser les commentaires dans WordPress - Fonctionnalité et apparence

Dans WordPress, il existe différents types de contenu tels que post, page, commentaires, etc. Ils constituent les bases de WordPress. WordPress étant une plate-forme hautement personnalisable, vous permet de personnaliser les types de base en fonction de votre site. Vous pouvez modifier l'apparence ainsi que les fonctionnalités des types de base pour les rendre conformes à l'apparence et aux fonctionnalités de votre site. Dans cet article, nous allons voir comment modifier le comportement et l'apparence des commentaires sur notre site WordPress..

Étape 1 Comprendre le comment_form Fonction et ses arguments

Regardons la fonction WordPress comment_form. Il s’agit de montrer le formulaire de commentaires qui est principalement affiché sur une seule page ou publié dans WordPress. Un appel à cette fonction sera principalement vu dans le commentaires.php fichier de votre dossier de thème. Ensuite, ce fichier serait inclus à divers endroits comme single.php, page.php, etc. directement ou en appelant le commentaires_template une fonction.

Vous pouvez trouver plus de détails sur commentaires_template dans le codex WordPress.

Si nous utilisons le comment_form fonction pour afficher le formulaire, le formulaire sera affiché en utilisant les paramètres par défaut qui seront des champs tels que nom, email (les deux sont obligatoires), site Web et le contenu du commentaire. Sur le thème par défaut de Twenty Eleven, le formulaire se présentera comme suit.

Certains des arguments importants à la comment_form fonction sont:

• des champs - Par lequel vous pouvez réellement contrôler quels champs sont affichés dans le formulaire de commentaire.
• comment_notes_before et comment_notes_after - Ils sont utilisés pour afficher une note avant ou après le formulaire de commentaire..
• title_reply - En utilisant cela, vous pouvez changer le titre de la réponse qui est par défaut "Laisser une réponse".
• label_submit - Ceci peut être utilisé pour changer le texte sur le bouton d'envoi du commentaire.

Étape 2 Personnaliser votre formulaire de commentaire à l'aide de la fonction comment_form

Personnalisons maintenant notre formulaire de commentaire en passant différents arguments à comment_form.

Si nous voulons personnaliser les champs du formulaire de commentaire, nous pouvons les transmettre au comment_form une fonction. Les champs par défaut dans le comment_form fonction sont les suivantes:

 $ fields = array ('author' => '
'. ''. __( 'Prénom' ) . ' '. ($ req? '*': ").'
',' email '=>'
'. __( 'Email' ) . ' '. ($ req? '*': ").'
',' url '=>'
'. __( 'Site Internet' ) . ''. '
',);

Donc, si nous voulons supprimer le champ de site Web, nous devons créer les champs sans le champ de site Web comme suit et le transmettre au comment_form.

 $ commenter = wp_get_current_commenter (); $ req = get_option ('require_name_email'); $ aria_req = ($ req? "aria-required =" true "": "); $ fields = array ('author' => '
'. ''. __( 'Prénom' ) . ' '. ($ req? '*': ").'
',' email '=>'
'. __( 'Email' ) . ' '. ($ req? '*': ").'
',); $ comments_args = array ('champs' => $ champs); comment_form ($ comments_args);

Maintenant, si nous allons voir le formulaire de commentaires, il apparaîtra comme suit:

En plus de cela, changeons maintenant le titre de la réponse en "Merci de nous donner ton précieux commentaire" et changeons également le titre du bouton de commentaire en "Envoyer mon commentaire"..

Voici les arguments que nous allons passer à comment_form pour y parvenir:

 $ commenter = wp_get_current_commenter (); $ req = get_option ('require_name_email'); $ aria_req = ($ req? "aria-required =" true "": "); $ fields = array ('author' => '
'. ''. __( 'Prénom' ) . ' '. ($ req? '*': ").'
',' email '=>'
'. __( 'Email' ) . ' '. ($ req? '*': ").'
',); $ comments_args = array ('fields' => $ fields, 'title_reply' => 'Donnez-nous votre précieux commentaire', 'label_submit' => 'Envoyer mon commentaire'); comment_form ($ comments_args);

Maintenant, si nous voyons le formulaire de commentaire, il se présentera comme suit:

Étape 3 Supprimer des champs du commentaire pour utiliser des crochets

Le formulaire de commentaires WordPress peut être personnalisé à l’aide de crochets et de filtres. La personnalisation à l'aide de points d'ancrage / filtres est très utile, en particulier lorsque vous personnalisez via un plugin et ne pouvez pas modifier les fichiers de thème. Le filtre pour ajouter ou supprimer des champs du formulaire de commentaires est 'comment_form_default_fields'

Supprimons maintenant le champ URL en utilisant ce filtre. Le code pour le faire, vous pouvez soit le mettre dans votre fichier de plugin si vous personnalisez via le plugin ou dans le functions.php fichier de votre thème.

Le code est comme suit:

 function remove_comment_fields ($ fields) unset ($ fields ['url']); retourne $ champs;  add_filter ('comment_form_default_fields', 'remove_comment_fields');

En cela, nous ajoutons la fonction remove_comment_fields sur le 'comment_form_default_fields'filtrer puis désélectionner le url champ pour supprimer le champ de site Web.

Étape 4 Ajouter plus de données à vos commentaires à l'aide de points d'ancrage

Nous pouvons même ajouter des champs au commentaire pour utiliser le 'comment_form_default_fields'filtre. Ajoutons maintenant le champ d'âge de l'auteur d'un commentaire à l'aide de ce filtre, puis stockons ce champ en tant que méta de commentaire et affichons-le dans le commentaire..

Nous pouvons ajouter un champ comme suit:

 fonction add_comment_fields ($ fields) $ fields ['age'] = '
'. __ ('Age'). ''. '
'; retourne $ champs;  add_filter ('comment_form_default_fields', 'add_comment_fields');

Une fois que nous avons ajouté le champ en fonction du thème que nous souhaitons peut-être styliser. Comme j'utilise le thème Twenty Eleven, je le coiffe en ajoutant Etiquette #pond .comment-form-age avec les autres styles comme #pond .comment-form-url label etc. comme suit:

 #respond .comment-form-author label, #respond .comment-form-email, #respond .comment-form-url, #respond .comment-form-age, #respond .comment-form-comment  fond: #eee; -webkit-box-shadow: 1px 2px 2px rgba (204,204,204,0,8); -moz-box-shadow: 1px 2px 2px rgba (204,204,204,0,8); boîte-ombre: 1px 2px 2px rgba (204,204,204,0,8); couleur: # 555; affichage: inline-block; taille de police: 13px; à gauche: 4px; largeur minimale: 60px; rembourrage: 4px 10px; position: relative; en haut: 40 px; z-index: 1; 

Maintenant, si nous voyons le commentaire sous forme de commentaire, le champ d’âge sera vu comme suit:

Maintenant que l'âge est stocké en tant que méta de commentaire, nous devons nous accrocher à 'commentaire_post'et enregistrez l'âge en tant que commentaire méta comme suit:

 function add_comment_meta_values ​​($ comment_id) if (isset ($ _ POST ['age'])) $ age = wp_filter_nohtml_kses ($ _ POST ['age']); add_comment_meta ($ comment_id, 'age', $ age, false);  add_action ('comment_post', 'add_comment_meta_values', 1);

Une fois la méta enregistrée, elle peut être affichée dans le commentaire comme suit:

 comment_ID, 'age', true); ?>

Étape 5 Personnalisation des commentaires pour certains types d'articles spécifiques

Il peut parfois être utile d’avoir des champs de commentaire uniquement pour des types de publication spécifiques. Modifions maintenant le code pour afficher le champ de commentaire sur l'âge uniquement s'il s'agit d'un type de publication personnalisé, comme par exemple, livre.

Le code pour avoir l'âge uniquement pour les livres type de publication personnalisé est:

 function add_comment_fields ($ fields) if (is_singular ('books')) $ fields ['age'] = '
'. __ ('Age'). ''. '
';  retourne $ champs;  add_filter ('comment_form_default_fields', 'add_comment_fields');

Donc, ici, vous ajoutez le champ uniquement s'il est de type "Livres".

Étape 6 Créer un rappel pour afficher des commentaires

La fonction wp_list_comments est utilisé pour afficher les commentaires sur un post. Vous pouvez lire sur wp_list_comments dans le codex WordPress.

wp_list_comments a un argument de 'rappeler'dans lequel vous pouvez spécifier la fonction à rappeler pour afficher le commentaire.

Dans le thème des vingt et onze ans commentaires.php vous verrez une ligne:

 wp_list_comments (array ('callback' => 'vingteleven_comment'));

Nous allons passer à ceci:

 wp_list_comments (array ('callback' => 'my_comments_callback'));

Donc la fonction my_comments_callback sera appelé pour chaque poste.

Étape 7 Styliser vos commentaires

Nous allons maintenant dénommer notre article différemment. Nous souhaitons simplement afficher le contenu de la publication et le champ d’âge que nous avons spécifiquement ajoutés. Nous changeons aussi la couleur de fond des commentaires.

Le code de la fonction 'my_comments_callback' est comme suit:

 function my_comments_callback ($ comment, $ args, $ profondeur) $ GLOBALS ['comment'] = $ comment; ?> 
> 
 
 
comment_ID, 'age', true); ?>
 
  __( 'Répondre ↓',' twentyeleven '),' profondeur '=> $ profondeur,' max_depth '=> $ args [' max_depth ']))); ?> 
 
 
  
Nous modifions également la couleur de fond comme suit:
 
 .commentlist> li.comment background: # 99ccff; bordure: 3px solide #ddd; -moz-border-radius: 3px; border-radius: 3px; marge: 0 0 1,625 um; rembourrage: 1.625em; position: relative; 
 
Maintenant, si nous voyons les commentaires, ils se présenteront comme suit:
  
 
Conclusion
 
Les commentaires jouent un rôle important dans la construction d’un site communautaire. Selon le site, les fonctionnalités des commentaires peuvent également être personnalisées. WordPress fournit un système de commentaires flexible et fournit un bon support via des fonctions permettant de changer le comportement et l'apparence des commentaires de votre site. Alors amusez-vous à personnaliser votre site WordPress!
 
Faites-nous savoir dans les commentaires ci-dessous si vous avez d'autres suggestions sur la façon de personnaliser les commentaires sur votre site WordPress.



		
			
	   
	




Code