Implementing WYSIWYG editing is fairly straightforward in Magento using either TinyMCE or FCKEditor. However, a known issue means that TinyMCE doesn’t work within the CMS section. So FCKEditor is the only real option at the moment.
There is however one issue to sort out. The product description field is mandatory; when you enter text into this field, and click ’save’ or ’save and continue’ the validation doesn’t pick the text up. You need to tell FCKEditor to update the textarea.
So, in /app/design/adminhtml/default/default/template/catalog/product/edit.phtml change:
function saveAndContinueEdit() { productForm.submit($('product_edit_form').action+'back/edit/tab/' + product_info_tabsJsTabs.activeTab.id); }
To
function saveAndContinueEdit() { oEditor = FCKeditorAPI.GetInstance('id_of_element'); oEditor.UpdateLinkedField(); productForm.submit($('product_edit_form').action+'back/edit/tab/' + product_info_tabsJsTabs.activeTab.id); }
This deals with the ’save and continue’ button. You then need to add this operation to the ’save’ button. First add a new JS function to the same file:
function save() { oEditor = FCKeditorAPI.GetInstance('id_of_element'); oEditor.UpdateLinkedField(); productForm.submit(); }
Then in app/code/core/Mage/Adminhtml/Block/Catalog/Product/Edit.php change:
$this->setChild('save_button', $this->getLayout()->createBlock('adminhtml/widget_button')->setData( array( 'label' => Mage::helper('catalog')->__('Save'), 'onclick' => 'productForm.submit()', 'class' => 'save' )) );
To
$this->setChild('save_button', $this->getLayout()->createBlock('adminhtml/widget_button')->setData( array( 'label' => Mage::helper('catalog')->__('Save'), 'onclick' => 'save()', 'class' => 'save' )) );