I'm using TinyMCE and wanting to display it in Spanish (es)
The TinyMCE version info is as follows
majorVersion : '3',
minorVersion : '3.9.2',
releaseDate : '2010-09-29'
The documentation says to download the language pack from here and copy the files to the appropriate
folders:
/tinymce/jscripts/tiny_mce/langs/
/tinymce/jscripts/tiny_mce/themes/advanced/langs/
/tinymce/jscripts/tiny_mce/plugins/<pluginname>/langs/
and also set
tinyMCE.init({
// General options
language: 'es',
mode: "textareas",
theme: "advanced",
relative_urls : false,
file_browser_callback : ekmUpload,
plugins: "safari,spellchecker,pagebreak,style,layer,table,save,advhr,advimage,advlink,emotions,iespell,inlinepopups,insertdatetime,preview,media,searchreplace,print,contextmenu,paste,directionality,fullscreen,noneditable,visualchars,nonbreaking,xhtmlxtras,template,imagemanager,filemanager",
// Theme options
theme_advanced_buttons1: "newdocument,save,print,|,code,preview,fullscreen,|,bold,italic,underline,strikethrough,forecolor,backcolor,|,justifyleft,justifycenter,justifyright,justifyfull,|,formatselect,fontselect,fontsizeselect",
theme_advanced_buttons2: "image,template,|,cut,copy,paste,pastetext,pasteword,|,search,|,bullist,numlist,|,sub,sup,|,undo,redo,|,link,unlink,anchor,|,hr,removeformat,",
theme_advanced_buttons3: "",
theme_advanced_toolbar_location: "top",
theme_advanced_toolbar_align: "left",
theme_advanced_statusbar_location: "bottom",
theme_advanced_resizing: false,
content_css : " ",
editor_selector: "HTMLEditor",
height : '500',
width : '100%',
convert_urls : false,
inline_styles : true,
save_enablewhendirty: true,
save_onsavecallback: "SaveDocuments",
This answer here also gives the same advice.
But the language pack (zip file) only contains lang/es.js
Having does this, nothing appears in Spanish, the "format", "font-family" and "font-size" drop downs don't appear in Spanish.
What am i missing?
What you donwloaded is the language file for tinymce 4, you need the language pack for tinymce 3. You will get it here: http://www.tinymce.com/i18n3x/index.php?ctrl=lang&act=download&pr_id=1
See: http://www.tinymce.com/wiki.php/Configuration:language
example...
tinymce.init({
...
language: "sv_SE"
...
});
You have: language: 'es',
Related
I have this
tinyMCE.init({
// General options
selector: 'textarea',
forced_root_block: "",
theme: "silver",
paste_text_sticky: true,
paste_text_sticky_default: true,
plugins: "paste,autolink,contextmenu,fullscreen,nonbreaking,template",
//plugins: "wordcount,paste,autolink,advlink,fullscreen,nonbreaking,template,inlinepopups,style",
// Theme options
//theme_advanced_buttons1: "bold,italic,underline,strikethrough,|,undo,redo,|,justifyleft,justifycenter,justifyfull,|,link,unlink,|,fullscreen",
//theme_advanced_buttons2: "cut,copy,paste,|,cleanup,removeformat,|,bullist,numlist,outdent,indent,hr,charmap",
//theme_advanced_buttons1: "cut,copy,paste,removeformat,|,undo,redo,|,bullist,numlist,outdent,indent,|,formatselect,bold,italic,underline,forecolor,backcolor,|,justifyleft,justifycenter,justifyfull,|,link,unlink,|,fullscreen",
theme_advanced_buttons1: "cut,copy,paste,removeformat,|,undo,redo,|,bullist,numlist,outdent,indent,|,bold,italic,underline,|,fullscreen",
//theme_advanced_blockformats: 'p,h1,h2,h4,h4,h5,h6',
theme_advanced_toolbar_location: "top",
theme_advanced_toolbar_align: "left",
//theme_advanced_statusbar_location : "bottom",
theme_advanced_resizing: true,
theme_advanced_path: false,
// Example content CSS (should be your site CSS)
selector: "textarea",
content_css: "/css/admin.css",
setup : function (ed) {
ed.on('click', function () {
new_value = tinymce.activeEditor.getContent()
alert(new_value);
new_value = new_value.replace(/,/g, "☀");
alert(tinymce.DOM.getAttrib(ed,"data-hidden"));
hidden_Field = tinymce.DOM.getAttrib(ed,"data-hidden");
$("#" + hidden_Field).val(new_value);
});
},
});
How do I get the value of the data-hidden attribute of the textarea that was filled in. tinymce.DOM.getAttrib(ed,"data-hidden"); isn't find anything as hidden_Field is, set when I do the alert. I am guessing Tinymce is ignoring it but how do I stop it from ignoring the attributeo
Thanks
I am using the latest Keystone.js and following is my Keystone.init
var keystone = require('keystone');
keystone.init({
'name': 'Dashboard',
'user model': 'User',
'auto update': true,
'auth': true,
'cookie secret': 'secure string goes here',
views: 'templates/views',
'view engine': 'pug',
'wysiwyg cloudinary images': true,
'wysiwyg additional plugins': 'example, autosave, charmap, table, '
+ 'advlist, anchor, wordcount, preview, fullscreen, importcss, '
+ 'paste',
'wysiwyg additional buttons' : 'undo redo charmap blockquote formatselect styleselect removeformat |'
+ 'example preview fullscreen bodytext',
'wysiwyg additional options': {
default_link_target: '_blank',
paste_as_text: true,
menubar: true, // added to test formats
'style_formats': [
{ title: 'Red text', inline: 'span', styles: { color: '#ff0000' } }
],
formats: {
bodytext: {block : 'p', attributes : {title : 'bodyText'}, styles : {color : 'grey'}}
}
}, });
keystone.set('routes', require('./routes'));
keystone.import('models');
keystone.set('nav', {
'projects': ['Projects', 'Keywords'],
});
keystone.start();
What I get in the TinyMCE editor is Formats dropdown without any custom format inside it.
Does anyone has any idea how to solve it? I need to add a custom format to add a class to text, eg. image caption, body text etc.
After going to Keystone.js files I found out that it is using TinyMCE ver 4.4.3 and Keystone ver is 4.0 RC.
So, I found the solution, it was a silly mistake, the style_formats: is supposed to appear with the quote:
'wysiwyg additional options': {
default_link_target: '_blank',
paste_as_text: true,
menubar: true, // added to test formats
style_formats: [
{ title: 'Red text', inline: 'span', styles: { color: '#ff0000' } }
],
formats: {
bodytext: {block : 'p', attributes : {title : 'bodyText'}, styles : {color : 'grey'}}
}
}, });
I hope if anyone else is also facing this issue, you can check if this solves it for you.
I have a tinymce editor on a textarea of my page. I am initializing it in READONLY mode by setting readonly attribute as true. Please refer init below:
tinyMCE.init({
mode : "exact",
elements : "p_desc",
debug : false,
nowrap : false,
cleanup_on_startup : true,
fix_nesting : true,
readonly : true,
force_br_newlines : true,
force_p_newlines : false,
gecko_spellcheck : true,
forced_root_block : '' ,
...
setup : function(ed) {
ed.onKeyUp.add(function(ed) {
textCounter('p_desc','Charcount',4000);
});}
});
Now depending upon the value of a hidden input field on the same page, i am enabling edit using tinyMCE.get('p_desc').getBody().setAttribute('contenteditable', true);
The editor starts working in editable mode but the onKeyUp event defined in setup is still not working.
Someone please help.
You could try
tinyMCE.init({
readonly : true,
...
setup : function(ed) {
if (!ed.getParam('readonly')) ed.onKeyUp.add(function(ed) {
textCounter('p_desc','Charcount',4000);
});}
});
Fancybox 1.3.4 JS came with my Wordpress theme, Gridlocked. Everything works properly, but the lightbox popup is too big for the screen. I'd like the image to shrink if needed to always fit on screen.
Looking at the Fancybox site instructions, it seems I want to set "autoscale:true" to fix this, either in PHP or in the JS file itself. The javascript file that came with the theme already has this set to true, but it's not working. I don't know where in all the theme php files I should try to include the argument. Any suggestions?
The initialization of fancybox is done in jquery.custom.js.
You can find following lines there:
function tz_fancybox() {
if(jQuery().fancybox) {
jQuery("a.lightbox").fancybox({
'transitionIn' : 'fade',
'transitionOut' : 'fade',
'speedIn' : 300,
'speedOut' : 300,
'overlayShow' : true,
'autoScale' : false,
'titleShow' : false,
'margin' : 10,
});
}
}
tz_fancybox();
Change to:
function tz_fancybox() {
if(jQuery().fancybox) {
jQuery("a.lightbox").fancybox({
'transitionIn' : 'fade',
'transitionOut' : 'fade',
'speedIn' : 300,
'speedOut' : 300,
'overlayShow' : true,
'autoScale' : true,
'titleShow' : false,
'margin' : 10,
});
}
}
tz_fancybox();
I have initialised TinyMCE as follows. I want to force line breaks when user presses enter and not the paragraphs. I'm trying following, but not working. I'm using TinyMCE version 3_3_8.
tinyMCE.init({
mode: "exact",
theme: "advanced",
elements: "textAreaId",
cleanup: false,
theme_advanced_toolbar_location: "",
theme_advanced_buttons1: "",
theme_advanced_buttons2: "",
theme_advanced_buttons3: "",
height: 200,
width: 300,
forced_root_block : false,
force_br_newlines : true,
force_p_newlines : false,
oninit: InitPosition
}); //init ends
I tried to define forced_root_block : "", but still it is not working.
What am I doing wrong?
Simply add forced_root_block : false
Or if you want a wrapper: forced_root_block : 'div',
Works like a charm!
Instead try:
force_p_newlines : false,
force_br_newlines : true,
convert_newlines_to_brs : false,
remove_linebreaks : true,
I faced the same situation with TinyMCE 4. All my "Enter" (keyboard) resulted in a new <p> </p> injected.
I didn't want to use forced_root_block : false so I figured something out in the tinymce.init function (each empty paragraph will be cleaned directly):
setup : function(editor) {
editor.on('PostProcess', function(ed) {
// we are cleaning empty paragraphs
ed.content = ed.content.replace(/(<p> <\/p>)/gi,'<br />');
});
}
https://www.tinymce.com/docs/configure/integration-and-setup/#setup
https://www.tinymce.com/docs/api/class/tinymce.editor/#postprocess
What worked for me was:
tinymce.init({
...
force_br_newlines : true,
force_p_newlines : false,
forced_root_block : ''
});
Each linebreak is producing br tag with these settings.
SOURCE: http://www.tinymce.com/wiki.php/Configuration3x:force_br_newlines
The "forced_root_block : false" option works fine for TinyMCE 4.0.
Insert in theme functions.php the following code:
add_filter( 'tiny_mce_before_init', 'my_switch_tinymce_p_br' );
function my_switch_tinymce_p_br( $settings ) {
$settings['forced_root_block'] = 'br';
return $settings;
}
TinyMCE On Mozilla Firefox adds <div> instead <br> or <p>.
I found the solution:
Open Mozilla Firefox and put in the address:
about:config
Search the option and turn false:
editor.use_div_for_default_newlines
in tinyMCE 5 I needed to add 1 extra parameter
tinymce.init({
...
valid_elements: 'br',
force_br_newlines : true,
force_p_newlines : false,
forced_root_block : ''
});
Just add
force_br_newlines : true,
force_p_newlines : false,
forced_root_block : false,
anywhere in tinymce.init