Using imagecache with multiple themes (dynamic imagecache preset generation)

mrfelton's picture

How can you make imagecache play nicely with a site that supports multiple themes?

An imagecache preset typically includes a 'scale and crop' action to resize an image so that it fits nicely in the site's theme. Often, the themes custom node templates will reference imagecache pesets by name.

So, if you wanted your site to support 2 quite different themes, where the images need to be displayed at different sizes depending on the themes, what would be the best / most appropriate way of doing this?

As far as I can see, the options are:

1) Define 2 copies of each style (where the name of the style is prefixed with the name of the theme so it's easy to identify which preset goes with which theme). So you might have theme1_thumbnail and theme2_thumbnail. Then, the theme can use the appropriate one in it's templates (theme('imagescache', 'theme1_thumbnail' ...). Whilst this is easy to do it just feels wrong to load up the database with theme specific Imagecache presets.

2) Create the imagecache presets on the fly in the theme layer somewhere - but I'm not sure if this is possible or how you would do it. Also, it feels a bit overkill and again, like the wrong approach.

3) Override the imagecache presets in you're template.php file for each theme - this seems like it would be a good approach, but again I have no idea if it's possible of how you would do it. Does Imagecache provide any kind of preprocess function to allow for this?

Any ideas or other suggestions?!

ps. I did just post this as a support request in the ImageCache queue ( but I though that the people in this group might have some insights, and that if I do get an answer be it from here or from the other issue, this seems like a good place to have it kept for reference!


I'm very interested too, so

etion's picture

I'm very interested too, so im playing with custom actions and global variables, but i dont know if its the best way to do it. So if you figure out how to do it, tell me please.

I would do it at the theming

jcisio's picture

I would do it at the theming layer. Use hook_preprocess_page you can get the $content variable, a simple preg_replace (or even str_replace) to change the preset and it's done!

I've done something like that in my mobile theme.

jcisio, can you elaborate how

troybthompson's picture

jcisio, can you elaborate how to do that specifically? I want to do the same thing to make smaller images for my mobile theme.

What I actually do in my

jcisio's picture

What I actually do in my mobile theme:

  • In the preprocess_page hook I use this:

    function mobile_preprocess_page(&$vars) {
      // ...
      // ...
  • Then in the optimize function:

    function _mobile_optimize_content(&$text) {
      $file_url = variable_get('static_url', $GLOBALS['base_url']) .'/files';

      // first, use correct url
      $text = str_replace($file_url .'/imagecache/small', $file_url .'/imagecache/mobile', $text);
      $text = str_replace($file_url .'/imagecache/med', $file_url .'/imagecache/small', $text);
      $text = str_replace('', '/', $text);

      // ...

So, in the mobile theme, I use "mobile" preset instead of "small", and "small" instead of "med". Real example:
- Normal
- Mobile


EugenMayer's picture

Actually the usecase of this is very interesting. Lets say a mobile-theme where you do a "50%" smaller size of all presets etc.
You will need a imageache feature request for imageache to implement this properly.

Adding new presets for every theme will not work out, it will be a mess. Because you will somehow need to adjust all implementation of imagecache like imagefile .. lightbox etc to use the "themeX" presets.

The only practical way is to add a new key to presets "namespace" or "theme", where we have a special keyword "default" what actually means "take me, if no other namespace defined". If you create a style you will be able to select (multiple) themes this preset is valid in. Actually the way presets stored must be changed then, into:


That way you dont need to change any implementations (like mentioned before), but imagecache will have an option "repsect namespace" and will chose $presets[$current_theme][$wanted_preset] or, if not present, $preset['default'][$wanted_preset'] in the default case.

As this will need some work and changes the backend i very much doubt that this every happens in imagecache... actually there rather not happens anything.