Posting in the Magento forums has been disabled pending the implementation of a new and improved forum solution which should better serve the community.

For new questions please post at magento.stackexchange.com, the community-run support site for the Magento community. We will be providing updates on the new forum solution soon. For questions or concerns please email community@magento.com.

Magento Forum

This code worked for me to get TInyMCE working
 
yaani
Member
 
Total Posts:  56
Joined:  2008-08-13
 

Here is the code that worked for me to install the TinyMCE Editor in the product pages & CMS pages.

Turn the WYSIWYG switch on in the app/code/core/Mage/Adminhtml/Block/Cms/Page/Edit/Tab/Main.php file.

$fieldset->addField('content''editor', array(
            
'name'      => 'content',
            
'label'     => Mage::helper('cms')->__('Content'),
            
'title'     => Mage::helper('cms')->__('Content'),
            
'style'     => 'width:98%; height:600px;',
            
'wysiwyg'   => true,
            
'required'  => true,
            
'theme' => 'advanced',

Product pages - add this code right after the “</form>” tag & before the line “script type="text/javascript\" in the app/design/adminhtml/defaut/default/template/catalog/product/edit.phtml file.

<script language="javascript" type="text/javascript" src="<?php echo $this->getJsUrl('tiny_mce/tiny_mce.js') ?>"></script>
                
<script language="javascript" type="text/javascript">

Event.observe(window'load', function() {
if(document.getElementById('description'))
    
if(document.getElementById('description').value == '')
        document
.getElementById('description').value "<p>Enter description</p>"
        
document.getElementById('short_description').value "<p>Enter short description</p>"
    
}
}

                   tinyMCE
.init({
                        mode 
"exact",
                        
theme "advanced",
                    
strict_loading_mode true
                
elements "description,short_description",
                        
theme_advanced_toolbar_location "top",
                        
theme_advanced_toolbar_align "left",
                        
theme_advanced_path_location "bottom",
                        
extended_valid_elements "a[name|href|target|title|onclick],img[class|src|border=0|alt|title|hspace|vspace|width|height|align|onmouseover|onmouseout|name],hr[class|width|size|noshade],font[face|size|color|style],span[class|align|style]",
                        
theme_advanced_resize_horizontal "true",
                        
theme_advanced_resizing "true",
                        
apply_source_formatting "true",
                        
convert_urls "false",
                        
force_br_newlines "true",
                        
doctype '<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">'
                    
}); 
});
</script>

CMS Pages - Add/replace the code in the lib/Varien/Data/Form/Element/Editor.php file.

public function getElementHtml()
    
{
        
if( $this->getWysiwyg() == true )
        
{
            $element 
= ($this->getState() == 'html') ? '' $this->getHtmlId();

            
$html '
                <textarea name="'
.$this->getName().'" title="'.$this->getTitle().'" id="'.$this->getHtmlId().'" class="textarea '.$this->getClass().'" '.$this->serialize($this->getHtmlAttributes()).' >'.$this->getEscapedValue().'</textarea>
        <script language="javascript" type="text/javascript" src="http://www.YourDomainName/magento/js/tiny_mce/tiny_mce.js"></script>
   <script language="javascript" type="text/javascript">
        setTimeout(function(){  
                   tinyMCE.init({
                        mode : "exact",
                        theme : "advanced",
                strict_loading_mode : true, 
            elements : "'
.$this->getHtmlId().'",
                        theme_advanced_toolbar_location : "top",
                        theme_advanced_toolbar_align : "left",
                        theme_advanced_path_location : "bottom",
                        extended_valid_elements : "a[name|href|target|title|onclick],img[class|src|border=0|alt|title|hspace|vspace|width|height|align|onmouseover|onmouseout|name],hr[class|width|size|noshade],font[face|size|color|style],span[class|align|style]",
                        theme_advanced_resize_horizontal : "true",
                        theme_advanced_resizing : "true",
                        apply_source_formatting : "true",
                        convert_urls : "false",
                        force_br_newlines : "true",
                        doctype : \'
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">\'
                    }); 
        }, 1000);
                </script>'
;

            
$html.= $this->getAfterElementHtml();
            return 
$html;
        
}
     
else
        
{
            
return parent::getElementHtml();
        

    }

Remember to change the url to whatever your domain name is.

This code contains several of the fixes mentioned in earlier posts in this thread.

Thanks everyone for your posts, they were very helpful.

 
Magento Community Magento Community
Magento Community
Magento Community
 
Appmerce
Guru
 
Avatar
Total Posts:  376
Joined:  2008-05-13
Amsterdam, The Netherlands
 

This one works! Excellent!

 
Magento Community Magento Community
Magento Community
Magento Community
 
TwilightWebDesign
Jr. Member
 
Total Posts:  22
Joined:  2008-04-20
 

I can confirm this works great for the CMS pages smile (I had already got the product pages one working)

 
Magento Community Magento Community
Magento Community
Magento Community
 
thomasmore
Sr. Member
 
Total Posts:  80
Joined:  2008-10-21
 

Where do you get the TinyMCE editor and where do you put the files before you make these edits?

 
Magento Community Magento Community
Magento Community
Magento Community
 
Appmerce
Guru
 
Avatar
Total Posts:  376
Joined:  2008-05-13
Amsterdam, The Netherlands
 
thomasmore - 26 October 2008 01:33 PM

Where do you get the TinyMCE editor and where do you put the files before you make these edits?

Get any latest version from http://tinymce.moxiecode.com

You get a zipped file which looks like tinymce/js/tiny_mce/…

You need to put that “tiny_mce” folder completely into your magento/js/… folder, so it all looks like magento/js/tiny_mce/tiny_mce.js

 
Magento Community Magento Community
Magento Community
Magento Community
 
Appmerce
Guru
 
Avatar
Total Posts:  376
Joined:  2008-05-13
Amsterdam, The Netherlands
 

Making it work for categories description:

Find the file app/design/adminhtml/default/default/template/catalog/category/edit.phtml

Find the code:

<div id="category-edit-container" class="category-content">
    
<?php echo $this->getChildHtml('form'?>
</div>

and add this directly below it:

<script language="javascript" type="text/javascript" src="<?php echo $this->getJsUrl('tiny_mce/tiny_mce.js') ?>"></script>
                
<script language="javascript" type="text/javascript">
Event.observe(window'load', function() {
                   tinyMCE
.init({
                        mode 
"exact",
                        
theme "simple",
                    
strict_loading_mode true
                
elements "_generaldescription",
                        
theme_advanced_toolbar_location "top",
                        
theme_advanced_toolbar_align "left",
                        
theme_advanced_path_location "bottom",
                        
extended_valid_elements "a[name|href|target|title|onclick],img[class|src|border=0|alt|title|hspace|vspace|width|height|align|onmouseover|onmouseout|name],hr[class|width|size|noshade],font[face|size|color|style],span[class|align|style]",
                        
theme_advanced_resize_horizontal "true",
                        
theme_advanced_resizing "true",
                        
apply_source_formatting "true",
                        
convert_urls "false",
                        
force_br_newlines "true",
                        
doctype '<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">'
                    
}); 
});
</script>

Now you have tinyMCE for categories descriptions as well. You can change theme “simple” to “advanced” (in above code) for more features.

 
Magento Community Magento Community
Magento Community
Magento Community
 
cmiranda
Jr. Member
 
Total Posts:  10
Joined:  2008-12-09
 

yaani thanks for the code!

Up now it’s the only one i’ve seen here that works properly!

Morningtime the code for the categories description doesn’t work properly.

When you switch between categories the TinyMCE is gone, it comes back only if you refresh the window.

Probably this happens because of conflict with other scrips loading in simultaneous by the system.

Unfortunately I still don’t have a fix for it…

 
Magento Community Magento Community
Magento Community
Magento Community
 
nikefido
Guru
 
Avatar
Total Posts:  481
Joined:  2008-07-11
New Haven, CT
 

Post bookmarked rasberry

 
Magento Community Magento Community
Magento Community
Magento Community
 
Compuland
Guru
 
Total Posts:  374
Joined:  2009-01-14
Denmark
 

Danm.

What am i doing wrong here. I get this message in CMS:

public function getElementHtml() { if( $this->getWysiwyg() == true ) { $element = ($this->getState() == ‘html’) ? ‘’ : $this->getHtmlId(); $html = ‘ serialize($this->getHtmlAttributes()).’ >’.$this->getEscapedValue().’ ‘; $html.= $this->getAfterElementHtml(); return $html; } else { return parent::getElementHtml(); } }
Fatal error: Class ‘Varien_Data_Form_Element_Editor’ not found in /home/www/magento.compuworld.dk/lib/Varien/Data/Form/Abstract.php on line 122

 
Magento Community Magento Community
Magento Community
Magento Community
Magento Community
Magento Community
Back to top