XF 1.2 Changing avatar dimensions

Crimson

Active member
Hi guys. I want to change the avatar dimensions on my forum to 150x300 (or 150x200). How do I go about changing that? :)
 
It's hard-coded. Guide:

http://xenforo.com/community/threads/which-style-property.31695/#post-363047

Changing the default sizes will not retroactively rebuild the resized versions of avatars, and I am not aware of any tool for this.

I suggest leaving the defaults alone. You can work with the existing "large" avatars. The "large" avatar images are original (not resized), and you can apply custom CSS to them to present them in any size you want. Example:

http://xenforo.com/community/resources/avatars-big-tall.1741/
 
It's hard-coded. Guide:

http://xenforo.com/community/threads/which-style-property.31695/#post-363047

Changing the default sizes will not retroactively rebuild the resized versions of avatars, and I am not aware of any tool for this.

I suggest leaving the defaults alone. You can work with the existing "large" avatars. The "large" avatar images are original (not resized), and you can apply custom CSS to them to present them in any size you want. Example:

http://xenforo.com/community/resources/avatars-big-tall.1741/
Thanks, Jake!

But, the image also stretches. Is there a way to avoid that? :)
 
Can you show me the problem?

Stretching is probably the result of forcing dimensions on the image. This example avoids that problem by setting a fixed width with an 'auto' height:

http://xenforo.com/community/resources/avatars-big-tall.1741/
The images are LQ right now but when I change the dimensions to 150 width and 300 height, the images stretch.

http://cineforums.net/threads/how-did-you-find-us.59/

It's currently in the same settings as said in your resource. :)
 
The images are LQ right now but when I change the dimensions to 150 width and 300 height, the images stretch.

http://cineforums.net/threads/how-did-you-find-us.59/

It's currently in the same settings as said in your resource. :)

You are still using the 'medium' size avatars. That means you didn't make the change to message_user_info like in that example. 'Medium' avatars are 96x96 native and will "stretch" if you use CSS to make them bigger. "Large" avatars are up to 192x192 native so you have more resolution to work with (assuming the original image is at least that big to begin with).
 
I'm having a similar problem. We changed it to "L," but if we upload an image that is bigger than the custom avatar size, it squishes it down and completely destroys the constrained proportions.

Is there any way to stop this from happening? Even in vBulletin it keeps the images constrained when making them smaller to fit the avatar window. It also seems like the "custom crop" doesn't work in this state either since it doesn't expand to fit the new avatar size.
 
I'm having a similar problem. We changed it to "L," but if we upload an image that is bigger than the custom avatar size, it squishes it down and completely destroys the constrained proportions.

Is there any way to stop this from happening? Even in vBulletin it keeps the images constrained when making them smaller to fit the avatar window. It also seems like the "custom crop" doesn't work in this state either since it doesn't expand to fit the new avatar size.
You have to add the following to EXTRA.css

[Admin CP > Appearance > Templates > EXTRA.css]

Code:
.thread_view .messageList .messageUserInfo a.avatar img,
.thread_view .quickReply .messageUserInfo a.avatar img,
.conversation_view .messageList .messageUserInfo a.avatar img,
.conversation_view .quickReply .messageUserInfo a.avatar img
{
    width: 142px;
    height: auto;
}

.messageUserInfo
{
    width: 170px !important;
}

.message .messageInfo,
#QuickReply
{
    margin-left: 186px !important;
}
 
Dino,

I'm going to give this a go and see if that helps. Will this help with the constrained proportions as well? Does it correct the custom crop option when uploading an avatar?

Thanks a bunch! I'll let you know if this helps!
 
Hey Dino -- this is what my CSS guy just told me... Any idea on this?

"Yeah, got it set up. Only problem is height which can be anything unless I restrict it but then anything bigger it'll deform it."

Any way to prevent it from deforming?
 
If any of your custom widths or heights are above 192px then you're going to be deforming the images -- 192 by 192 is the maximum size that Xenforo stores avatars. You can change this by editing avatar.php (forgot the exact path to the file).
 
@mistypants That's not true because we set the dimensions to 130x170 and the deformation was still taking place on anything larger than 170. Unless you mean something else and I'm not understanding.
Are you specifying these dimensions through CSS? If so, are you using an explicit width and height (e.g. all avatars are stretched to 130 by 170)? What I do is specify 200px as the max width, then set the height to auto. That way, smaller avatars are not stretched and larger ones keep their aspect ratio.
 
No, we're not. If an avatar is smaller than 130x170, it keeps its ratio and just makes the avatar box fit that avatar size, but if we go beyond the 130x170, it squishes it into the box... We tried to do the auto-height, but then if someone upload an avatar that is 500 pixels high, it allows for a towering avatar and that's kind of the opposite of what we want.
 
No, we're not. If an avatar is smaller than 130x170, it keeps its ratio and just makes the avatar box fit that avatar size, but if we go beyond the 130x170, it squishes it into the box... We tried to do the auto-height, but then if someone upload an avatar that is 500 pixels high, it allows for a towering avatar and that's kind of the opposite of what we want.
Could you link to a page with the problem? That way I can inspect. But to my knowledge, even if someone uploaded an image that was 500px in height, its maximum would still be 192px because that's the l avatar size in Xenforo. You could also just specify a maximum height.
 
Code:
.thread_view .messageList .messageUserInfo a.avatar img, .thread_view .quickReply .messageUserInfo a.avatar img, .conversation_view .messageList .messageUserInfo a.avatar img, .conversation_view .quickReply .messageUserInfo a.avatar img {
height: auto;
max-width: 130px !important; }
Pretty sure that's all you need. It's not necessary to specify a maximum height because you're displaying the 'l' sized avatar, which will never exceed 192px (though XenForo still stores a larger version).
 
Top Bottom