Category Tinymce and RT-Theme 19

There seems to be an issue with Category Tinymce and RT-Theme 19 from Theme Forest. This is to do with RT-Theme pulling in the category description into the title attribute of menu links.

This would not normally be a problem when using standard WordPress and Woocommerce category descriptions. These can not be formatted and are rarely over a couple of sentences long. However, with Category Tinymce allowing you to format and design a great description area for archives, there can be a problem.

The first problem appears under the main menu area as the description being inserted as a subheading? under the main link name. Because of space constraints, it might look like a heavy line.

The second place this causes an issue is in the category tree menu. Here the issue appears when you mouseover a menu link and a mash-up of code appears in the tooltip popup. This tooltip is from the <a> title attribute being set from the category description.

Issue 1: Solve with CSS

The first problem can quickly and easily be fixed with CSS and set the sub to display as none. Go into the customizer and additional CSS. Here you want to put:

#mobile-navigation a > sub,  #navigation sub{

This should fix the display issue after you refresh your browser. If it does not then you need:

#mobile-navigation a > sub,  #navigation sub{

Issue 2: Solve with javascript

Where the categorytree a[title] tooltip popup is concerned this will need some javascript to remove all a[title] attributes. 

This is not going to have any major effect on your website. Google does not use <a> title attributes for SEO purposes. Link attributes are also no longer used by modern text to speech readers. In fact, link title attributes can cause problems for accessibility as some text readers will read out the same link twice using different descriptions of the link confusing users of readers.

You can use the javascript snippet below to remove <a> title attributes. It has been put together as a WordPress function so just cut and paste into your theme functions file.

function remove_link_titlexcg(){
window.onload = function() {
var links = document.getElementsByTagName("a");
for (var i = 0; i < links.length; i++) {
var link = links[i];
link.onmouseover = function() {
this.setAttribute("org_title", this.title);
this.title = "";
link.onmouseout = function() {
this.title = this.getAttribute("org_title");
add_action( 'wp_head', 'remove_link_titlexcg' );

Make sure you cut and paste the code correctly – including that last ;


Spread the love
Posted in Plugin Support and tagged .

Blog postings from the developer of Y Praise Digital. some thoughts and wonderings of a web developer of over 25 years experience.

Leave a Reply

Your email address will not be published. Required fields are marked *