How to use an image as a button?

Anvil Q&A
1

I know I can drop a link on a form, and then drop an image inside the link.

I’m struggling to figure out how to use the form designer to make this happen. I drop a link on a form, and then try to drag an image from the Add Components palette onto the link. I usually fail.

Next I’ll simply cut the image I dropped on the form, click the link once, and paste (CTRL-V). The image, at this point, is usually inside the link (I think!). Even now, though, I have trouble figuring out how to size the image and the link; I usually want the image to be smaller and the link to be no larger than the image.

Any tips for how to create a clickable image?

2

Welcome to the forum!

The IDE uses blue lines to show you where a new component will be dropped. Here’s a GIF showing the difference in the blue lines when you drop the image inside the link:

link-image

2 Likes
3

Thank you, Jay! I appreciate you taking the time to respond. I think this might be what I need. I don’t know if there’s an “answered” button anywhere but (a) if there is, pretend I clicked it and (b) if it’s a button with an image, I know how to code it in Anvil :joy:

EDIT: Found the ‘solution’ button

1 Like