Author: Alexander Buzmakov
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:
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:
