Is it possible to configure the toolbar buttons styleselect and fontsizeselect
to use custom icons rather than the default text they have? and if so how. all the examples I've come across so far involve defining your own custom button to add on, which seems like a lot just to replace some text with an icon.
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',{
"Formats": "Custom Formats Text",
"Font Sizes": "Custom Font Size 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..
Related
I installed Atom Material icon plugin in WebStorm 2021.1.3.
When I write index.html the icon does not show it, but when I change the name before .html (e.g. othername.html) it displays the icon.
How do I display an icon for index.html?
In most cases, the file type of index.html was changed to Auto-detect file type by context or Text. You can change it in the settings: Preferences / Settings | Editor | File Types, find Auto-detect file type by context or Text and delete index.html from File name patterns list.
This problem is due to a defect in the icon file, which you can see in the following link:
https://material-theme.com/docs/reference/associations/#index
To solve this problem, you must enter the following path: File > Settings > atom material icons settings
Other items are available in the photo :
Rename the icon name from index to indx
Note that the index name must be changed in the settings section so that the icons are displayed correctly. This was the solution I was able to solve my problem. Good luck
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
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'],
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.
I want to change TinyMCE format buttons texts. i.e. "header1/2/3/..." or "paragraph".
Edit : found what I was looking for, I had to go to mytheme/inc/shortcodes/tinymce.php. Not sure if this file is a default one though.
TinyMCE 3.5.8
I merely need to create a button (and module) that acquires a user-entered value from a popup and places it between two tags, e.g., [bib][/bib]
I am having trouble finding a "step-by-step" for doing this, including what files, where code goes, etc. This must be rather simple?
I have replaced all of the occurrences of "example" with my module name in the "Example" module, but that is where my information ends.
If someone would be so kind !
P.S.: It would be even better if the form field would javascript validate for "integer", but maybe I ask too much?
download the tinymce development version
use tiny_mce_dev.js instead of tinymce.js for developement in order to get more usefull error messages
create an own tinymce plugin (this is not that difficult) that opens a popup
get the content of a popup field
insert it at the right place in the editor
You should have a look at other tinymce plugins (in the plugins directory under the tiny_mce dir) to get to know how some things work. There are many plugins, some of them use popups.
I.E. the searchreplace popup
Is there a way to configure some settings around the 'SDL Tridion' button that is shown in the top left of the published website?
I'd like to go to town on it:
Change the text from 'SDL Tridion' to something like 'Edit this page'
Change the position in the page e.g. to bottom right
Change the colour etc.
You could look at concept of the skinning the Tridion CMS and apply the same for UI Experience Manager. You could find the UI themes TRIDION_HOME\web\WebUI\Editors\SiteEdit\Themes and possibly could add a new css for the placement of the button etc.
You could create a new css file like MyCustom.css and place it under the defalt Carbon. Once you have your new css file you need to update the SiteEditEditor.cfg file under TRIDION_HOME\web\WebUI\Editors\SiteEdit\Configuration to add new theme css file. Look for themefiles section in the config.
To change the default label, you need to change the EditorViewTitle data attribute value in Tridion.Web.UI.Editors.SiteEdit.Strings.resx file located under TRIDION_HOME\web\WebUI\WebRoot\App_GlobalResources.
**NOTE::***Please note that updating .resx files may not be supported and not documented*.
I played with this while back and I am quite successful with the labels and themes, but did not pursue since it is not fully meeting my needs.
Skinning the CMS is documented at : http://sdllivecontent.sdl.com/LiveContent/content/en-US/SDL_Tridion_2011_SPONE/task_C4C14E4D601B4BE392ACE3B067426BB7
I do not have enough rep points to make a comment, so I am using an answer instead.
Thanks Ram for the details.
I just tried to change the SDL Tridion button label, and I had to use the StartButtonLabel resource name in Tridion.Web.UI.Editors.SiteEdit.Strings.resx to make it work. The EditorViewTitle label appears as the browser page title, not on the start button.