350 posts Gambit
  • Has been part of the Envato Community for over 4 years
  • Has referred 10+ members
  • Has sold $75,000+ on Envato Market and is now an Elite Author
  • Has collected 100+ items on Envato Market
+4 more
bfintal says

Hey guys,

short story: rejected theme because of timthumb. I need to release the theme soon so I needed an alternative for timthumb that 1) allowed in TF, 2) used WP’s Image Editor classes, 3) can perform the timthumb functions I needed: grayscale, colorize/tint, and 4) can perform changing opacity of an image.

Aqua Resizer is awesome but I needed additional functionality. So, feeling inspired by Aqua, I created bfi_thumb. Some info below:

Bfi_thumb resizes image on the fly using WordPress’ Image Editor classes, thus supports both Imagick and GD and switches automatically depending on what’s available. The default Image Editors only have a handful of basic functions (crop, resize, rotate, etc), bfi_thumb also extends these classes to include these new functions: Grayscale, Color (colorize), Opacity. Bfi_thumb stores previously created images in WP’s default uploads directory, and uses those for future calls. The script automatically checks for updates on the original image then re-creates new images when needed. Any image can be used as long it is in your WordPress instance.

I felt that other people might need this too.. so I made the code open and put it in Github under the GPL 3 license.

Get it here: https://github.com/bfintal/bfi_thumb

3556 posts Ruben Bristian
  • Sells items exclusively on Envato Market
  • Elite Author: Sold more than $75,000 on Envato Market
  • Has sold $500,000+ on Envato Market
  • Has been part of the Envato Community for over 6 years
+10 more
KrownThemes says

While i understand grayscale & colorize options, i don’t understand the opacity.. Couldn’t you just use css for this?

350 posts Gambit
  • Has been part of the Envato Community for over 4 years
  • Has referred 10+ members
  • Has sold $75,000+ on Envato Market and is now an Elite Author
  • Has collected 100+ items on Envato Market
+4 more
bfintal says

Yup in most cases, but in my case I’m using it on a body background pattern. The pattern is grayscale then the body also has a background-color. So to avoid any additional unwanted divs, I change the opacity of the pattern so that it’ll colorize the pattern. e.g. http://themes.mas.gambit.ph

Now that I think about it I can do it by colorizing the pattern instead. But I already finished the theme :/

350 posts Gambit
  • Has been part of the Envato Community for over 4 years
  • Has referred 10+ members
  • Has sold $75,000+ on Envato Market and is now an Elite Author
  • Has collected 100+ items on Envato Market
+4 more
bfintal says

Just added negate to the capabilities list

316 posts
  • Has referred 10+ members
  • Has sold $10,000+ on Envato Market
  • Has collected 10+ items on Envato Market
  • Has been part of the Envato Community for over 3 years
+2 more
SyamilMJ says

Looks awesome mate, great job!

350 posts Gambit
  • Has been part of the Envato Community for over 4 years
  • Has referred 10+ members
  • Has sold $75,000+ on Envato Market and is now an Elite Author
  • Has collected 100+ items on Envato Market
+4 more
bfintal says

Thanks for making Aqua Resizer also, a snippet of code in BFI Thumb was from that :) btw, added scaling up of images

200 posts
  • Has referred 200+ members
  • Has sold $500,000+ on Envato Market
  • Has collected 50+ items on Envato Market
  • Attended one of our Meetups around the world
+4 more
themeva says

Hi,

Nice script, congrats – I’ve been looking for a timthumb alternative. Question: How does the crop function work, it doesn’t seem to have any affect?

350 posts Gambit
  • Has been part of the Envato Community for over 4 years
  • Has referred 10+ members
  • Has sold $75,000+ on Envato Market and is now an Elite Author
  • Has collected 100+ items on Envato Market
+4 more
bfintal says

Previously, you’d have to add ‘crop’ => true to the parameters, since that was how WP’s image editor classes did it.

I recently updated the script in Github to make cropping automatic depending on what dimensions you resize your image. Currently, if the aspect ratio of the dimensions you use doesn’t match the original one, it’ll resize then crop it similar to how timthumb does it.

Made a proper page for it: http://bfintal.github.com/bfi_thumb/ :)

200 posts
  • Has referred 200+ members
  • Has sold $500,000+ on Envato Market
  • Has collected 50+ items on Envato Market
  • Attended one of our Meetups around the world
+4 more
themeva says

Thanks for this, it’s working nicely! I wondering if you’re going to implement image quality / compression? :)

350 posts Gambit
  • Has been part of the Envato Community for over 4 years
  • Has referred 10+ members
  • Has sold $75,000+ on Envato Market and is now an Elite Author
  • Has collected 100+ items on Envato Market
+4 more
bfintal says

Just an update on this. It’s now released as v1.2.

It can now be used in themes and plugins without any worry about conflicts!

I also wrote an article in WPTuts+ about bfi_thumb http://wp.tutsplus.com/tutorials/theme-development/moving-away-from-timthumb-to-bfithumb/

by
by
by
by
by
by