A very cool image tip!

@KenanDada actually thats &w=600 (you need an “=” between w and 600). Easy to leave off and then it doesn’t work. :slight_smile:

1 Like

Hello guys, coming back to this topic, do you please know if you can use this even if image is coming from collection rather than from URL?

You can refer to images in an adalo collection either by the image directly or by selecting image url and then selecting the url as the image url from adalo. Using the second option you have the possibility to use the the trick above.

So:
insert image
image source=url
url=collection>image>url

I’ll do a video later when I’m back at my computer

4 Likes

Does this work for multiple images in the DB that are being called into a list from a collection?

Also, is there a way to have images compress upon upload? I am building a couple of apps that will allow the user to upload images from their phone camera and would like for the image size to be reduced upon upload to keep the overall DB size small.

1 Like

I am currently trying to figure that out too, good point!

@ctboita

Yes- it works for wherever you are displaying an image from a collection in Adalo. In my case, I display a list of products and each image is displayed optimised as appropriate to the size. So in the general catalogue, they are small, whereas when you display the detailed view of the item, the image is large (but still optimised).

Re your second question- as far as I know, there is no way to compress images on upload.

Great info thanks. Just a note that if you do it this way you’re adding an extra potential future failure point so you should be careful. If Imgix went out of business, or Adalo decided to migrate away from them to a better/cheaper/different/more modern solution years from now, you could lose all your images.

Maybe should also save them in your adalo database as a fallback so if the worst happens you’d have options.

1 Like

Or at least save to an airtable. They’re not going anywhere.

1 Like

Can’t ever be too sure. Parse was a great backend service for a while, got big, got bought out by Facebook, and then Facebook shuttered it.

Obviously better than nothing though!

1 Like

Dear friends, is there a way to use this tip as the user posts a photo? I tried to update the newly created table value by adding “&w600&auto=compress” to the URL magic text but that does not work…
I mean, as the user uploads a photo, the size of the photo is immediately reduced.
Is there a way to do that?..
Thank you!

1 Like

There is currently no way to do that.

1 Like

Hi Patrice,
I tried using the compress function with adding “&auto=compress&w=300” after my URL but unfortunately it doesn’t show anything now in the app preview. Can it be possible that I’ve done something wrong? Or will it show in my testflight app? Thanks for your help!

grafik

grafik

@LiFox That should be working ok so something is wrong.

Try removing the “&auto=compress&w=300” for the moment and seeing it then an image shows up. If still not then the problem is elsewhere.

@speakupboy Thanks for the tip! I removed this part “&auto=compress&w=300” and it works fine as before but when I’m adding it again it doesn’t show the images, weird…

This would work if I uploaded the images to S3 as well right? I’ve made all the objects public but it doesn’t render the image in the previewer…

Hi @hg_dxb,

These options will work only if you use Adalo’s built-in image storage - they use ImgIX as an image CDN.
If you store images on 3rd-party storage, and put image as URL into the app, mgIX’s capabilities will not work.

Best,
Victor.

2 Likes

Hey Patrice,

Thanks for sharing this tip, it’s something that I’ve been struggling with and that your solution will solve. However, I’m not sure how to put this into action with the ‘Image Picker’ I have in Adalo. As you know, there’s very little you can do with that component. So how do I reduce the weight of each image from my phone using the ‘image picker’ component?

That would be the ideal use of these parameters as users don’t generally understand about image optimization. Anything I upload is already optimized.

Hello, I would like to know how you would use cloudnary. I’m uploading photos and need to resize them.

Hey hi, you can use imgix to optimize images by applying parameters to the image URL stored in the database. This can significantly reduce image weight and improve app loading times without visible loss of quality on the other hand you can also use https://jpegcompressor.com/ it also optimizes images without losing their quality.