Border Radius effect on all images

Hi @addredford

Thanks for contacting us!

You can add a border radius to all gallery images with the following line of CSS:

.envira-gallery-image {border-radius: 10px !important;}

That title you see on hover comes from the image title. To keep compliant with screen readers for accessibility and using HTML 5 the image and the image link (if using the lightbox functionality) will take that image title and apply it as an attribute to the image / link. This also helps increase your SEO.

However, you can remove it using the following code in the footer.php file of your child theme just above the closing body tag:
<script type=”text/javascript”>
jQuery(‘document’).ready(function($){
$(‘[title]’).removeAttr(‘title’);
});
</script>

As this is a custom code, it may have unintended effects on the lightbox if you have set the caption to display the Title under the Lightbox tab of the gallery edit screen.

Please let me know if this helps!

Thank you so much, the border radius code worked perfectly!

I couldn’t get the second code working but after your explanation, maybe it’s better to leave the titles as they are so as to not impact SEO rating at all.

Once again, big thanks for your help ??

I’m suddenly having an issue where my gallery shows black, blank images instead of my phots – but it’s only happening on mobile and not desktop as far as I know. Does anybody have any idea what it could be? It’s very odd..

Got it already. It was because thethe Enable defer parsing of FVM JS files globally option was enabled under the Render Blocking JS settings within the Fast Velocity Minify plugin. Phew!