Images stretched in desktop and tiled in mobile app



There are two behaviours that I would like to change.
When we migrated from vBulletin, our users images were imported as small images and display fine in the circle avatar but the images stretch to fill in the user profile banner image so it appears very pixelated and I would rather to show a standard coloured background maybe, or nothing, anything better than a bad image.

Also, in the mobile application, the image is tiled instead of stretched.

Any ideas on how to change these?


Importing from vBulletin 4

Could you please provide some screens?

(Chris Croome) #3

This is how my profile looks in Chromium on my Android phone:

And this is how it looks in Firefox Developer Edition on my desktop:

I used an unsuitable images on purpose to illustrate the issue – user accounts that have been imported from vBulletin appear to have small square background images.

(Stephen Chung) #4

You are setting your user image as the banner as well. Remove it from the banner. Keep it just as the avatar.

(Chris Croome) #5

@schungx indeed, I’m well aware that the image I set as a background is inappropriate and doesn’t work as a background image — this was done intentionally in order to illustrate the issue the first poster in this thread raised — when you import data from vBulletin, one result is that small square, imported images end up populating the background image field and these are then distorted.

Since it would be inappropriate to post a screenshot from the data in question (I’m working with @testingsoftware on this project) I used my avatar image to illustrate the issue since @MakaryGo asked for some screenshots.


Many of our users have different pictures for background as avatars but as @chrisc chrisc says, the background image is small and stretches to fill the bg area. Maybe could be left to show the original image size?

(Régis Hanol) #7

Why don’t you remove the profile background images for all your users?

(Chris Croome) #8

That has been considered but some of the 15k users might want to keep them — it is possible that they don’t have copied of the images.

(Régis Hanol) #9

You could remove the link (ie. clear the “profile_background” column) but the uploaded images will still be in the uploads table. (At least, until the CleanUpUploads job runs, after which the image might be moved to the tombstone)

(Chris Croome) #10

Thanks @zogstrip if the client asks for the backgrounds to be removed I was going to look into directly editing the Postgres database in order to do exactly that.

I haven’t come across “the tombstone” — would there be a way for an admin (or sysadmin with cli access) to find a image that was once a background for a users profile there? What form does it take?

(Jay Pfaffman) #11

Are you saying that all Avatars also are also imported as the background image?

That sounds like a bug in the importer. If the problem is that vbulletin tiles background images rather than scanning them that seems more complicated to fix, but I suppose the importer could check the size and then do something different.

(Stephen Chung) #12

You know, you can probably fix this with custom CSS…

(Chris Croome) #13

No, the avatar and background images are different and I’m afraid that the original vBulletin server is offline so I can’t check how exactly the images were being used on that server.

(Chris Croome) #14

Would you happen to know what the rails c or Postgres command do do that would be?

(Jay Pfaffman) #15

This isn’t the most efficient, but I think it’ll work. Backup before trying. . .

User.all.each do |u|
  u.user_profile.profile_background = nil!

(Chris Croome) #16

I just ran that on a test server and it appears that the background is still there on the account I checked, could there be some caching or something here?

(Jay Pfaffman) #17

Could be caching. But first you can check some user profiles to see if the backgrounds got cleared.

(Chris Croome) #18

I’m afraid the backgrounds are unchanged after running that command.

(Jay Pfaffman) #19

Perhaps add a! before the end?

(Chris Croome) #20

Cheers, that did the job!