Recommended dimensions for XenForo profile style items??

[Deleted member 13897]

I’ve been messing around in Aseprite and wanted to make some custom pieces for postbit, profile banner and signature. I know things size differently depending on the user’s browser and device settings, but are there any recommended dimensions to use for these items? So I can make something that looks sort of consistent? Or is that sort of impossible? Can you enable tiled designs for postbit then?

 

[RageBurner]

I can look into it, but I confess I haven't really messed with certain settings much.

 

[JustLooking123]

Hi Deebo!
Repeating background for Postbit is already possible.
However, due to a little bug, if you are using an uploaded background image, you should re-upload it every time you want to change its settings.

Signature is only visible on PC, and is always hidden on mobile.
(Max file size: 2 MB. Max width: 750px. Max height: 150px)

Profile Banner is the most inconsistent one.
It might appear in multiple places with different aspect ratios.
I use Waffles banner as an example:

Profile Page - PC	Profile Page - Mobile
Profile Popup - PC	Profile Popup - Mobile

You can use any aspect ratio for banner image, and test it yourself.
However, i recommend using either a square image, or a horizontally wide image.
Just try to not use too big images, neither in dimension, nor in file size.

For banners, i recommend max-dimension of 1024x1024 for square images, or 1800x500 for horizonal images.

I have created some templates for better understanding of how it would work:
For square images, a template similar to this will apply:

Please note that focal-point of image can be manually set, just like the above example in which it's moved upward instead of being at center.

For horizonal images, a template similar to this will apply:

Also, please note that these templates aren't very accurate, because many factors might change the size of image box... but it will be still close to these templates.
(I noticed this after testing these templates on my own profile)

I have also added the generic transparent version of templates in attachment.

And remember, trying to highly compress the banner image is futile, because XenForo will recompress your image anyway, so your manual compressions will be lost.

I hope this helps.

 

[Spike's iconSpike]

Hi Deebo!
Repeating background for Postbit is already possible.
However, due to a little bug, if you are using an uploaded background image, you should re-upload it every time you want to change its settings.

Signature is only visible on PC, and is always hidden on mobile.
(Max file size: 2 MB. Max width: 750px. Max height: 150px)

Profile Banner is the most inconsistent one.
It might appear in multiple places with different aspect ratios.
I use Waffles banner as an example:

Profile Page - PC View attachment 76302​	Profile Page - Mobile View attachment 76303​
Profile Popup - PC View attachment 76304​	Profile Popup - Mobile View attachment 76306​

You can use any aspect ratio for banner image, and test it yourself.
However, i recommend using either a square image, or a horizontally wide image.
Just try to not use too big images, neither in dimension, nor in file size.

For banners, i recommend max-dimension of 1024x1024 for square images, or 1800x500 for horizonal images.

I have created some templates for better understanding of how it would work:
For square images, a template similar to this will apply:
View attachment 76319
Please note that focal-point of image can be manually set, just like the above example in which it's moved upward instead of being at center.

For horizonal images, a template similar to this will apply:
View attachment 76329

Also, please note that these templates aren't very accurate, because many factors might change the size of image box... but it will be still close to these templates.
(I noticed this after testing these templates on my own profile)

I have also added the generic transparent version of templates in attachment.

And remember, trying to highly compress the banner image is futile, because XenForo will recompress your image anyway, so your manual compressions will be lost.

I hope this helps.

 

[Deleted member 13897]

THANK YOU for all the care you put into that @JustLooking123 !!! That's monumentally helpful, I'm saving these attachments!

 

[Waffles's iconWaffles]

Hi Deebo!
Repeating background for Postbit is already possible.
However, due to a little bug, if you are using an uploaded background image, you should re-upload it every time you want to change its settings.

Signature is only visible on PC, and is always hidden on mobile.
(Max file size: 2 MB. Max width: 750px. Max height: 150px)

Profile Banner is the most inconsistent one.
It might appear in multiple places with different aspect ratios.
I use Waffles banner as an example:

Profile Page - PC View attachment 76302​	Profile Page - Mobile View attachment 76303​
Profile Popup - PC View attachment 76304​	Profile Popup - Mobile View attachment 76306​

You can use any aspect ratio for banner image, and test it yourself.
However, i recommend using either a square image, or a horizontally wide image.
Just try to not use too big images, neither in dimension, nor in file size.

For banners, i recommend max-dimension of 1024x1024 for square images, or 1800x500 for horizonal images.

I have created some templates for better understanding of how it would work:
For square images, a template similar to this will apply:
View attachment 76319
Please note that focal-point of image can be manually set, just like the above example in which it's moved upward instead of being at center.

For horizonal images, a template similar to this will apply:
View attachment 76329

Also, please note that these templates aren't very accurate, because many factors might change the size of image box... but it will be still close to these templates.
(I noticed this after testing these templates on my own profile)

I have also added the generic transparent version of templates in attachment.

And remember, trying to highly compress the banner image is futile, because XenForo will recompress your image anyway, so your manual compressions will be lost.

I hope this helps.

I would give you a raise right now... If I actually paid you XD

Phenomenal work, my friend.

 

[Yousef]

Good job JL
Gonna wrap this

 

[ATenderLad]

Opening this for a second to sticky the thread, JL really put a fantastic bit of work into the response and I think it's worth having available for people at a glance.