Dạo một vòng trong comments.php

Nguyễn Duy Nhân

13 years ago

Tôi chợt nảy ra một chủ đề mới lạ đó là giành thời gian viết một số bài viết liên quan đến một số chức năng trong theme WordPress để các bạn yêu thích WordPress có thể “nghịch” theme được dễ dàng hơn. Và khởi điểm mà tôi muốn bắt đầu với loạt tutorial này là comments.php như tôi đã ghi trên tiêu đề của bài viết. Chúng ta hãy cùng đi dạo một vòng quanh comments.php xem nó có những gì nhé :)

Phụ mục

Toggle

1. Backend – nội dung 1 file comments.php

Dưới đây xin phép trình bày với các bạn nội dung file comments.php:

[php] <?php if(!empty($_SERVER[‘SCRIPT_FILENAME’]) && ‘comments.php’ == basename($_SERVER[‘SCRIPT_FILENAME’])) : ?>
<?php endif; ?>

<?php if(!empty($post->post_password)) : ?>
<?php if($_COOKIE[‘wp-postpass_’ . COOKIEHASH] != $post->post_password) : ?>
<?php endif; ?>
<?php endif; ?>

<?php if($comments) : ?>
<?php foreach($comments as $comment) : ?>
<?php if ($comment->comment_approved == ‘0’) : ?>
<?php endif; ?>
<?php endforeach; ?>
<?php else : ?>
<?php endif; ?>

<?php if(comments_open()) : ?>
<?php if(get_option(‘comment_registration’) && !$user_ID) : ?>
<?php else : ?>
<?php if($user_ID) : ?>
<?php else : ?>
<?php endif; ?>
<?php endif; ?>
<?php else : ?>
<?php endif; ?>
[/php]

Có thể nói một cách đơn giản, cấu trúc một file comments.php trong theme được xây dựng đơn giản như trên. Các thành phần liên quan đến giao diện đã được gỡ ra cho dễ nhìn nhé mọi người.

2. Vận hành comments.php một cách an toàn

Ở phần trên NhanWeb đã liệt kê cho bạn những thành phần code chủ yếu trong comments.php. Vậy những đoạn code ấy có ý nghĩa như thế nào ? Để thực thi công việc nào ?

Dưới đây chúng ta sẽ tìm hiểu rõ hơn về nó…

Kiểm tra quyền truy cập comments.php

[php] <?php if(!empty($_SERVER[‘SCRIPT_FILENAME’]) && ‘comments.php’ == basename($_SERVER[‘SCRIPT_FILENAME’])) : ?>
<?php endif; ?>
[/php]

Đoạn mã này dùng để ngăn chặn những kẻ tò mò muốn tìm hiểu về file comments.php không đúng với qui ước ban đầu : đoạn mã này chỉ thực thi thông qua trang nội dung, không sử dụng riêng biệt. Bạn có thể hiểu nó là một trong những hình thức bảo mật nội dung file để tránh sự nhòm ngó từ bên ngoài.

Đoạn code trên có thể được thay đổi bằng một thông báo giành cho những truy cập không cần thiết hoặc bạn không mong muốn như sau:

[php] <?php if(!empty($_SERVER[‘SCRIPT_FILENAME’]) && ‘comments.php’ == basename($_SERVER[‘SCRIPT_FILENAME’])) : ?>
<?php die(‘Đi lạc rồi bạn ! Quay lại ngay!’); ?>
<?php endif; ?>
[/php]

Bạn yêu cầu một mật khẩu truy cập ?

[php] <?php if(!empty($post->post_password)) : ?>
<?php if($_COOKIE[‘wp-postpass_’ . COOKIEHASH] != $post->post_password) : ?>
<?php endif; ?>
<?php endif; ?>
[/php]

Nếu bạn yêu cầu có mật khẩu truy cập trước khi người dùng có thể xem được cac, đoạn code trên sẽ kiểm tra điều đó. Nghĩa là không có một mật khẩu thích hợp bạn sẽ không thể xem được các ý kiến của các thành viên khác.

Thẻ if đầu tiên sẽ kiểm tra xem có yêu cầu mật khẩu hay không. Thẻ if thứ 2 (nằm bên trong thẻ if đầu tiên) sẽ kiểm tra giữa mật khẩu đã tồn tại có tương ứng với mật khẩu yêu cầu hay không. Nếu không tương ứng, bạn có thể xuất ra một thông báo yêu cầu người dùng nhập mật khẩu mới có thể xem comment.

3. Hiện các comment

[php] <?php if($comments): ?>
<?php foreach ($comments as $comment) : ?>
<?php if ($comment->comment_approved == ‘0’) : ?>
<?php endif; ?>
<?php endforeach; ?>
<?php else : ?>
<?php endif; ?>
[/php]

Mã lệnh đầu tiên if($comments) sẽ kiểm tra có tồn tại $comments (dạng mảng – array) hay không ? Nếu tồn tại (nghĩa là có comment cho bài viết đó), vòng lặp foreach sẽ chạy từ đầu đến cuối mảng $comments để lấy ra các comment của bài viết. Điều kiện đưa ra cho comment là if($comment->comment_approved == ‘0’) . Nghĩa là những comment nào được approved thì sẽ hiện ra, những comment nào chưa được duyệt thì chưa không được hiện.

Dưới đây là đoạn code ví dụ đầy đủ, bạn có thể tìm thấy các đoạn code tương tự trong file comments.php của theme bạn đang dùng:

[php] <?php if($comments) : ?>
<ol>
<?php foreach($comments as $comment) : ?>
<li>
<?php if($comment->comment_approved == ‘0’) : ?>
<p>Your comment is awaiting approval</p>
<?php endif; ?>
<p>Your comment</p>
</li>
<?php endforeach; ?>
</ol>
<?php else : ?>
<p>No comments</p>
<?php endif; ?>
[/php]

Một số hàm sử dụng cho comment:

Dưới đây là một số hàm dữ liệu cần thiết mà NhanWeb nghĩa bạn sẽ phải thường xuyên sử dụng:

Template Tag	Description
<?php comment_ID(); ?>	Số ID của comment
<?php comment_author(); ?>	Tác giả comment
<?php comment_author_link(); ?>	Liên kết sẽ trỏ về trang của tác giả
<?php comment_type(); ?>	Loại comment, bao gồm: pingback, trackback hoặc 1 comment
<?php comment_text(); ?>	Nội dung comment
<?php comment_date(); ?>	Ngày comments
<?php comment_time(); ?>	Thời gian đăng lên

Áp dụng các hàm đã nói đến ở trên, chúng ta có 1 đoạn code hoàn chỉnh như sau:

[php] <?php if($comments) : ?>
<ol>
<?php foreach($comments as $comment) : ?>
<li id="comment-<?php comment_ID(); ?>">
<?php if ($comment->comment_approved == ‘0’) : ?>
<p>Your comment is awaiting approval</p>
<?php endif; ?>
<?php comment_text(); ?>
<cite><?php comment_type(); ?> by <?php comment_author_link(); ?> on <?php comment_date(); ?> at <?php comment_time(); ?></cite>
</li>
<?php endforeach; ?>
</ol>
<?php else : ?>
<p>No comments yet</p>
<?php endif; ?>
[/php]

4. Comment Form

Phần trên đã nói về vấn đề hiện các comment và giải thuật chung giành cho comment. Phần này chúng ta sẽ nói đến 1 yếu tố cũng rất quan trọng của comment: form viết bình luận.

Phần này, đối với hầu hết các bạn mới làm quen với theme WordPress sẽ cảm thấy bối rối vì cách trình bày của các theme sẽ khác nhau. Bắt nguồn từ việc các nhà thiết kế theme cố gắng đơn giản hóa theme của mình. Thế là họ chia nhỏ các thành phần ra như HTML riêng, mã lập trình PHP riêng. Và Form Comment cũng thường được để riêng phần HTML như vậy. Để tìm được bạn phải tìm kiếm khá vất vả vì đôi lúc họ nhét form comment vào một function nào đó…

Cái đó có trời mới biết :D

Trong phần này tôi cố gắng đơn giản hóa vấn đề để các bạn có thể hiểu được bản chất.

Mã lệnh điều kiện Form Comment

Bạn có thể hiểu nó là điều kiện cần và đủ để bạn suy nghĩ đến việc đưa ra một form nhập liệu cho người dùng comment.

[php]

[/php]

Điều kiện if(comments_open()) sẽ kiểm tra hệ thống comment có được cho phép hay không. Nếu comment được cho phép, bạn có thể viết tiếp 1 form comment để người dùng đưa nội dung vào. Ngược lại, bạn muốn hiện một thông báo với người dùng rằng hiện nay bạn không cho phép ai comment hết. Bạn có thể đặt đoạn mã thông báo vào giữa else và endif như sau:

[php] <?php else : ?>
<p>Xin lỗi ! Hiện nay hệ thống comment đã bị đóng lại…</p>
<?php endif; ?>
[/php]

Tiếp theo, if(get_option(‘comment_registration’) && !$user_ID) sẽ kiểm tra xem bạn có cần phải đăng ký mới có thể comment hay không và trong điều kiện đó bạn đã đăng nhập hay chưa. Nếu mã lệnh này trả về là true thì bạn có thể cho hiện 1 thông báo yêu cầu đăng nhập trước khi bình luận. Ngược lại, chúng ta thiết lập form nhập liệu. Bạn có thể tham khảo thêm đoạn code NhanWeb đã đăng ở trên để tìm hiểu rõ hơn.

Tạo Form

Sau khi đi qua phần giải thuật kiểm tra các điều kiện, cuối cùng chúng ta tạo form comment cho người dùng. Đoạn code ở trên được tôi viết lại cho hoàn chỉnh hơn như sau:

[php]

Mỗi một form sẽ bao gồm một số trường thông dụng trong form comment của WordPress như họ và tên, email, địa chỉ website… Thông thường chúng ta để những trường dữ liệu ấy cho người dùng nhập, nhưng nếu người dùng đã đăng nhập vào tài khoản của mình trước đó, chúng ta chỉ load những gì cần thiết cho người dùng nhập thôi, còn lại chúng ta hãy bỏ qua vì nó đã có sẵn trong tài khoản của họ rồi. Nên đoạn code trên tôi lại tiếp tục biến đổi tiếp…
[php]

<?php if(comments_open()) : ?>
<?php if(get_option(‘comment_registration’) && !$user_ID) : ?>
<p>You must be <a href="<?php echo get_option(‘siteurl’); ?>/wp-login.php?redirect_to=<?php echo urlencode(get_permalink()); ?>">logged in</a> to post a comment.</p><?php else : ?>
<form action="<?php echo get_option(‘siteurl’); ?>/wp-comments-post.php" method="post" id="commentform">
<?php if($user_ID) : ?>
<p>Logged in as <a href="<?php echo get_option(‘siteurl’); ?>/wp-admin/profile.php"><?php echo $user_identity; ?></a>. <a href="<?php echo get_option(‘siteurl’); ?>/wp-login.php?action=logout" title="Log out of this account">Log out »</a></p>
<?php else : ?>
<p><input type="text" name="author" id="author" value="<?php echo $comment_author; ?>" size="22" tabindex="1" />
<label for="author"><small>Name <?php if($req) echo "(required)"; ?></small></label></p>
<p><input type="text" name="email" id="email" value="<?php echo $comment_author_email; ?>" size="22" tabindex="2" />
<label for="email"><small>Mail (will not be published) <?php if($req) echo "(required)"; ?></small></label></p>
<p><input type="text" name="url" id="url" value="<?php echo $comment_author_url; ?>" size="22" tabindex="3" />
<label for="url"><small>Website</small></label></p>
<?php endif; ?>
</form>
<?php endif; ?>
<?php else : ?>
<p>The comments are closed.</p>
<?php endif; ?>
[/php]

Wow… Đến đây tôi nghĩ là chúng ta có thể hiểu hết được rồi phải không nào ! Tôi lại phải tiếp tục bổ sung phần còn thiếu 1 một comment do người dùng đăng lên. Đó là nội dung comment và một nút “Submit” để gửi dữ liệu nữa chứ nhỉ :P

[php]

<?php if(comments_open()) : ?>
<?php if(get_option(‘comment_registration’) && !$user_ID) : ?>
<p>You must be <a href="<?php echo get_option(‘siteurl’); ?>/wp-login.php?redirect_to=<?php echo urlencode(get_permalink()); ?>">logged in</a> to post a comment.</p><?php else : ?>
<form action="<?php echo get_option(‘siteurl’); ?>/wp-comments-post.php" method="post" id="commentform">
<?php if($user_ID) : ?>
<p>Logged in as <a href="<?php echo get_option(‘siteurl’); ?>/wp-admin/profile.php"><?php echo $user_identity; ?></a>. <a href="<?php echo get_option(‘siteurl’); ?>/wp-login.php?action=logout" title="Log out of this account">Log out »</a></p>
<?php else : ?>
<p><input type="text" name="author" id="author" value="<?php echo $comment_author; ?>" size="22" tabindex="1" />
<label for="author"><small>Name <?php if($req) echo "(required)"; ?></small></label></p>
<p><input type="text" name="email" id="email" value="<?php echo $comment_author_email; ?>" size="22" tabindex="2" />
<label for="email"><small>Mail (will not be published) <?php if($req) echo "(required)"; ?></small></label></p>
<p><input type="text" name="url" id="url" value="<?php echo $comment_author_url; ?>" size="22" tabindex="3" />
<label for="url"><small>Website</small></label></p>
<?php endif; ?>
<p><textarea name="comment" id="comment" cols="100%" rows="10" tabindex="4"></textarea></p>
<p><input name="submit" type="submit" id="submit" tabindex="5" value="Submit Comment" />
<input type="hidden" name="comment_post_ID" value="<?php echo $id; ?>" /></p>
<?php do_action(‘comment_form’, $post->ID); ?>
</form>
<?php endif; ?>
<?php else : ?>
<p>The comments are closed.</p>
<?php endif; ?>
[/php]

Kết quả của trải nghiệm đối với comments.php của chúng ta là đây:

Một vài mẹo vặt cho bạn

Bạn thấy nhiều blog có nhiều hơn những gì chúng ta đã có và đã nói đến ở trên ? Những chuyện đó không đến nỗi nào quá khó đến nỗi không làm được. Những tip nhỏ tôi cung cấp dưới đây sẽ giúp bạn trang trí phần comment của mình hiệu quả

Gravatars

Từ phiên bản 2.5 trở đi, Gravatar đã là 1 dịch vụ được WordPress để tâm phát triển các ứng dụng của mình. Nếu người dùng sử dụng Gravatar, đoạn code sau sẽ load các hình avatar từ thư viện này:

[php] <?php echo get_avatar($author_email, $size, $default_avatar ); ?>
[/php]

Hãy thay $author_email trong đoạn code trên bằng hàm get_comment_author_email() để lấy email tác giả, $size để bạn xác định kích thước avatar sẽ hiện và $default_avatar là đường dẫn đến avatar mặc định của bạn khi người dùng không có avatar trên Gravatar.

Bạn hãy đặt đoạn code trên trong quá trình lặp các mảng $comments mà mình đã nói ở phần trước. Kết hợp với 1 ít CSS chúng ta sẽ có danh sách comment đẹp miễn chê:

Danh sách comment của NhanWeb

Số lượng comment của 1 topic

Bạn thấy nhiều blog sau bài viết có đoạn :

5 nhận xét cho bài viết này. Đăng nhận xét của bạn

Đây là công thức của nó:

[php] <?php comments_number($zero_comments, $one_comment, $more_comments); ?>
[/php]

$zero_comments là đoạn text sẽ hiện khi không có comment nào, $one_comment là đoạn text sẽ hiện khi chỉ có 1 comment, $more_comments sẽ hiện text khi có nhiều hơn 1 comment. Ví dụ:

[php] <?php comments_number(‘No comments’, ‘One comment’, ‘% comments’); ?>
[/php]

Comment links

Để hiện thêm các comment khác, bạn sử dụng code sau:
[php] <?php comments_popup_link($zero_comments, $one_comment, $more_comments, $css_class, $comments_closed); ?>
[/php]

Cái này sẽ hữu ích khi bạn muốn hiển thị riêng comment trên 1 popup. Gắn đoạn code trên vào liên kết số lượng comment (đã có tip ở trên) là hay nhất. Tương tự như phần trước, bổ sung thêm $css_class là class được sử dụng, còn $comments_closed là thông báo nếu hệ thống comment bị đóng lại.

Ví dụ:
[php] <?php comments_popup_link(‘No comments’, ‘One comment’, ‘% comments’, ‘comments-link’, ‘Comments are closed’); ?>
[/php]

Edit comment

Cái này chắc mình không phải nói nhiều: nếu người đọc là tác giả hoặc có quyền sửa comment thì bổ sung thêm 1 nút Edit comment để họ sửa comment.
[php] <?php edit_comment_link($link_text, $before_link, $after_link); ?>
[/php]

Cái này đặt vào trong vào lặp comment và bên dưới mỗi comment nhé các tình yêu :). $link_text là text của bạn, $before_link và $after_link là text bạn muốn hiện trước và sau link này.

Màu sắc của Comment

Trình bày màu sắc 1 tí cho comment cũng hay. Hãy nhìn NhanWeb:

Danh sách comment của NhanWeb

Đây là function chúng ta cần:

[php] function alternate_rows($i){
if($i % 2) {
echo ‘ class="alt"’;
} else {
echo ”;
}
}
[/php]

Class alt ở ví dụ trên là như thế nào các bạn dùng CSS tự design nhé :)

Sau khi design xong, bạn mang function chúng ta vừa tạo ra đặt vào vòng lặp của comments như sau:

[php] <?php $i++; ?>
<li<?php alternate_rows($i); ?> id="comment-<?php comment_ID(); ?>">
[/php]

Hiện các tag cho phép người dùng sử dụng

Hiện các tag định dạng HTML mà người dùng có thể sử dụng:
[php] Cho phép các tag sau: <?php echo allowed_tags(); ?>
[/php]

Comments RSS link

Nếu bạn muốn cho phép người dùng tạo RSS từ các comment…

[php] <?php comments_rss_link($link_text); ?>
[/php]

Tổng kết

Bài viết thể loại này không phải ai cũng đọc và thực hành được. Tôi biết chỉ 1 trong số 10 bạn đọc là sẽ bắt tay tìm hiểu bài viết này sâu hơn và nghịch ngợm. Nhưng như thế cũng là đủ rồi…

Đây là 1 kiểu bài viết mới mà tôi hi vọng những bạn nào yêu thích WordPress có thể đọc và hiểu được bản chất của vấn đề cũng như hiểu về cách WordPress Comment vận hành. Biết đâu, thông qua chuỗi bài viết có liên quan đến các vấn đề này, chúng ta sẽ có 1 loạt các theme WordPress được ra đời thì sao….

Trân trọng và chúc thành công…