Remove JetPack Related Post Tooltip Text

Posted by: pctutorials  :  Category: Web Design

jetpack_logo_2018-011
The JetPack plugin has a nifty featured called “related posts”. Using 3rd party servers, JetPack will analyse your posts and produce 3 related posts that appear at the bottom of your post. When hovering over the related posts, a tooltip is shown that takes a excerpt from the related post. I had a client who wanted this removed. There isn’t a setting to remove this, so I used some jQuery code to remove the tooltip text. You can place the below code in a JS file or if you’re using Divi, this can be entered under Theme Options > Integration > Add code to the top of your posts.


(function($) {
$(window).on('load',function(){
//Remove related posts excerpt tooltip text
$('#jp-relatedposts .jp-relatedposts-items .jp-relatedposts-post .jp-relatedposts-post-title a').removeAttr("title");
$('#jp-relatedposts .jp-relatedposts-items-visual .jp-relatedposts-post a').removeAttr("title");
});
})(jQuery);

The $(window).on(’load’) function is used as we need to wait for JetPack to load the content, since it is generated dynamically. And if you don’t want the hover effect on the related post thumbnails, you can add the following CCS to see the opacity to 1:

#jp-relatedposts .jp-relatedposts-items-visual .jp-relatedposts-post {
opacity: 1 !important;
}

If you enjoyed this post, make sure you subscribe to my RSS feed!

Related Entries

Leave a Reply