Share Code Web - Chia sẻ niềm đam mê bất tận > Lập trình > Web Design > Wordpress Tips > Hướng dẫn sử dụng BFIThumb trong WordPress
Hướng dẫn sử dụng BFIThumb trong WordPress
Nguyễn Trung Hiếu
Share Code Web Company 2013

Hướng dẫn sử dụng BFIThumb trong WordPress

Timthumb từ lâu đã trở thành một script resize ảnh được ưa chuộng sử dụng trong việc thiết kế theme wordpress. Nhưng tôi vừa mới đọc được một bài viết giới thiệu về một script mới khác hỗ trợ tốt hơn Timthumb rất nhiều. Và bài viết này sẽ hướng dẫn các bạn cách sử dụng cũng như cách chuyển đổi từ Timthumb sang một script resize ảnh mới được gọi là BFIThumb.

Tại sao chúng ta sử dụng Timthumb

Trước đây, WordPress không có khả năng thực hiện thay đổi kích thước của ảnh bất kỳ, mà thay vào đó chúng ta sử dụng một thư viện thứ ba có tên là TimThumb. Và thư viện này rất dễ sử dụng, bạn không cần phải làm việc nhiều, chỉ cần truyền các tham số hợp lý vào thuộc tính src của thẻ img là xong.

Với các tính năng cơ bản của timthumb như

  • Thay đổi kích thước hình ảnh
  • Cắt một phần hình ảnh
  • Áp dụng các bộ lọc hình ảnh như ảnh màu xám, và ảnh màu
  • Bộ nhớ cache hình ảnh được tạo ra để sử dụng trong tương lai

Tại sao chúng ta lại không nên sử dụng Timthumb nữa?

Với những tính năng hay như vậy, một câu hỏi lớn được đặt ra là, tại sao chúng ta lại không nên sử dụng Timthumb trong việc crop feature image nữa?
Lý do hết sức đơn giản, đó chính là lỗi bảo mật trong Timthumb đã được phát hiện trong phiên bản 1.10. Và lỗ hổng này cho phép các đoạn mã độc có thể chèn vào server hay host của chúng ta thông qua TimThumb.
Rất nhiều website đã bị hack thông qua cách này – trong đó có một site của tôi – và nhiều người dùng sử dụng TimThumb khác. Mặc dù đã được fix trong các phiên bản sau đó, thế nhưng nhiều người dùng vẫn không được cảnh báo về lỗ hổng này để cập nhật phiên bản mới hơn, hoặc thậm chí, sau khi phát hiện lỗ hổng, thì việc vá lỗ hổng này cũng gặp rắc rối về vấn đề thời gian, bởi vì TimThumb được phát triển bởi bên thứ 3, chứ không phải cộng đồng.
Tuy nhiên, nếu như lỗ hổng bảo mật được phát hiện ra trong lõi của WordPress, thì ngay lập tức, nó sẽ có một bản vá cập nhật bảo mật rất nhanh chóng trong khi nhiều người còn chưa biết tới lỗ hổng này.

Xuất hiện vị cứu tinh mới

Thật may mắn cho chúng ta, khi phiên bản WordPress 3.5 được công bố, đi kèm với đó là giới thiệu thêm một số class mới, trong đó có WP_Image_editor. Class này chứa các hàm cơ bản cho phép xoay ảnh, cắt ảnh, thay đổi kích thước ảnh. Và bây giờ, chúng ta đã có bộ công cụ của riêng mình.
Và có lẽ tính năng tốt nhất mà class WP Image Editor mang lại là khả năng hỗ trợ cả GD và thư viện Image Magick (trong khi đó, Timthumb chỉ hỗ trợ GD). Điều đó có nghĩa rằng, theme của bạn được hỗ trợ nhiều hơn.
Và đây là một trong những cách bạn có thể sử dụng class WP_image_editor

WP Image Editor làm được gì?

Theo như thông báo của đội ngũ phát triển, thì WP Image Editor có thể giải quyết vấn đề sau:

  • Nó chỉ có thể thực hiện thay đổi kích thước, cắt xén và lưu các tập tin hình ảnh
  • Không có bộ lọc hình ảnh
  • Không có bộ nhớ cache
  • Chỉ có thể giảm kích thước hình ảnh chứ không thể tăng kích thước lên được
  • Phải yêu cầu thay đổi cả độ rộng và chiều cao của ảnh
  • Sử dụng khác với TimThumb

Vậy, sẽ thực sự là “ngon lành cành đào” nếu như chúng ta kết hợp các tính năng ưu việt của WP Image EditorTimThumb. Đây là lý do tại sao chúng ta lại đề cập đến BFIThumb ở đây.

BFIThumb là gì?

  • Sử dụng WP_Image_Editor để thực hiện thao tác hình ảnh – Sử dụng lớp WordPress này cho phép chúng ta gặp ít lỗi, vì phần lớn các quá trình này không được thực hiện bởi mã của chúng ta. Điều này có nghĩa rằng chúng ta cũng có thể cung cấp thay đổi kích thước cho cả thư viện GD và ImageMagick.
  • Sử dụng tương tự như TimThumb – vì bạn chỉ cần thay đổi các thuộc tính src của thẻ img của bạn. Con đường hình ảnh thay đổi kích cỡ của sẽ được trả lại bởi hàm. Điều này cho phép một mã dễ đọc hơn và thời gian chuyển tiếp đơn giản hơn.
  • Khả năng tương tự như TimThumb – Khả năng áp dụng các bộ lọc hình ảnh là một trong những điểm ưu việt của TimThumb.

BFIThumb làm được gì?

  • Kế thừa từ WP_Image_Editor và có nhiều chức năng hơn
  • Thực hiện resize ảnh linh hoạt hơn, cho phép thay đổi kích thước theo các chiều nhất định.
  • Có thể giảm độ rộng hình ảnh, trong khi vẫn giữ nguyên độ cao ban đầu.
  • Kế thừa các class giúp thực hiện các bộ lọc hình ảnh linh hoạt hơn như Timthumb.
  • Cache được lưu trong thư mục cập nhật của WordPress, giúp load nhanh hơn

Sử dụng BFIThumb như thế nào?

Giới thiệu mãi rồi, đi vào chủ đề chính, là sử dụng nó như thế nào?
BFIThumb đã được tạo ra để sử dụng tương tự như Timthumb. Hàm chính bạn cần quan tâm là bfi_thumb. Tương tự như TimThumb, bạn sẽ sử dụng chức năng này trong thuộc tính src của thẻ img của bạn.

Resize & Crop (cắt và thay đổi độ rộng của ảnh)

Image Filters (bộ lọc màu)

Chốt

Vậy là chúng ta đã đi qua tất tần tật về BFIThumb rồi, chắc hẳn bạn cũng đã thấy được những ưu và nhược của việc sử dụng Timthumb và lý do tại sao chúng ta nên sử dụng BFIThumb rồi nhé. Chúc website của bạn hoạt động hiệu quả và an toàn hơn với sự lựa chọn của mình.

Một số theme mà sharecodeweb.net đã share có sử dụng Timthumb. Các bạn chú ý tham khảo nhé

Related Posts

Tác giả: Nguyễn Trung Hiếu

Một blogger ... cùi bắp! Đơn giản: tôi muốn ghi lại những gì xảy ra xung quanh, cả công việc lẫn cuộc sống và chia sẻ với các bạn đọc. Nếu bạn cảm thấy bài viết có nhiều điểm không chính xác, hãy comment và chia sẻ để tôi còn được học hỏi từ những góp ý của bạn. Email: hieunt.dcn@gmail.com

http://sharecodeweb.net/?s={search_term_string}