Changing the tool tip for the TinyMCE removeformatting button

Question

I'd like to change the tool tip for the TinyMCE 4 "removeformatting" button:

from "Clear formatting" to "Clear selected formatting." But I'm not able to find where in the TinyMCE code this button is defined.

Can someone point me to the ed.addButton code for it?

Thanks

Answer 1

By the looks of it the line you are looking for is:

<span id="mceu_61-text" class="mce-text">Clear formatting</span>

So a simple JS search and rewrite the inner HTML would work. But this button clears all formatting on the text if nothing is selected or only clears the selected text if there is a selection. (Note the id of the element will change depending on what tool bars you have loaded, that line was taken from a full featured demo)

Though the actual hard coded string seems to be located in

tinymce/classes/ui/FormatControls.js

on line 300

removeformat: ['Clear formatting', 'RemoveFormat'],

Answer 2

One way you can change these is to use a language file for en_US and put replacements there. To make this work you need to do 2 things:

1 - Add a language configuration option to your init:

tinymce.init({ 
  selector: '#myTextArea',
  language: 'en_US',   //Force custom translations of button/menu text in English.
  ...
});

2 - Add a en_US.js file to your langs folder within TinyMCE.
This file is where TinyMCE looks for language translations so if you tell TinyMCE explicitly to use the en_US language it will look in the langs folder for a JS file of the same name as the language. You can then put updated translations in that file:

tinymce.addI18n('en_US',{
  "Clear formatting": "Custom Clear Formatting Text"
});

To see all your options for what you can change just grab a language file from here: https://www.tinymce.com/download/language-packages/ The label on the left is the "key" and the value on the right is the "value". The "key" is effectively what you get in English when you don't include a reference to a language in the tinymce.init({}) call..

The advantage of this is that you are not changing the TinyMCE code itself so this makes updating TinyMCE easier as you don't need to keep recreating your changes.