Placeholder/text for an Image Element, useful for empty profile photos (ready to sponsor)

Idea
1

Here is why its so critical:

You display a profile picture, but some users didn’t upload a photo yet, so u want to display their name instead.

I understand you can workaround by showing a text element when profile photo is empty, but the problem is that a text doesnt have the “keep proportion” option so it will not show a square depending on page size, and besides, it wont recenter vertically when text have 2 lines for multi-word names.

So you would ask why not use the Image uploader instead and have the initial content set to users profile, and use the placeholder to show the users name when his photo is empty? the answer is that i want to be able to create a workflow when clicked, which is not possible with a Image Uploader which rather pops up the “upload image” popup.

Although i can “disable the input” on a Picture Uploader and use an underlying group or overlying hidden element to trigger the workflow, still for some reason, a Picture Uploaded doesn’t give access to the Placeholder property in the conditions tab, which is necessary for my case

2

You can reach out to support@bubble.is to talk about sponsoring a dynamic placeholder if it’s blocking you.

3

The image element is transparent when empty, so you can put another element behind it as a placeholder, and as you mentioned set it to invisible when the image comes.

If you use a HTML element as placeholder, you can arrange the text however you like.

1 Like