(EDIT: 28 oct. 2011, changed the Drupal 7 version to reflect changes in the 7.9 implementation -- updated solution should work for all versions of D7, see also this issue)
Image styles in Drupal 7 are the equivalent of Imagecache presets in Drupal 6: definitions of a namespace with one or more effects for images. For example, a "thumbnail" image might be 150 pixel-wide version of your image. These image styles are then used in views, displayed nodes, etc.
The problem is: what a "thumbnail" is for one theme might differ from what it is for another theme.
Say you are using thumbnails for image galleries. Drupal 7's default thumbnail might be good for most themes, but you are developing a theme, mytheme, which requires your images to be desaturates (have an old-school black and white look). Your site might be quite complex and use other themes on other parts of the site, and you want thumbnail to be overridden only for mytheme.
The point is: Image styles are intuitively related to the themes, not site-wide presets.
Here is my solution:
By default, a theme will use the image style definition as it normally would. For example: thumbnail.
If your theme (let's call it mytheme) is overriding thumbnail, create a new preset called thumbnail_mytheme, with your desired effects.
Now, add this code to your theme's template.php file:
<?php
/**
* Override theme_image_style().
* Use the required image style as usual, except if a special
* imagestylename_themename style exists, in which case that style
* overrides the default.
*/
function PUT_YOUR_THEME_NAME_HERE_image_style($variables) {
global $theme;
if (array_key_exists($variables['style_name'] . '_' . $theme, image_styles())) {
$variables['style_name'] = $variables['style_name'] . '_' . $theme;
}
// Starting with Drupal 7.9, the width and height attributes are
// added to the img tag. Adding the if clause to conserve
// compatibility with Drupal < 7.9
if (function_exists('image_style_transform_dimensions')) {
// Determine the dimensions of the styled image.
$dimensions = array(
'width' => $variables['width'],
'height' => $variables['height'],
);
image_style_transform_dimensions($variables['style_name'], $dimensions);
$variables['width'] = $dimensions['width'];
$variables['height'] = $dimensions['height'];
}
$variables['path'] = image_style_url($variables['style_name'], $variables['path']);
return theme('image', $variables);
}
?>Replace PUT_YOUR_THEME_NAME_HERE with your theme's machine name, clear your cache and voilà.
EDIT (15 May 2011): Version for Drupal 6:
<?php
function PUT_YOUR_THEME_NAME_HERE_imagecache($namespace, $path, $alt = '', $title = '', $attributes = null) {
global $theme;
if (count(imagecache_preset_by_name($namespace . '_' . $theme))) {
$namespace = $namespace . '_' . $theme;
}
// check is_null so people can intentionally pass an empty array of attributes to override
// the defaults completely... if
if (is_null($attributes)) {
$attributes['class'] = 'imagecache imagecache-' . $namespace;
}
$attributes = drupal_attributes($attributes);
$imagecache_url = imagecache_create_url($namespace, $path);
return '<img src="' . $imagecache_url . '" alt="' . check_plain($alt) . '" title="' . check_plain($title) . '" ' . $attributes . ' />';
}
?>
This is not bad at
This is not bad at all.
Actually we already use this method for our mobile theme. Quite neat.
I wonder if Drupal allows to
I wonder if Drupal allows to create attractive articles, with like press articles, let's say 2 images located anywhere, and some text. Said otherwise: it is possible to create a node equivalent to a mix of "img" and "p" html element. Seems basic, but I've not seen ANY true Drupal site with this. Actually Drupal page that talk about images, and how wonderful they are under Drupal, are pages without any image (or this is some kind of carousel). It seems that shows clearly a problem. I guess none exits because this is not easily done, and Drupal must allow only to create industrial non-customized content with a single image placed at a fixed location within the text (and maybe does not even allow text to wrap the image). For example can we create this (http://www.monkeydoit.com/wrap-text-images-html.php) in Drupal 7? If so is it possible to see a page like this on the net ? Thanks.
Sure it's possible; Just use
Sure it's possible; Just use full HTML as your input format, and put whatever HTML you want in there. For my clients who are not at ease with HTML, I often add a wysiwyg editor and IMCE bridge (easy to install modules), set up for security considerations, etc., then there really is no limit to what you can do.
Often, people new to Drupal find the learning curve quite steep, but you'll find tons of resources on Drupal.org's forums.
The subject of your comment is not exactly in line with the subject of the post, so I suggest you continue your search on the forums, but you'll get there!
Cheers,
Albert.
Albert, thanks. I was not
Albert, thanks. I was not aware you can use standard html tagging, I assumed wrongly you were bound to content templates, like Article, Basic Page, or customized templates. In the end I found one of the "famous sites using Drupal" (star war something) with multiple images.
I'm trying to install a wysiwyg editor. Have chosen CKEditor over the Wysiwyg module, it seems this is the most usual choice.
Put aside that the install is buggy (wrong path for the Ajax application), the latest stable version of the editor wrapper is not compatible with the latest Wysiwyg module, and the uninstall of CKEditor wrapper doesn't remove properly the outdated module...
At this point I cannot add the CKFinder extension, the install procedure is not easy to understand, and the install location is also difficult to determine (taking into account the modules/libraries confusion)...
I'm not sure I'll succeed, too bad, the editor is quite good, and allows indeed to cram pages with illustrations.
And yes, for sure, the learning curve is a hard one, specially when you think that version 7 has not yet an official documentation, six months after the release. Seems quite usual, slow, slow. But well, it's free, and amazing.
Awesome! I've been looking
Awesome!
I've been looking everywhere a solution to creating alternate image styles for a mobile theme. This also allows you to have an alternate image for teaser AND page view (mobile tools can't do this).
Many, many thanks.
Thank you so much for this.
Thank you so much for this. This seemed to be my only solution in a multi domain site sharing content across domains. You saved my life after much head banging....:)