Buy Now
Sign in

FAQ search

How can I add a WYSIWYG editor in my form

Published: Thursday, 21 April 2016 10:20

ChronoForms v5 includes an option in the Textarea element to enable a WYSIWYG editor for the textarea. It adds a copy of the TinyMCE editor with some basic options. While this is often sufficient you sometimes need to add extra options or use a different editor. This FAQ show some ways to do that.

The simplest way is to use one of the editor plug-ins currently installed in your Joomla! site (or install a new Joomla! plug-in). To do this add a Custom Code element in the form Designer tab and add code like this to it:

$editor = \JEditor::getInstance('jckeditor');
$params = array( 
  'smilies'=> '0' ,
  'style' => '1' ,
  'layer' => '0' ,
  'table' => '0' ,
echo $editor->display( 'textarea1', '', '400', '400', '20', '20', false, $params );

You can select the editor to be used by setting a value in JEditor::getInstance() - if you leave it blank the current default editor will be used, if you add name it needs to be the string from the Element column in the Plug-ins Manager e.g. codemirror, tinymce, . . .

In the last display line you need to add the name of the textarea element you want to use the editor with. If you have more than one textarea then you can repeat this line for each element.

The params settings are specific to the editor and you will need to check the editor documents to get the options you need.

The main options for the $editor->display() are:

  • The element name
  • Default contents
  • Width
  • Height
  • Number of rows
  • Number of columns
  • Show buttons true/false
  • The editor parameter array