Drupal 7 Nginx.conf Fix For Missing Images Styles

What Are Image Styles

If you’re not yet familiar with the Image Styles system here is the closest thing I could find to official Documentation: Drupal 7 Image Styles

This video tutorial also might be more useful:

Image Styles Video Tutorial From Lynda.Com

In Drupal 6 you had to use a combo of CCK, FileField, ImageField, ImageCache and possibly a few other modules depending on your needs to create an image field. Now Image Styles and the new Field API take care of all of this.

Image Styles In Nginx

If you plan to upload Image files in your Drupal 7 install in a Nginx environment you’ll need a fix in your nginx.conf file for everything to work. Otherwise you’ll only have access to the originally uploaded photo.

Uploading an image works fine using Drupal 7 in Nginx but unless you know to look for the thumbnail to appear beside it after upload, you may run into confusion later on. When you go to use the image_style_url() function for example. Notice after you upload an image a little ajax call should trigger which generates your image and puts it in place shortly after you submit it. It should look something like this:

Image Styles is working here!

To get this to work properly like shown above, add the following to your /etc/nginx/nginx.conf file.

location ~* files/styles {
    access_log off;
    expires 30d;
    try_files $uri @rewrite;
}
location @rewrite {
    rewrite ^ /index.php last;
}

(Thanks to Perusio for this! http://groups.drupal.org/node/124514)

If you don’t, then it will end up looking like this:

Image Style was not auto generated here

Nginx Configuration Resources

From what I can tell, neither of these resources had the change mentioned above in them. Remember to add it in.

• The suggested configuration on a Drupal.Org support thread lists the basics for Drupal 5 http://drupal.org/node/110224
• The Drupal 7 configuration noted at http://drupal.org/node/1030854 -> http://qa.celogeek.com/freebsd/install/drupal7/overview.

If there are any additional reasources I might have missed, please post in the comments.

Also, as a general resource for those who are running Nginx, Drupal.Org Nginx Group is incredibly useful for finding other great tweaks.