View Single Post
  #1  
Old 03-18-2007, 01:02 PM
 
PhilJ PhilJ is offline
 

X-Guru
  
Join Date: Nov 2002
Posts: 4,094
 

Default Adding the FCKeditor HTML Editor

I'm not that keen on the HTML editor module in v4.1.x...

FCKEditor is far better, it generates decent HTML and has a very useful image uploader.

Here's how to add it...

1) Disable the existing HTML editor in modules.

2) Download FCKeditor here - http://www.fckeditor.net/download

Or, click here for direct download to files, which includes CKFinder (license required).

3) Upload the 'fckeditor' directory to your root directory.

4) Apply this SQL patch...

Code:
INSERT INTO xcart_modules VALUES (100,'FCKEditor','This module allows you to edit text in WYSIWYG mode.','Y');

^ This will create a new FCKEditor entry in 'modules'.

5) In skin1/single/home.tpl

Before...
Code:
</head>
Insert...
Code:
{if $active_modules.FCKEditor ne ""} <script type="text/javascript" src="{$http_location}/fckeditor/fckeditor.js"></script> {/if}

(Change to {https_location} if your admin uses SSL).

If the FCKEditor doesn't load, try manually adding the full path instead, eg.

Code:
{if $active_modules.FCKEditor ne ""} <script type="text/javascript" src="http://www.mystore.com/fckeditor/fckeditor.js"></script> {/if}

6) PRODUCT DESCRIPTIONS

In skin1/main/product_details.tpl

Before...
Code:
</form>
Insert...
Code:
{if $active_modules.FCKEditor ne ""} <script type="text/javascript"> var oFCKeditor = new FCKeditor('descr'); oFCKeditor.BasePath = "../fckeditor/"; oFCKeditor.Height="200"; oFCKeditor.ToolbarSet="Default"; oFCKeditor.ReplaceTextarea() ; </script> <script type="text/javascript"> var oFCKeditor = new FCKeditor('fulldescr'); oFCKeditor.BasePath = "../fckeditor/"; oFCKeditor.Height="400"; oFCKeditor.ToolbarSet="Default"; oFCKeditor.ReplaceTextarea() ; </script> {/if}

7) STATIC PAGES

In skin1/admin/main/page_edit.tpl

Before...
Code:
</form>
Insert...
Code:
{if $active_modules.FCKEditor ne ""} <script type="text/javascript"> var oFCKeditor = new FCKeditor('pagecontent'); oFCKeditor.BasePath = "../fckeditor/"; oFCKeditor.Height="400"; oFCKeditor.ToolbarSet="Default"; oFCKeditor.ReplaceTextarea() ; </script> {/if}

Also, change...
Code:
<table cellpadding="3" cellspacing="1">
to...
Code:
<table cellpadding="3" cellspacing="1" width="100%">

8 ) CATEGORIES

In skin1/admin/main/category_modify.tpl

Before...
Code:
</form>
Insert...
Code:
{if $active_modules.FCKEditor ne ""} <script type="text/javascript"> var oFCKeditor = new FCKeditor('description'); oFCKeditor.BasePath = "../fckeditor/"; oFCKeditor.Height="400"; oFCKeditor.ToolbarSet="Default"; oFCKeditor.ReplaceTextarea() ; </script> {/if}

9 ) MANUFACTURERS

In skin1/modules/Manufacturers/manufacturers.tpl

Before...
Code:
</form>
Insert...
Code:
{if $active_modules.FCKEditor ne ""} <script type="text/javascript"> var oFCKeditor = new FCKeditor('descr'); oFCKeditor.BasePath = "../fckeditor/"; oFCKeditor.Height="200"; oFCKeditor.ToolbarSet="Default"; oFCKeditor.ReplaceTextarea() ; </script> {/if}

10) NEWS POSTINGS

In skin1/modules/News_Management/news_messages_modify.tpl

Before...
Code:
</form>
Insert...
Code:
{if $active_modules.FCKEditor ne ""} <script type="text/javascript"> var oFCKeditor = new FCKeditor('message[body]'); oFCKeditor.BasePath = "../fckeditor/"; oFCKeditor.Height="200"; oFCKeditor.ToolbarSet="Default"; oFCKeditor.ReplaceTextarea() ; </script> {/if}

Done.

a) To use just the basic ToolbarSet, in each case change...
Code:
oFCKeditor.ToolbarSet="Default";
to...
Code:
oFCKeditor.ToolbarSet="Basic";

b) You can customise your chosen ToolbarSet, or make your own in fckeditor/fckconfig.js

c) To change the heights of the editors, in each case change...
Code:
oFCKeditor.Height="200";

d) To enable the image upload system...

i) In /fckeditor/editor/filemanager/connectors/php/config.php

Change...
Code:
$Config['Enabled'] = false ;
To...
Code:
$Config['Enabled'] = true ;
ii) Create a new folder in your store root directory call 'userfiles'. Then make it writable, or CHMOD it to 777.

UPDATE: Sept 2009 - FCKEditor has now become CKEditor
__________________
xcartmods.co.uk
Reply With Quote