Custom icon on buttons

Hello
I’m trying to insert custom icons into buttons.
Through the dynamic title field, searching for a type with the respective images (png without background).
Apparently everything is ok but the images did not appear. Is this even possible or not?

What I really need is for the button to change its background color when pressed but keep showing the custom icon.

Hello,

Not so sure about this since you haven’t provided any screenshots, structure of searches, or anything. Send us something so we could try to figure out why.

Simply have a condition for the button where if button is clicked, change the background color.

Also, I think you’d be better off if you use groups or texts instead of the button element since you have an icon in it - it’s more flexible this way.

For the text buttons, you could use fontawesome.com to integrate the icons. For the groups, you can either still use font awesome or add an icon element

These are how text and group buttons look like:

Left button = text
Right button = group

Hope this helps!

Best,
Nino

Nino,
In fact, it is not even possible as I said.


The way I had managed to apply the icons was by inserting them as a background. In the conditions configuration I can’t determine a different background color and it needs to continue displaying the icon, which is also in the background.

I heard that applying texts over groups making it as a button, they get some highlight when touched, not fully integrated in some cases with mobile, so I didn’t try that solution

You seem to be doing the search wrong. If you only have one custom icon in your database, you should simply use search for iconess: first item

If you’re planning to use multiple custom icons in that sidebar, you’re better off by using a repeating group and search for all of the icons

Well, since you’re using a custom icon (an image) of course, the background won’t be changeable. I’m assuming the background of your images are white, right? If so, I suggest you remove those background first then reupload them on bubble again. That way it will have no background and will simply follow the color of the parent group.

Best,
Nino

Anything can be a button. You don’t need a button, use a text box and make it look like a button. Or a group. They can all look the same if you do it correctly.

1 Like

There are several buttons on this side menu, I just put one for testing and example.
I would like to try first in a simpler way, without needing a Repeating Group

The image is a backgroundless PNG, to allow playing with a background color of the button, if it were possible to apply the image to another layer.
I just need a button that holds the icon while changing its background color.

Regards.

Yes, I know. I just need a button that holds the icon while changing its background color.

Regards.

Use a text element with a font awesome icon.

I heard that applying texts over groups making it as a button, they get some highlight when touched, not fully integrated in some cases with mobile, so I didn’t try that solution. Is this right?

I understand that you’re testing it out but the way you structured your search was for a repeating group, not a single data - that was the reason why the expression did not work.

I don’t know what you mean. Just try things or watch YouTube videos on tips and tricks. It takes seconds to test my idea.

Good luck

Ok, I got it

Yeah, I can’t agree enough with @troy.roberge font awesome icons on text element rules!!!

I heard that on mobile it doesn’t work well.
But I will test.
Thanks.

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