Background image in button?

Hi,

In the previous version of Blocs I could add a background image to a button, no problem. I just added a custom class to the button (which is in a div) with an image background, and a solid color background with text in the hover and active states. However, I cannot seem to get an image background to appear in a button at all with the newest version. I have no idea why this is not working. I am doing it the same exact way as with my previous project.

ALSO: when i open my previous project with the buttons with image backgrounds, and delete the image background from one of the button classes, I can’t put another image in there anymore. ???

Help?

You need to drag the image into the image field. In this new version you can not select it anymore. Hope it helps

I tried that but i couldn’t drag it into the button. Is that not possible anymore?

It works for me.

Basically, quite simply, I am creating a portfolio website and want to do what this website does (see link).

https://tshaped.org

Hover over each image and a dark overlay with text appears. It seems pretty simple but like I said the way I’ve done it before doesn’t work anymore (buttons in divs) :frowning:

Thanks, i think i figured it out. i was dragging from the image library onto the actual button onscreen instead of the image background field in the class.

Yes. That’s the way to do it

How will you handle touch based devices that have no hover.?

There is a nice image hover overlay in the Bloc Store that works great. It’s a great time saver from creating buttons with images.

https://blocs.store/product/image-overlay/

Casey

1 Like

Hmm, I don’t know… the example above doesn’t do anything with touch-based devices. Maybe a label underneath…that I hide on other sizes?