Uploading a picture

bentomsouthgate · 2020-08-28T12:27:03.460Z

Hi everyone, when I upload a picture to be a background of my landing page, it is putting a white background in the image space around the object I am trying to upload. the picture does not have a background is just a rocket I created in Adobe Illustrator. How can I upload the image so just the object appears with no background color? thanks ben

johnny · 2020-08-28T17:33:27.748Z

Hey @bentomsouthgate, can you send a screenshot of your issue via the editor?

bentomsouthgate · 2020-08-28T18:49:40.536Z

Hi johnny, cheers for the reply.

Yes so as you can see in the screenshot attached, I have uploaded a picture of a rocket to my Bubble app. In Adobe Illustrator this image does not have a white background (as seen in this pic). The white background in this pic is subsequently blocking out things behind it.

I have additionally uploaded a screenshot of the same picture uploaded in powerpoint. In this picture you can see there is no white background to the picture and only the spaceship.

How can I upload this image so only the rocket shows not the white background?

Note: I have checked the style settings of the picture and no background colour has been set Screenshot 2020-08-28 at 19.45.24

Screenshot 2020-08-28 at 19.40.45432×528 56.4 KB

Many thanks

sudsy · 2020-08-28T20:04:43.719Z

bentomsouthgate:

How can I upload this image so only the rocket shows not the white background?

What file format is the image you uploaded - i.e. what did you export it from AI as?

There’s this known issue (which I assume is still an issue), but if you’re certain that what you uploaded does have transparency (is either a PNG with alpha channel or a proper SVG), then the transparency should be preserved.

EDIT: You can check whether the “master” image in your Bubble storage has transparency by going to Data → File Manager → Search and then clicking the “view” link for that image to see the original file you uploaded. Images appearing in Bubble pages are automatically resampled / optimized, and that’s generally a very good thing. However, it means that what you see on a page is usually not the actual file you uploaded but rather an auto-optimized derivative.

bentomsouthgate · 2020-08-29T08:22:29.103Z

Okay, thanks Steve. The file was formatted as a .pdf and .ai so i will try this!