Hi Mike here, in this tutorial Iām going to show you how you can use jQuery to remove WordPress title tooltip attributes on hover, which allows screen readers and SEO to use the titles while your site retains a clean modern look. Remove title tooltip attributes from images, links, buttons, icons and more.
This is the code used in the video:
function custom_remove_title_script() {
?>
<script>
(function($){
$("*").hover(function(){
$(this).removeAttr("title");
});
})(jQuery);
</script>
<?php
}
add_action('wp_footer', 'custom_remove_title_script');
This snippet would be used in your WordPress > Appearance > Theme Editor > functions.php, and using a child theme would be the best practice so that when you update your theme the function will not be lost.
If you found this helpful please leave a comment and subscribe to my channel.
So until next time, take care.
Hello,
thank you very much, it works great!
Is there any option to disable tooltips only for some of elements (only for categories on web page)?
With best regard, Palo
Glad to hear, you can target specific elements by using the class of the element instead of the asterisk (*), in the script the asterisk means “anything”. When you use a class include the dot like this:
$(".yourclass").hover(function(){Thanks
Thank you! This saved me! š
The code works great with 1 small issue. If the theme loads content via ajax, without refreshing the page (for example ajax filtering in the product catalog of a woocommerce shop), the newly loaded content will still have the tooltip. The moment you refresh the page or go to another page the code will work again but with ajax it doesn’t work.