On preferences page, tell user ideal profile background image dimensions


(Tobias Eigen) #1

I am uploading a new profile background image, and it works beautifully except it crops the image across the middle part of the picture instead of allowing the user to set the crop.

I’d like to be able to crop the image myself then before uploading, but am not told the dimensions discourse is looking for. It would be useful to have this information directly by the upload link.


(Johan Jatko) #2

It currently only uses background-size: cover; for cropping, so recommended is to set an image that has similar aspect ratio to the area.

I would agree to displaying a recommended size, but then a resize job should be added as well to match that. (I never figured out a good way to add it).


(Kane York) #3

What I did was I screenshotted the page, cropped the canvas, then took my background image in GIMP and dragged it around until it looked good.

Totally faked attachment so you can see how I did it:
discourse-background.xcf .txt (817.4 KB)
(It’s actually a XCF file, the .psd or .pdn for GIMP. Just rename the extension - it crashed gedit.)

The screenshot is on the layer “Cover layer”. I set a background-color in Chrome before taking the screenshot, then on pasting into GIMP, I added an alpha channel, then magic-selected the green background and Deleted it.

Then, I inserted the wallpaper on a new layer below “Cover layer”, and dragged it around until it looked good. Then I made the “Cover layer” invisible and Ctrl-Exported it as PNG, and used that as my background.


(Tobias Eigen) #4

hey @riking that seems very cumbersome, obviously. :smile:

I just noticed that the background image is used in two places and has two dimensions - one big and tall and the other very short. This makes it a bit more complicated… would it be possible to enable the user to do the cropping, as is common on other sites these days?


(elizabethk) #5

What are the dimensions? Or the aspect ratio? I’m having trouble with the image being resized and losing the aspect ratio or cropping. I’d like to create a single profile background for all the staff at our company to use with words to show they are staff and company logo on it, but it gets skewed. Any recommendations?


(Tim) #6

I’ve been searching for this answer also. I hate to revive this thread, but it’s the top result on google. The UI says 590px wide, but it doesn’t say what the height should be. The image will be stretched to fit, which is usually not desirable. The correct dimensions to fill the card are 580x309px.