How to use/install tinymce for textareas
Moderators: Jon, Steve, Ian, Dave
-
- Ebase User
- Posts: 86
- Joined: Thu Mar 08, 2018 2:52 pm
How to use/install tinymce for textareas
It's not clear to me how to integrate tinymce in the forms for editing textareas. Can somebody assist with more information (or url) on this?
0 x
-
- Ebase User
- Posts: 82
- Joined: Fri Jan 15, 2016 2:34 pm
Re: How to use/install tinymce for textareas
It seems like there's both a cloud and a self-hosted option. Assuming you're doing self-hosted, here are their isntructions for getting started: https://www.tiny.cloud/docs/get-started/first-steps/
Or are are you looking for how to integrate it into Ebase specifically?
Or are are you looking for how to integrate it into Ebase specifically?
0 x
-
- Moderator
- Posts: 1342
- Joined: Wed Sep 12, 2007 12:49 pm
Re: How to use/install tinymce for textareas
1. Add the tinymce javascript to the page or form using the web resources property or tab
2. Add jQuery javascript to the page e.g. //code.jquery.com/jquery-3.1.1.min.js
3. Create a field with display type textarea and drag it on the page
4. Select HTML Element Properties for the field control just added, click the Editor Input tab, and configure an id - say "mytextarea"
5. Under Custom Event Handlers add a jQuery ready event to the same field control (or it could be on any parent control) containing something like this - this is the simplest possible example with no specific configuration:
..where the selector property contains the id configured earlier. Here's a more complicated example:
See the tinymce website for configuration/options details.
2. Add jQuery javascript to the page e.g. //code.jquery.com/jquery-3.1.1.min.js
3. Create a field with display type textarea and drag it on the page
4. Select HTML Element Properties for the field control just added, click the Editor Input tab, and configure an id - say "mytextarea"
5. Under Custom Event Handlers add a jQuery ready event to the same field control (or it could be on any parent control) containing something like this - this is the simplest possible example with no specific configuration:
Code: Select all
tinymce.init({
selector: '#mytextarea'
});
Code: Select all
if (tinymce.editors && tinymce.editors.length > 0)
{
tinymce.remove();
}
tinymce.init({
selector: '#mytextarea',
plugins: "autolink link lists print preview textcolor",
toolbar: "undo redo | styleselect | forecolor backcolor | bold italic | alignleft aligncenter alignright | bullist numlist | indent outdent | link image",
default_link_target: "_blank",
browser_spellcheck: true,
menubar: false,
statusbar: true,
elementpath: false,
branding: false,
auto_focus: true,
entity_encoding: "raw",
setup : function(editor)
{
editor.on('blur', function(e)
{
tinymce.triggerSave();
});
}
});
0 x
-
- Ebase User
- Posts: 86
- Joined: Thu Mar 08, 2018 2:52 pm
Re: How to use/install tinymce for textareas
Thank you for your quick response!
I configured this and it works, but need to play around with settings, because I get a very small editbox. Probably the related CSS. What surprised me is that the field label is also within the edit box. I will play around with it.
I configured this and it works, but need to play around with settings, because I get a very small editbox. Probably the related CSS. What surprised me is that the field label is also within the edit box. I will play around with it.
0 x
-
- Ebase User
- Posts: 82
- Joined: Fri Jan 15, 2016 2:34 pm
Re: How to use/install tinymce for textareas
I suspect you may have put your ID on the field control in general rather than the Editor control.
0 x
-
- Ebase User
- Posts: 86
- Joined: Thu Mar 08, 2018 2:52 pm
Re: How to use/install tinymce for textareas
I appears that the smallness is due to the fact that the edit box is in the position of the fieldlabel and using the same width as the field label. The fieldlabel is in the tinymce edit box title.
0 x
-
- Ebase User
- Posts: 86
- Joined: Thu Mar 08, 2018 2:52 pm
-
- Ebase User
- Posts: 86
- Joined: Thu Mar 08, 2018 2:52 pm
Re: How to use/install tinymce for textareas
You're right. Thats when you use a new product. Thanks
0 x
-
- Moderator
- Posts: 1342
- Joined: Wed Sep 12, 2007 12:49 pm
Re: How to use/install tinymce for textareas
I've updated the description above to say that the id should be added to the Editor tab.
0 x
Who is online
Users browsing this forum: No registered users and 7 guests