Sử dụng BFIThumb thay thế cho TimThumb

TimThumb là một mã nguồn được nhiều người sử dụng để thay đổi kích thước hình ảnh hiển thị trên trang web của họ, tuy nhiên sau thời gian được nhiều người sử dụng thì mã nguồn này đã dính lỗi bảo mật và hiện nay thì nó không được chấp nhận trong danh sách yêu cầu tối thiểu khi code theme cho WordPress trên ThemeForest.

Bài viết này sẽ hướng dẫn cho bạn cách chuyển từ TimThumb sang sử dụng mã nguồn mới với cùng mục đích thay đổi kích thước cho hình ảnh khi hiển thị ra giao diện, mã nguồn này có tên là BFIThumb.

Tại sao mọi người sử dụng TimThumb

Trước kia thì WordPress chưa cung cấp hàm để thay đổi kích thước hình ảnh, do vậy việc sử dụng phần mềm bên thứ 3 để làm việc này là điều dĩ nhiên. TimThumb mang đến cho bạn rất nhiều tiện ích, dễ sử dụng và nó hoàn toàn miễn phí.

Thay đổi kích thước ảnh với TimThumb

Bạn không cần biết nhiều về code của nó, tất cả mọi chuyện rất đơn giản bằng cách bỏ đường link của tập tin timthumb.php vào source của hình ảnh, thêm vào một vài thông số cần thiết và bạn đã có thể thay đổi được kích thước của hình ảnh.

<img src="http://hocwp.net/blog/wp-content/themes/hocwp/timthumb.php?src=http://hocwp.net/blog/hinh-anh.jpg" alt="">

Với TimThumb bạn không những thay đổi được kích thước của hình ảnh mà còn có thể cắt hình ảnh, tạo hiệu ứng grayscale và khả năng lưu trữ cache để load hình ảnh nhanh hơn.

Tại sao không nên sử dụng TimThumb nữa

Câu hỏi được đặt ra là tại sao TimThumb có nhiều tính năng rất tốt và hữu ích như thế mà Sáu lại khuyên mọi người không nên sử dụng nó nữa. Một lý do duy nhất dẫn đến việc này đó là bảo mật. Vấn đề bảo mật của TimThumb đã được nhiều hacker khai thác, họ đã phát hiện ra lỗ hổng và hack rất nhiều trang blog do số lượng người dùng TimThumb rất lớn.

Cũng vì lý do trên mà trong danh sách WordPress Theme Submission Requirements của ThemeForest không còn chấp nhận những giao diện đã và đang tính sử dụng mã nguồn này.

Giải pháp thay thế TimThumb

Thật may mắn là kể từ phiên bản WordPress 3.5 trở về sau bạn có thể sử dụng class WP_Image_Editor để thay đổi kích thước cho hình ảnh.

// Return an implementation that extends WP_Image_Editor
$image = wp_get_image_editor( 'cool_image.jpg' );
 
if ( ! is_wp_error( $image ) ) {
    $image->resize( 400, 300, true );
    $image->save( 'new_image.jpg' );
}

Cùng mục đích này, BFIThumb được tạo ra và thay thế cho TimThumb cũng như đơn giản hóa việc sử dụng hàm thay đổi kích thước hình ảnh của WordPress. Bên dưới là một vài thông tin tiện ích của mã nguồn này.

  • Kế thừa từ class WP_Image_Editor do WordPress cung cấp.
  • Cách sử dụng đơn giản như TimThumb.
  • Hầu hết các biến đầu vào đều giống TimThumb và nó được đặt ngay vào trong thuộc tính source của hình ảnh.

Bạn có thể tham khảo cách sử dụng thông qua các hàm bên dưới, mọi thứ rất dễ dàng đúng không nào, bạn không cần phải biết nhiều về code vẫn có thể làm được việc này.

Trong đoạn code trên bạn để ý thấy hàm require_once để add mã nguồn này vào dự án của bạn, sau đó là một vài cách sử dụng cơ bản của BFIThumb, kết quả bạn sẽ nhận được hình ảnh với kích thước khác với ảnh gốc, tùy thuộc vào các giá trị đầu vào mà bạn sử dụng.

Thay đổi kích thước ảnh với BFIThumb

Kết luận

Bài viết này đã hướng dẫn cho bạn cách chuyển đồi từ TimThumb sang sử dụng mã nguồn khác giúp ích cho việc thay đổi kích thước hình ảnh trên WordPress, mã nguồn thay đổi kích thước hình ảnh mới mà Sáu muốn nói đến đó là BFIThumb.

Tải BFIThumb Trên GitHub

Bằng cách sử dụng lại hàm có sẵn của WordPress cũng như giữ nguyên các thuộc tính từ TimThumb, hy vọng mã nguồn mới này sẽ giúp mọi người trong việc thiết kế giao diện rất nhiều.

Bạn có đang sử dụng TimThumb, bạn có muốn chuyển đổi sang BFIThumb, hãy cho Sáu và mọi người cùng biết ý kiến của bạn về đề tài này nhé.

Gửi bình luận của bạn 4 bình luận

  1. Một điểm yếu của thằng này là nó ko thể lấy chính xác kích thước của ảnh khi ảnh đó có size bé hơn chỉ định. Ví dụ 1 file ảnh có kích thước là 400×400 nhưng mình cần kích thước là 500×400 thì nó ko thể làm được

  2. Chào Sáu

    Mặc dù mình đã dùng Timthumb và test thành công rồi. Nhưng mà mình vẫn chưa hiểu tầm quan trọng nó khi load website, nguyên tắc hoạt động. Không dùng Timthumb mà mình dùng css resize nó vẫn được cơ mà. Trên là ý kiến riêng của mình. Sáu có thể giải thích cho mình về timthumb không ?

    • Như bạn đã chia sẻ, thì mình có thể giải thích như thế này:
      – Khi timthumb resize lại kích thước của 1 ảnh thì kích thước của tấm ảnh sẽ thay đổi, đồng thời dụng lượng của ảnh cũng thay đổi theo Còn CSS thì dung lượng của ảnh vẫn giữ nguyên, chỉ có kích thước thay đổi thôi.
      – Trong quá trình resize thì timthumb tạo ra 1 thu mục cache, do đó nó sẽ giúp ích rất nhiều cho website của bạn khi load lại.

Gửi bình luận

Địa chỉ email của bạn sẽ được giữ bí mật. Những mục bắt buộc được đánh dấu *