Thay đổi title comment

Nghĩa là thay đổi dòng chữ phía trên cùng của danh sách comment. Ta chèn code sau vào file functions.php:

add_filter( 'genesis_title_comments', 'rayno_title_comments' );
function rayno_title_comments() {
	echo 'Có '.get_comments_number().'bình luận cho bài viết'.get_the_title().'';
}

Chú ý cách này chỉ áp dụng đối với các blog sử dụng Genesis Child theme. Đối với các theme khác bạn có thể thay đổi trong file comments.php. Chẳng hạn đối với theme twenty twelve của WordPress, bạn sẽ tìm đoạn code:

<?php
	printf( _n( 'One thought on “%2$s”', '%1$s thoughts on “%2$s”', get_comments_number(), 'twentytwelve' ),number_format_i18n( get_comments_number() ), '<span>' . get_the_title() . '</span>' );
?>

Sửa lại thành:

<?php
	echo 'Có '.get_comments_number().'bình luận cho bài viết'.get_the_title().'';
?>

Thay đổi Leave a Reply hay Speak your mind

Đây là dòng chữ các bạn thường thấy ở phía trên của form comment. Để đổi dòng chữ này, ta sẽ sử dụng code sau:

function raynoblog_comment_text($args) {
    $args['title_reply']='Gửi bình luận';
    return $args;
}
add_filter( 'comment_form_defaults', 'raynoblog_comment_text' );

Cách này có thể áp dụng cho cả Genesis childthemes và các theme thông thường.

Đổi chữ trong Submit button

Bạn có thể thay đổi chữ bên trong nút submit comment bằng cách dùng code:

add_filter( 'comment_form_defaults', 'raynoblog_change_submit_comment' );
function raynoblog_change_submit_comment( $defaults ) {
    $defaults['label_submit'] = 'Gửi bình luận';
    return $defaults;
}

Cách này có thể áp dụng cho cả Genesis childthemes và các theme thông thường.

Thiết kế lại form comment cho WordPress

Nếu bạn chưa vừa ý với thiết kế của form comment trên blog của mình, các bạn có thể tự thiết kế lại nó. Ở đây mình cung cấp cho các bạn một mẫu form mình đang sử dụng.

/*--------custom comments form------------------*/
add_filter( 'comment_form_defaults', 'rayno_comment_form_args' );
function rayno_comment_form_args($defaults) {
	global $user_identity, $id;
	$commenter = wp_get_current_commenter();
	$req       = get_option( 'require_name_email' );
	$aria_req  = ( $req ? ' aria-required="true"' : '' );
	$author = '<p class="comment-form-author">' .
	          '<input id="author" name="author" type="text" class="author" placeholder="Nhập tên của bạn" value="' . esc_attr( $commenter['comment_author'] ) . '" size="30" tabindex="1"' . $aria_req . '/>' .
	          '</p><!-- #form-section-author .form-section -->';
	$email = '<p class="comment-form-email">' .
	         '<input id="email" name="email" type="text" class="email" placeholder="Nhập email của bạn" value="' . esc_attr( $commenter['comment_author_email'] ) . '" size="30" tabindex="2"' . $aria_req . ' />' .
	         '</p><!-- #form-section-email .form-section -->';
	$url = '<p class="comment-form-url">' .
	       '<input id="url" name="url" type="text" class="url" placeholder="Nhập địa chỉ website của bạn" value="' . esc_attr( $commenter['comment_author_url'] ) . '" size="30" tabindex="3" />' .
	       '</p><!-- #form-section-url .form-section -->';

	$comment_field = '<p class="comment-form-comment">' .
	                 '<textarea id="comment" name="comment" cols="45" rows="8" class="form" tabindex="4" aria-required="true"></textarea>' .
	                 '</p><!-- #form-section-comment .form-section -->';
	$args = array(
		'fields' => array(
		'author' => $author,
		'email'  => $email,
		'url'    => $url,
		),
		'comment_field'        => $comment_field,
		'title_reply'          => __( 'Gửi bình luận', 'genesis' ),
		'comment_notes_before' => '',
		'comment_notes_after'  => '',
	);
	$args = wp_parse_args( $args, $defaults );
	return apply_filters( 'raynoblog_comment_form_args', $args, $user_identity, $id, $commenter, $req, $aria_req );
}

Bổ sung một số lớp css để cho form comment đẹp hơn.

/*custom comments form
------------------------------------------------------------ */
.author{
	background: url(http://nx5.upanh.com/b5.s29.d3/ab36e72a619b1d210ef5de5a68d30f15_56167325.name.png) no-repeat;
	padding-left:35px !important; 
	font-size: 15px !important;
	margin: 10px 0 10px;
	-moz-border-radius: 3px; 
	-webkit-border-radius: 3px; 
	border-radius: 3px;
}
.email{
	background: url(http://nx1.upanh.com/b1.s36.d1/d26bff75d0ead63137051a8c02e1a5e9_56167321.mail.png) no-repeat;
	padding-left:35px !important; 
	font-size: 15px !important;
	margin: 10px 0 10px;
	-moz-border-radius: 3px; 
	-webkit-border-radius: 3px; 
	border-radius: 3px;
}
.url{
	background: url(http://nx6.upanh.com/b4.s38.d3/74e69381eae4e5112c5e026882375842_56167326.website.png) no-repeat;
	padding-left:35px !important; 
	font-size: 15px !important;
	margin: 10px 0 10px;
	-moz-border-radius: 3px; 
	-webkit-border-radius: 3px; 
	border-radius: 3px;
}
.form{
	background: #fff;
	margin: 10px 0 10px;
	-moz-border-radius: 3px; 
	-webkit-border-radius: 3px; 
	border-radius: 3px;
}

Để thiết kế cho nút submit ta sẽ thêm vào các lớp sau (nếu đã có rồi thì tìm và chỉnh sửa lại):

#submit {
	background: #009966 !important;
	border: 1px solid #009933;
	color: #fff;
	cursor: pointer;
	font-family: 'Oswald', arial, serif !important;
	font-size: 12px !important;
	font-weight: bold !important;
	padding: 5px 7px;
	text-decoration: none;
	text-transform: uppercase;
	-moz-border-radius: 2px; 
	-webkit-border-radius: 2px; 
	border-radius: 2px;
}
#submit:hover {
	background: #009933 !important;
	border: 1px solid #009966;
	color: #fff;
	text-decoration: none;
	text-transform: uppercase;
}

Thay đổi kích thước avatar trong comment

Chú ý cách này chỉ áp dụng cho Genesis childthemes. Ta sử dụng code sau chèn vào file functions.php:

add_filter( 'genesis_comment_list_args', 'rayno_comment_avatar_args' );
function rayno_comment_avatar_args( $args ) {
    $args['avatar_size'] = 60;
	return $args;
}

Bổ sung vào file style.css (nếu đã có rồi thì tìm và sửa lại):

.comment-list li .avatar { 
	height: 60px;
	width: 60px;
}

Đối với các themes khác, ta có thể tìm trong file comment.php hoặc trong file functions.php. Ví dụ đối với theme twenty twelve của WordPress, ta sẽ tìm trong file functions.php đoạn code:

echo get_avatar( $comment, 44 );

Số 44 là kích thước của avatar, bạn có thể thay đổi nó. Với các themes khác bạn có thể làm tương tự.

Trên đây là một số chỉnh sửa cho khu vực comment mà mình đã làm. Hy vọng sẽ giúp ích được cho các bạn. Chúc các bạn thành công! {c1}

The post Tùy chỉnh comments trong WordPress appeared first on Raynoblog.