Hiện Thumbnail Trong List Post

các bạn sử dụng các theme trên mạng có bao giờ bạn thấy trong phần quản lý Post có hình thumbnail đại diện ở trong đó không?

Lúc trước tôi dùng theme trên mạng tình cờ tôi thấy những tấm hình đó, sau khi mò mẫm thì đã làm được điều này. Bạn có thể làm điều đó không quá 3 phút kể từ lúc bạn đọc đến dòng này của tôi, nhưng các bạn hãy cùng tôi theo dõi đoạn code của tôi nó hoạt động như thế nào nhé.

Bạn copy tất cả các dòng code này và paste vào file function.php của bạn nhé.

Source code

// thêm cột để chứa anhrcho cả post và page
add_filter('manage_posts_columns', 'tcb_add_post_thumbnail_column', 5);
 
// hàm để thêm cột
function tcb_add_post_thumbnail_column($cols){
  $cols['tcb_post_thumb'] = __('Featured');
  return $cols;
}
 
// gọi lại hàm để tạo ảnh
add_action('manage_posts_custom_column', 'tcb_display_post_thumbnail_column', 5, 2);
 
// hàm thêm ảnh vào trong list post và list page
function tcb_display_post_thumbnail_column($col, $id){
  switch($col){
   case 'tcb_post_thumb':
      if( function_exists('the_post_thumbnail') )
       echo the_post_thumbnail( array(60,60) );
     else
       echo 'Not supported in theme';
    break;
  }
}

các bạn cop và paste xong rồi phải không? code wordpress quá đơn giản đúng không? copy và paste là tiêu chí của tôi khi chỉ cho các bạn, rồi nghiền ngẫm code sau. Quá dễ, ố ố la la…

đầu tiên tìm hiểu về hai dòng gọi hàm trên cùng nhé

Source code

add_filter('manage_posts_columns', 'tcb_add_post_thumbnail_column', 5);

nếu các bạn không biết “add_filter” là cái quái gì thì các bạn vào đây để xem nhé, cái tham số “manage_posts_columns” là tham số để thao tác trong các column trong wordpress. “tcb_add_post_thumbnail_column” là hàm thêm cột được khai báo bên dưới 2 hàm trên

Source code

function tcb_add_post_thumbnail_column($cols){
  $cols['tcb_post_thumb'] = __('Featured');
  return $cols;
}

Bạn thay chữ “Featured” bằng chữ nào mà bạn thích, như “Ảnh Đại Diện” chẳng hạn.

Đầu tiên hàm này truyền tham số “$cols” vào, tham số này của wordpress, bạn viết đúng tên tham số là được, là nới chứa các thông tin về cột, list trong post. Hàng thứ hai là khai báo thêm cột với tên là “Featued”. Bài này cũng tương tự như bài trước của tôi viết về hiển thị số lượng file đính kèm trong list post, nếu bạn chưa xem bạn có thể xem tại đây

Source code

add_action('manage_posts_custom_column', 'tcb_display_post_thumbnail_column', 5, 2);

hàm trên dùn để thực hiện hàm “tcb_display_post_thumbnail_column”

Source code

function tcb_display_post_thumbnail_column($col, $id){
  switch($col){
   case 'tcb_post_thumb':
      if( function_exists('the_post_thumbnail') )
       echo the_post_thumbnail( array(60,60) );
     else
       echo 'Not supported in theme';
    break;
  }
}

hai hàm trên dùng để tạo thumbnail với kích thước 60,60, bạn có thể thay đổi tùy thích. Đầu tiên nó sẽ lấy vào tham số “$col”, nó sẽ xử lý với cột nào mang tên là “tcb_post_thumb” ( khai báo trong hàm “tcb_display_post_thumbnail_column”).

Tiếp theo xét điều kiện xem theme này đã khai báo hàm để tạo thumbnail chưa, nếu chưa các bạn add dòng này vào file function.php luôn nhé. Nếu không khai báo hàm này thì tahy vì là các tấm ảnh thì nó sẽ hiện chữ “Not supported in theme”.

Source code

add_theme_support('post-thumbnails');

nếu những bài viết nào có thumbnail thì nó sẽ chạy dòng lệnh “the_post_thumbnail”, mấy hàm này chắc bạn quá quen thuộc nếu bạn hay code worpress.

Vậy alf xong, các bạn đọc có ngán không? có quá dài không, bạn nào đọc đến đây rồi chắc khô cổ họng luôn rồi.

Thử làm xem các bạn, rất đơn giản, copy và paste, 1 phút 30 giây thôi. Quá nhanh, quá chuẩn.

Nếu các bạn có copy bài viết của tôi hãy nhớ để link nguồn đến tôi nhé.

Bài viết có ích cho bạn thì nhấn like ở trên giúp tôi, khuyến khích tinh thần viết bài.

Tags Cloud