Add logos to images (like watermark)

Need help
1

Hi All,

I’m looking to build a simple image generator.

The idea is the following:

  1. User uploads an image (could be of themselves)
  2. The app receives that image and processes it.
  3. The app spits back out the same image but with a logo/icon added somewhere within the image (similar to how images are watermarked).
  4. User downloads and now has this image for use.

Any suggestions on how to do this?

2

I also need info on how to get this done. please tag me in your answers

3

What I imagined was a group (align to parent) with an image uploader in the back (full width/full height) and your logo in the front positioned in the corner.

You upload an image and use a plugin to transform the group into an image (there are a few plugins for it).

4

Yeah, that’s what I thought too

I think you can’t natively add logos or overlay any other images together in Bubble natively or with the use of plugins.

5

So what you can do is use an html element, and put in the html image code for your image. Then you can run the image through imgix which we have access to natively through bubble. Imgix allows for the addition of a watermark.

I’m not at my computer, so I can’t give you a perfect example, but this should get you there if you want to do the legwork to figure it out on the forum.

6

Imgix will work, but only if used inside an image element.
See this example here:

7

Why only isn’t an image element? I use html element for imgix all the time.

8

What I mean is that if you display the image in the page (I tried with the image element) imgix transformations are applied because bubble actually uses the image url as path for another endpoint. If you try to apply the imgix parameters in a workflow the resulting url is different and the transformations are not applied. Of course I am talking about images stored in bubble in both cases.

9

This topic was automatically closed after 70 days. New replies are no longer allowed.