Chèn Bộ Đếm Lượt Xem Vào Website WordPress

Chèn Bộ Đếm Lượt Xem Vào Website WordPress

Mục đích của việc chèn bộ đếm lượt xem vào làm gì?

Chắc hản bạn tìm đến đây thì cũng đã có mục đích của mình rồi nhỉ 😆. Sau đây mình xin đưa ra một số ưu thế khi chèn bộ đếm vào nha.

  1. Chèn bộ đếm lượt xem để giúp tác giả biết được bài viết của mình có bao nhiêu lượt xem rồi. Kiểu nhìn vô nhiều lượt xem tác giả sẽ có động lực để ra bài viết ấy mà 😂
  2. Đối với người dùng thì những bài viết có nhiều lượt xem sẽ có độ uy tín cao hơn, thu hút họ đến với website của bạn nhiều hơn. Mình tin rằng với những bài viết có nhiều lượt xem thì sẽ kích thích sự tò mò của người dùng, người ta cũng muốn xem thử có gì hay mà nhiều người xem như vậy. Đồng thời, họ sẽ góp 1 lượt xem vào đây.

Cách chèn bộ đếm lượt xem vào website wordpress

Trong bài viết này, mình sẽ hướng dẫn các bạn chèn bộ đếm lượt xem vào website wordpress của mình.

Có 2 cách:

Sử dụng plugin Post Views Counter

  1. Đầu tiên, các bạn vào cài đặt và kích hoạt plugin Post Views Counter (download).

post view counter

2. Tiếp theo, truy cập vào Settings => Post Views Counter. Tại đây, các bạn sẽ thấy giao diện thiết lập gồm 2 tab: General và Display. Trước hết là tab General, các bạn có thể thiết lập như sau.

Post Views Counter - General - hoangphucblog.com

Trong đó:

  • Post Types Count: lựa chọn loại trang mà bạn muốn hiển thị bộ đếm lượt xem.
  • Counter Mode: phương thức đếm, bằng PHP hoặc JavaScript.
  • Post Views Column: thêm cột hiển thị số lượt xem vào trong giao diện quản trị bài viết, trang.
  • Restrict Edit: giới hạn quyền thiết lập bộ đếm lượt xem (chỉ Admin mới có quyền).
  • Count Interval: Nhập thời gian giữa số lượt truy cập của một người dùng.
  • Reset Data Interval: Xóa dữ liệu lượt xem bài đăng trong một ngày cũ hơn so với chỉ định ở trên. Nhập 0nếu bạn muốn bảo vệ dữ liệu của mình bất kể tuổi của nó.
  • Flush Object Cache Interval: Tần suất để chuyển số lượt xem được lưu trong bộ nhớ cache từ bộ đệm đối tượng vào cơ sở dữ liệu. Tính năng này chỉ được sử dụng nếu bộ đệm ẩn đối tượng liên tục được phát hiện và khoảng thời gian lớn hơn 0. Khi được sử dụng, số lượt xem sẽ được thu thập và lưu trữ trong bộ đệm đối tượng thay vì cơ sở dữ liệu và sau đó sẽ được chuyển không đồng bộ vào cơ sở dữ liệu theo khoảng thời gian đã chỉ định. Lưu ý: Có thể xảy ra mất dữ liệu tiềm ẩn nếu bộ đệm đối tượng bị xóa / không khả dụng trong khoảng thời gian.
  • Exclude Visitors: loại trừ lượt xem của các đối tượng ra khỏi bộ đếm.
  • Exclude IPs: loại trừ các IP truy cập ra khỏi bộ đếm.
  • Strict counts: Bật để ngăn việc bỏ qua khoảng thời gian đếm (ví dụ: sử dụng cửa sổ trình duyệt ẩn danh hoặc bằng cách xóa cookie).
  • Deactivation: xóa toàn bộ dữ liệu khi vô hiệu hóa plugin.

Click vào nút Save Changes để lưu lại.

3. Chuyển qua tab Display. Các bạn có thể thiết lập như hình bên dưới.

Post Views Counter - Display - hoangphucblog.com

Trong đó:

  • Post Views Label: nhãn cho bộ đếm.
  • Post Type: loại bài viết mà bạn muốn hiển thị bộ đếm.
  • Page Type: loại trang mà bạn muốn hiển thị bộ đếm.
  • User Type: loại người dùng mà bạn muốn đếm số lượt xem bài viết.
  • Position: vị trí hiển thị bộ đếm. Các bạn có thể chọn ở đầu, ở cuối bài viết hoặc chèn thủ công bằng cách sử dụng shortcode post-views.
  • Display Style: phong cách hiển thị. Có thể chọn hiển thị cả icon lẫn nhãn của bộ đếm hoặc lựa chọn theo sở thích của bạn.
  • Icon Class: chọn mã icon cho bộ đếm. Bộ đếm này sử dụng font Dashicon mặc định của WordPress.

Click vào nút Save Changes để lưu lại sau khi hoàn tất.

Chèn bằng mã code không sử dụng plugin

  1. Chèn code đếm lượt xem vào cuối file function.php của theme đang sử dụng:
//CODE LAY LUOT XEM
function getPostViews($postID){
$count_key = 'post_views_count';
$count = get_post_meta($postID, $count_key, true);
if($count==''){
delete_post_meta($postID, $count_key);
add_post_meta($postID, $count_key, '0');
return "01 lượt xem";
}
return $count.' lượt xem';
}
// CODE DEM LUOT XEM
function setPostViews($postID) {
$count_key = 'post_views_count';
$count = get_post_meta($postID, $count_key, true);
if($count==''){
$count = 0;
delete_post_meta($postID, $count_key);
add_post_meta($postID, $count_key, '0');
}else{
$count++;
update_post_meta($postID, $count_key, $count);
}
}
//CODE HIEN THI SO LUOT XEM BAI VIET TRONG DASHBOARDH
add_filter('manage_posts_columns', 'posts_column_views');
add_action('manage_posts_custom_column', 'posts_custom_column_views',5,2);
function posts_column_views($defaults){
$defaults['post_views'] = __('Views');
return $defaults;
}
function posts_custom_column_views($column_name, $id){
if($column_name === 'post_views'){
echo getPostViews(get_the_ID());
}
}
?>

 2. Các bạn dán đoạn dưới đây vào trong file single.php hoặc content-single tùy vài theme của các bạn như hình bên dưới

<?php setPostViews(get_the_ID()); ?>

Vị trí chèn:  các bạn mở file single.php ra và chèn nó gần ở mấy dòng code đầu luôn, cụ thể là chèn nó bên dưới đoạn

<div id="wrap" class="clearfix">

3. Chèn đoạn code sau vào vị trí bạn muốn nó hiển thị, ở đây mình sẽ cho nó hiển thị chỗ thông tin bài viết (post info). Truy cập vào hosting -> files manager. Các bạn mở file template-tags.php (wp-content/themes/smartline-lite/inc/template-tags.php)và tìm đến đoạn Display Comments.

<span class="luot-xem">
<?php echo getPostViews(get_the_ID()); ?> </span>

4. Thêm CSS cho cái hiển thị lượt xem. Bạn nào biết CSS thì chèn nó vào trong file Style.css còn nếu không thì cứ vào phần Additional CSS và dán đoạn code sau đây xuống dưới cùng nhé !

.luot-xem:before {
content: '\f403';
margin-right: 3px;
}
span.luot-xem {
color: #0000ac;
}

Nguồn: internet, hoangphucblog.com, hocban.vn

Trả lời

Email của bạn sẽ không được hiển thị công khai.

Back To Top