Hi!
In desktop, you can hover over the images uploaded and a remove icon appears, so you can delete that particular image.
The problem is that in mobile view the icon never shows. I tried with CSS, but couldn’t find a way to make that icon appear all the time.
Any guidance will be greatly appreciated!
.acf-actions.-hover {
display: block !important;
}
Hi!
Tried it but no luck, the icon does not show.
I’m using frontend Admin, but I also tested this only with ACF in the backend. And in mobile (using an actual phone) there is no way to remove the images uploaded to a gallery.
I need that feature to allow users to edit their post, which is mainly focused on pics.
I used WP forms a while ago, and they had an X beside every pic, so you could remove it.
Getting back to ACF, the css trick should work right?, but I can not find the exact element to show not only on hover. I tried
.acf-icon.-cancel:hover
a.acf-icon.dark.-cancel:hover
a.acf-icon.dark:hover
Thanks again for the help and guidance!
I gave you the exact CSS you need above. It works when I test it. If this is not working for you then I suggest you contact support or submit a ticket through your account.
Thanks @hube2 but to be honest that code is not doing anything in my end :S
Sorry for being asking the same thing in 2 threads, I thought this was not being watched anymore.
But @hopkirk described this problem very eloquently, the fact of the matter if it is currently impossible to remove images from a gallery in a front end form.
I described the specific problem in this thread
https://support.advancedcustomfields.com/forums/topic/show-gallery-remove-icon-not-just-on-hover/
Thanks!
The css i gave before is incorrect. That is for an image field. For a gallery field this is the code that needs to be added
.acf-gallery .acf-gallery-attachment .actions {
display: block !important;
}
Thanks @hube2 once again!
Indeed, that code now shows the black X, but it is not functional. I touch it on a mobile phone and does not remove the image.
In desktop there is a hover state which turns the X to red, and when clicked, the image can be removed.
This whole idea of allowing the X visible at all tines, is because there is a bug with the mobile version. On iOS when a gallery image is touched, the details screen appears but due to a bad css, the “remove” text is not reachable.
And on Android, touching the image does nothing altogether.
Sorry for being a pain, but I’m struggling with this issue for over a month now.
I can’t seem to find a way to remove images from a gallery via mobile phone. And I really need it.
Thanks!
I am limited on the mobile devices I can test, but showing the “X” works fine were I can test it and allows me to remove images from the gallery.
It is not so much a bug as it is the fact that you need to “hover” over the image for the X to appear. Mobile devices do not have a “hover” state. I think that this is something that has been overlooked by the devs and is something they need to create a solution for.
I do not know why removing the images from the gallery when you show the action links is not working for you and that is not something I can debug since I cannot reproduce that. My only real guess is that you have a JavaScript conflict on mobile that is causing it.
Hi @hube2
I believe it is an OS thing.
I was testing in 4 different Samsung devices. Now I borrowed an iPhone and it works fine.
Unluckily most of my users have Android devices 😢🤣
I tested on an android using firefox and was able to remove images from a gallery field after adding the CSS code, although I had to reload the page once because it freaked out when deleting the image the first time. Like I said, this is really something that the developers will need to look at. My experience is that WP and many plugins do not support mobile very well.
I see! Thanks @hube2 for the deep investigation and time you take to check this!
I will look into with more detail and get back if I find the conflicting plugin in case someone runs into this problem too.
Thanks again!
Hi again! Just to give a heads-up to the developers.
It works fine on Firefox. It doesn’t work on chrome or native Samsung internet app.
Unfortunately, I don’t have a way to investigate the dev tools via mobile, but I’m sure it has to be something pretty easy to fix. Or maybe it can be solved with a PHP snippet?
Anyway thanks again!
