Customize WordPress Comment Form – وحید گودینی- طراح و توسعه دهنده وب

Vahid Goudini

0 %
Vahid Goudini
Fullstack Developer
Ui/UX Designer
  • Residence:
    Tehran
  • Number:
    0353504860
  • Age:
    32
Digital Marketing
develop
Marketing
Web Design and Develop
campain plan
Marketing plan
server and security
Seo
  • Marketing strategy
  • Moderate
  • Google service
  • GIT knowledge / Api

Customize WordPress Comment Form

02 May 2022

Subscribe to my YouTube channel to watch new videos

In this article, we will discuss how to customize a WordPress comment by changing the WordPress template code. In addition, we introduce plugins to make this section more attractive.

Change comment font (WordPress comments)

To change the appearance of the submit comment button in WordPress, use the code below in your style.css file:For example, in the following code, we change the author font, email address and URL. Simply add the code to your style.css file:

Change WordPress comment font
				
					#author, #email { 
font-family: "Open Sans", "Droid Sans", Arial;
font-style:italic;
color:#1d1d1d; 
letter-spacing:.1em;
} 
#url  { 
color: #1d1d1d;
font-family: "Luicida Console", "Courier New", "Courier", monospace; 
}
				
			

سپس نتیجه به صورت شکل زیر خواهد بود

Change the font of WordPress comments

Then the result will be as follows font-family Write your font name.

Change the Submit Comment Button

To change the appearance of the comment button in WordPress, use the following code in your style.css file:

				
					#submit {
background:-moz-linear-gradient(top, #44c767 5%, #5cbf2a 100%);
background:-webkit-linear-gradient(top, #44c767 5%, #5cbf2a 100%);
background:-o-linear-gradient(top, #44c767 5%, #5cbf2a 100%);
background:-ms-linear-gradient(top, #44c767 5%, #5cbf2a 100%);
background:linear-gradient(to bottom, #44c767 5%, #5cbf2a 100%);
background-color:#44c767;
-moz-border-radius:28px;
-webkit-border-radius:28px;
border-radius:28px;
border:1px solid #18ab29;
display:inline-block;
cursor:pointer;
color:#ffffff;
font-family:Arial;
font-size:17px;
padding:16px 31px;
text-decoration:none;
text-shadow:0px 1px 0px #2f6627;
} 
#submit:hover {
background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #5cbf2a), color-stop(1, #44c767));
background:-moz-linear-gradient(top, #5cbf2a 5%, #44c767 100%);
background:-webkit-linear-gradient(top, #5cbf2a 5%, #44c767 100%);
background:-o-linear-gradient(top, #5cbf2a 5%, #44c767 100%);
background:-ms-linear-gradient(top, #5cbf2a 5%, #44c767 100%);
background:linear-gradient(to bottom, #5cbf2a 5%, #44c767 100%);
background-color:#5cbf2a; 
}
#submit:active { 
position:relative;
top:1px;
}
				
			

Then the result will be as follows

تغییر دکمه کامنت

Rename the comment button

In WordPress comments, use the following code in the functions.php file or add it to the plugin to customize the WordPress comment form:

				
					$commenter = wp_get_current_commenter();
$req = get_option( 'require_name_email' );
$aria_req = ( $req ? " aria-required='true'" : '' );
$fields =  array(
    'author' => '<p class="comment-form-author">' . '<label for="author">' . __( 'Name' ) . '</label> ' . ( $req ? '<span class="required">*</span>' : '' ) .
        '<input id="author" name="author" type="text" value="' . esc_attr( $commenter['comment_author'] ) . '" size="30"' . $aria_req . ' /></p>',
    'email'  => '<p class="comment-form-email"><label for="email">' . __( 'Email' ) . '</label> ' . ( $req ? '<span class="required">*</span>' : '' ) .
        '<input id="email" name="email" type="text" value="' . esc_attr(  $commenter['comment_author_email'] ) . '" size="30"' . $aria_req . ' /></p>',
);
$comments_args = array(
    'fields' =>  $fields,
    'label_submit' => 'Send My Comment'
);
comment_form($comments_args);
				
			

متن سفارشی خود را جایگزین عبارت Send My Comment کنید

Delete website field in WordPress comments comment

To delete the website or url field in the WordPress comments field titles, save the following code at the bottom of your function.php file.

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

Move the comment title field in WordPress

By default, after WordPress version 4.4, in the comments section, the first field is the text section, followed by the name, email and website address.

In previous versions, first the name, email and website address and then the text section. If you want to use the old template on your website, simply copy the following code into the functions.php file or plugin you use to customize your WordPress comments form:

				
					function wpb_move_comment_field_to_bottom( $fields ) {
$comment_field = $fields['comment'];
unset( $fields['comment'] );
$fields['comment'] = $comment_field;
return $fields;
}
add_filter('comment_form_fields','wpb_move_comment_field_to_bottom');
				
			

Source and other plugins

Posted in مقالاتTags:
Write a comment