I'm wondering if anybody has ever tried to do this on Bigfeature? Basically it allows the timthumb thumbnails to be put in a CDN.
http://blog.gingerlime.com/thumbs-up
I'd also be interested to see what vfxdude thinks about this.
Caching timthumb with Apache rewrite rule
(22 posts) (3 voices)-
vfxdude
adminyou can already do that (add a cdn url to the image/thumbnail url field below the editor), but they will not be resized by timthumb though. Another way is to allow timthumb to grab the large images from cdn for resizing, but then the thumbs will be cached locally, but the original images will be cdn stored.
Posted 8 months ago # -
Yes I think the goal is to make timthumb cacheable on CDN.
Maybe this will help?
Posted 4 months ago # -
vfxdude
adminthat last solution is to store the resized images in another folder than the cache on the server to use htaccess to instead of php to get the thumbnails. Minimal performance gain, since the thumbs are cached anyway, and php is running in mod php (already in memory).
The ideal would be to automatically cache the thumbnails to cdn. None of the scripts are doing this. Fetching the images from cdn to be cached on the webhost server is slower than getting the images locally, so that is not a good solution either.
The resized images can be manually moved to cdn, so that is probably the method used for the first solution. Very unflexible. Maybe there's an method to automatically move the cache to cdn?
Posted 4 months ago # -
Well if the resized images are stored on another folder, then we can point our CDN plug ins to get everything on that folder to be copied to the CDN, can we?
-edit-
Yes, I am using WP super cache and we can tell it to include a specific directory to a CDN. I think W3TC also has this setting.Posted 4 months ago # -
vfxdude
adminah ok then it makes sense, if the caching plugins can cache to cdn. It's explained at the bottom of this article that this can also be done with W3TC.
Posted 4 months ago # -
Thanks, but I don't think the solution posted there works. I've tried it and it doesn't work. Likewise other people posted on the comments section saying it doesn't work.
The easiest way I have found to move your images onto a pull server is using W3 Total Cache. Below is how I configured W3 Total Cache so that it would work with TimThumb.
Download, install and enable the W3 Total Cache Plugin
On the plugins General Settings page scroll down to 'Content Delivery Network' settings and then select from the Origin Pull section, either Mirror, or Mirror: NetDNA/ MaxCDN, then hit save.
Go to the Content Delivery Network Settings page, scroll down to the Advanced Settings section, and then add *timthumb.php to the Theme file types to upload: field, and hit save.Posted 4 months ago # -
Hi,
I've used this solution (the .htaccess rule solution): http://blog.gingerlime.com/thumbs-up/ and I got things working except for the part where I need to alter the theme template to look for the thumbnail files to a different location. Do you know which template file to edit?All it took was a fairly simple Apache rewrite rule. I don’t really like rewrite rules and however many times I try to figure it out, I always get confused and decide to abandon it. This time it was simple enough even for me to work it out.
1
2
3
4
5
6
7<IfModule mod_rewrite.c>
RewriteEngine On
RewriteBase /
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteRule ^cdn-thumb/(.*)$ /relative/path/to/thumb.php?$1 [L]
</IfModule>Place this inside any folder along the wordpress path. Then change from thumb.php?src=… to cdn-thumb/src= in your templates
-edit-
Got it. It's the theme-functions.phpPlease let me know if I'm using the wrong file for this.
Thanks.
Posted 4 months ago # -
vfxdude
adminThe main function for getting timthumb url's is get_image in theme-functions.php, but there are some other places this function is not used (shortcodes for example). The best solution would be to add a filter for all the timthumb url's to be able to modify the url in a child theme. I'm working on a new version now and I'll add this to the todo list.
Posted 4 months ago # -
Thanks.
Finally got the timthumb on to a CDN. It wasn't that difficult too now that I've figured things out.
Again if anybody else is interested this is the method I use:
http://blog.gingerlime.com/thumbs-up/comment-page-1/#comment-18856It'll be nice to have this feature for the new version. :)
Thanks for the support!
Posted 4 months ago # -
Okay step by step:
1. Edit the .htaccess file on your root folder.
You go to your root wordpress folder, and edit the .htaccess file to include this line:
<IfModule mod_rewrite.c>
RewriteEngine On
RewriteBase /
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteRule ^cdn-thumb/(.*)$ wp-content/themes/bigfeature/library/timthumb/timthumb.php?$1 [L]
</IfModule>On this line: RewriteRule ^cdn-thumb/(.*)$ wp-content/themes/bigfeature/library/timthumb
make sure that you change the address to the proper bigfeature/library/timthumb folder address.2. Save the .htaccess file and upload it to your webserver.
3. Now you should be able to access the new timthumb files on the following address:
http://www.yoururl.com/cdn-thumb/src=/.. If not then you need to troubleshoot to make sure that your timthumb can be accessed on that cdn-thumb/src=/.. address.4. Next step is to edit the theme-functions.php on Bigfeature so it'll load up thumbnails from the new cdn-thumb/src=/ location instead of the old timthumb/timthumb.php? address.
Go to bigfeature/library/functions/theme-functions.php, locate three lines where it says: "timthumb/timthumb.php?" (use Apple+F or Ctrl+F on your text editor) and change it to the appropriate address of the "cdn-thumb/src=/.."
On my installation the new address is ../../../../cdn-thumb/src= instead of timthumb/timthumb.php?
At this moment you want to make sure that the theme is edited properly so turn off that CDN from W3TC or WP Super Cache, clear cache, and reload and see if all the thumbs come out properly. If yes, proceed to next step.
5. By now you already have those thumbnails saved and cached, so the webserver won't need to make a new php request everytime a page loads. The next step is to move those cached thumbnails into the CDN.
This step is the easiest. I was using rackspace CDN and they don't support origin pull. You need a CDN that support origin pull, otherwise it won't work because the cdn-thumbs folder is not really a real folder. So I went and create a new Amazon Cloudfront CDN (it's a 5 minutes process).
With Amazon Cloudfront, all I need to do is create a new distribution on Cloudfront. Don't use an S3 origin, instead use a custom origin, and type in your website address (aka "Origin DNS name"). Finish creating the new distribution, get the domain name of your new distribution, and enter that domain name into W3TC or WP Super Cache's CDN Domain name.
Since you're telling the Cloudfront to get stuff automatically from your website, there is no need to tell W3TC or WP Super Cache to upload anything to the CDN. Everything will happen automatically. Everytime a visitor comes and a file is needed, Cloudfront will pull that file automatically from your webserver. So this is all very easy.
Everything should work properly now. Timthumbs loaded directly from the CDN.
Again this is the method I use and if you want to do more reading feel free to visit the link:
http://blog.gingerlime.com/thumbs-up/comment-page-1/#comment-18856Posted 4 months ago # -
Nice tutorial.
However, I am having issues with is.
This, is working:
domain.com/wp-content/themes/bigfeature/library/timthumb/timthumb.php?src=/wp-content/uploads/2012/01/dumnezeu-acreat.jpg&w=593
this, is not:
domain.com/cdn-thumb/src=/wp-content/uploads/2012/01/moda.jpg&w=577
not working, returned me the default wordpress 404 page.
My .htaccess is looking like this:
<IfModule mod_rewrite.c>
RewriteEngine On
RewriteBase /
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteRule ^cdn-thumb/(.*)$ /wp-content/themes/bigfeature/library/timthumb/timthumb.php?$1 [L]
</IfModule>Then, i also tried moving timthumb into the root directory and tested like:
domain.com/timthumb.php?src=/wp-content/uploads/2012/01/dumnezeu-acreat.jpg&w=593
asked me to create the cache folder, created it and 777-ed it.
It worked.
Then I changed the .htaccess lines to:
<IfModule mod_rewrite.c>
RewriteEngine On
RewriteBase /
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteRule ^cdn-thumb/(.*)$ /timthumb.php?$1 [L]
</IfModule>and accessed the url:
domain.com/cdn-thumb/src=/wp-content/uploads/2012/01/moda.jpg&w=577
not working, returned me the default wordpress 404 page.
Any help please?
Posted 4 months ago # -
yes, I did, thanks.
Posted 4 months ago #
Reply
You must log in to post.