Contents

Different size user pictures (avatars) in different pages

A while back, we need to do display different sized user pictures (avatars) in Drupal 5.x on a client site. They wanted the user picture on the user profile page to be 100x100 pixels, but be displayed only as 25x25 on blog comments.

This is fairly easily achieved by creating this function in template.php. This function creates 25x25 size images from the original 100x100, and takes an argument of size so either can be used in different places.

function phptemplate_user_picture($account, $size = '25x25') {
if (!variable_get('user_pictures', 0))  {
// Nothing to do, user pictures are not enabled
return NULL;
}
if ($account->picture && file_exists($account->picture)) {
if ($size == '100x100') {
$maxsize_icon = array('w'=>100, 'h'=>100);
$info = image_get_info($account->picture);
if ($info['height'] < $maxsize_icon['h']) {
$maxsize_icon['h'] = $info['height'];
}
if ($info['width'] < $maxsize_icon['w']) {
$maxsize_icon['w'] = $info['width'];
}
$newpicture = dirname($account->picture) . '/picture-' . $account->uid . '.' . $info['extension'];
if (!file_exists($newpicture) || (filectime($newpicture) < filectime($account->picture))) {
image_scale($account->picture, $newpicture, $maxsize_icon['w'], $maxsize_icon['h']);
}
$picture = file_create_url($newpicture);
}
else if ($size == '25x25')  {
$maxsize_tile = array('w'=>25, 'h'=>25);
$info = image_get_info($account->picture);
$newpicture = dirname($account->picture) . '/picture-small-' . $account->uid . '.' . $info['extension'];
if (!file_exists($newpicture) || (filectime($newpicture) < filectime($account->picture))) {
image_scale($account->picture, $newpicture, $newpicture, $maxsize_tile['w'], $maxsize_tile['h']);
}
$picture = file_create_url($newpicture);
}
else {
$picture = file_create_url($account->picture);
}
}
else if (variable_get('user_picture_default', '')) {
$picture = variable_get('user_picture_default', '');
}
if (isset($picture)) {
$alt = t('@user\'s picture', array('@user' => $account->name ? $account->name : variable_get('anonymous', 'Anonymous')));
$picture = theme('image', $picture, $alt, $alt, '', false);
if (!empty($account->uid) && user_access('access user profiles')) {
$picture = l($picture, "user/$account->uid", array('title' => t('View user profile.')), NULL, NULL, FALSE, TRUE);
}
return "<div class=\"avatar\">$picture</div>";
}
} 

Once you have that in the theme, you can select the small size like this:

<?php if ($picture) { print theme('user_picture', $node, '25x25'); }?> 

Or the normal size like this:

<div class="picture"><?php print theme('user_picture', $user, '100x100'); ?></div>

Now, all you need to do is select the size you want in the various places you need to display the user picture.

another way: you can do this

another way:
you can do this with css only

.comment .picture img {
max-width: 24px !important;
max-height: 24px !important;
}
/* for IE6 */
* html .comment .picture img {
width: 24px !important;
height: 24px !important;
}
/* end for IE6 */

live example you can see here: http://uadrom.com/

drupal 6?

you're doing some great stuff, this is exactly what i was looking for and have been requesting info in drupal forums... but i'm using drupal 6 now and was wondering if this would apply to drupal 6 and if no what needs to change?

thanks

Thats a big patch of code.

Thats a big patch of code. Thanks god there is imagecache for those programming-impaired.

Different pros/cons

The good thing about this approach is that no new contrib modules are needed. Only core is enough.

Imagecache is more flexible, but you require additional modules to install and configure.
--
2bits -- Drupal consulting