How to change or delete the title of SVG icons in Oxygen?

The built-in sets of SVG icons in Oxygen have such a feature — when you hover the cursor on an icon, a tooltip appears with the icon title, while there is no possibility to change the text of this tooltip. And what if the site is not in English, or you just do not want this title to appear?

In this tutorial I will tell you how we can easily change or even delete the text of the tooltip from the icons. To do this, you need to apply a small javascript code.

First you need to see and copy the current name of the icon, because we need it for writing code:

Где посмотреть имя SVG иконки в Oxygen?

Next, add a Code Block component to the page if it has not been added before.

In the Advanced > Javascript section, place the following code:

jQuery(document).ready(function($){

    $("svg title:contains('old-title-name')").text("new-title-name");

});

Where the value of old-title-name is replaced with the current name of the icon, and the value of new-title-name, replace the new word or phrase that should be displayed in the tooltip.
If you want to delete the title, leave the empty value instead of the value new-title-name:

jQuery(document).ready(function($){

    $("svg title:contains('old-title-name')").text("");

});

This is how it will look like on a real example:

How to change or delete the title of SVG icons in Oxygen?

Example:

Move the cursor to each icon, and you will see the corrected text of the tooltip (works only on the desktop)
If this trick was useful to you, then do not hesitate to write your review. If you have any questions, you can ask them here.
Follow the release of new tips and tutorials:
exclamation-trianglethumbs-upthumbs-downarrow-up