WYSIWYG editor alternative

[Anonymous]

Hello,

is there a way to install tinymce or spaw editor instead of htmlarea - I'm not really happy with htmlarea.

I would appreciate if somebody could come up with a plugin or module that would allow to choose some alternate editors.

Thank you in advance for your help.

[Ryan]

At the moment no, but I am plan to make a feature for WB 3.x.x which allows the end user to chose whichever WYSIWYG editor they want from a drop-down box.
Otherwise, you or someone else will have to create a module themselves.

[Argos]

I just visited the HTMLArea site, and it says:

Code:

htmlarea 2 and 3 have been discontinued. They were free wysiwyg editors that were distributed on this site. Visit the directory to find similar products.

The site is changing into a editor directory...

[Ryan]

Well, for WebsiteBaker 3.x, I will consider not using HTMLArea as the default editor.

[Anonymous]

Good to hear you're considering another WYSIWYG - HTMLArea isn't good for producing XHTML / CSS output.

http://www.fckeditor.net would get my vote as a replacement.

[Ryan]

A long while back (2.0.x?), FCKEditor was the editor of choice. I change from HTMLArea (in 1.x), to FCKEditor because it looked alright, but I had many problems modding it so we could have fancy things like the current insert image/link dialogs. FCKEditor will definetely be considered.

[nick5000]

Hi,
I've been looking around for an easy-to-use cms for a long time, and I think WebsiteBaker is excellent. In my search, I've found the SPAW editor to be the best. I especially like the ability to upload images directly from the editor. I think that SPAW should be included in the next release.

Nick

[sucresemoule]

The HTMLArea project has been discontinued but Xinha is based on the last version  :

http://xinha.python-hosting.com/

I like Spaw too.

[dragontiger]

can you add to RTE list for WB this great editor:

TinyMCE
http://tinymce.moxiecode.com/

Best,
Adam

P.S.
oops... listed
https://www.websitebaker.org/forum/viewtopic.php?t=657&highlight=tinymce

[Attila]

I am very happy with htmlarea! Of course a choise of editors would be great. So everybody could use his preferred editor.

UPDATE: After playing around with FCKeditor I like FCK much more...

--  Dave

[lupin]

TimyMCE is a great editor and can parse CSS files, which is an important feature IMHO. Usually a template has an HTML file (PHP), a CSS file and some other stuff. The editor should be set up to parse the CSS file of the template that will be used for the page being edited, so one can apply CSS classes on the fly to the page text. This allows the site admin to force editors to comply with the general site look&feel.

[evets]

I just installed WebsiteBaker and it looks very promising!

It might be nice if you could have multiple WYSIWYG editors installed at the same time and pick the editor on a page by page basis.  I'm not sure I would want to pick just one editor for all my pages.   Also, if I had multiple users, each might have a different preference in editors.

For grins, I took the current WYSIWYG module and changed internal references from 'wysiwyg' to 'htmlarea' to create a HTMLArea module.  

I also created modules for raw HTML, Markdown, and Textile based on the Code module.

The main problem I see with this, is that each module stores content in a different database table,  and you can't change the page type after it's created.

[Stefan]

Choice of WYSIWYG editor and in general customization features of the backend are planned for 3.x.

[Woudloper]

As I also would like to work with another RTF Editor, I tried out how to implement the FCKEditor. FCKEditor does support a PHP based version, but I also used the javascript implementation (as Ryan also did this with HTMLArea) in-stead-of the PHP integration.

The following steps can be performed in order to make FCK Editor available as your RTF Editor:[list=1]

• Download the FCK Editor
  
• Unzip FCK Editor (remove all folders starting with an underscore (_)) into the include folder of 'websitebaker'. I have named the folder 'fck'
  
• Open the file modify.php which is located in the folder:
  modules\wysiwyg
  
• Replace some of the code located behind the following comment Load HTMLArea
  
  Code:
  if(!isset($loaded_htmlarea)) {
  
  // Workout how many WYSIWYG sections are used on this page
  $query_wysiwyg_sections = $database->query("SELECT section_id,module FROM ".TABLE_PREFIX."sections WHERE page_id = '$page_id' AND module = 'wysiwyg' ORDER BY position ASC");
  $num_wysiwyg_sections = $query_wysiwyg_sections->numRows();
  
  echo  '<script type="text/javascript" src="'.WB_URL.'/include/fck/fckeditor.js"></script>'
  . '<script type="text/javascript">'
     . 'function initEditor() {';
  
  
  $query_wysiwyg = $database->query("SELECT section_id FROM ".TABLE_PREFIX."sections WHERE page_id = '$page_id' AND module = 'wysiwyg'");
  if($query_wysiwyg->numRows() > 0) {
  while($wysiwyg_section = $query_wysiwyg->fetchRow()) {
  echo  'var editor = new FCKeditor("content'.$wysiwyg_section["section_id"].'");'
  . 'editor.BasePath = "'.WB_URL.'/include/fck/";'
  . 'editor.ToolbarSet = "Default";'
  . 'editor.ReplaceTextarea();';
  }
  }
  
  echo '} </script>';
• Navigate to the admin console and modify or create a new 'wysiwyg' page[/list:o]
  
  As you can see everything is working correctly now. The thing you should do in order to completely get it working correctly is to create a toolbar of your own as the default FCK Editor toolbar has (in my humble opinion) to many options.
  
  The toolbar can be changed with some help of the documentation that is provided together with the .zip file or you can take a look at the FCK Editor forum.
  
  Hope this is helpfull for some of you...

[bowenmark]

 sweet

that worked very well, thanks!

(me off to the fck site to tweak now

[Ryan]

The main problem I see with this, is that each module stores content in a different database table,  and you can't change the page type after it's created.

- Actually, to change the page type, just add a new section using the different module, copy the contents from one section to the other, then delete the old section.

[ruebenwurzel]

Great, FCKEditor works fine. The generated code seems to be better then from htmlarea.

But what Ryan posted at Mar 14 is now my problem. If current insert image/link dialogs couldn't be integrated, or the path to current media folders could not be integrated, i change back to htmlarea. Maybe someone knows how to configure this in FCKEditor.

[bowenmark]

I got the editor working okay last night, same problem thing with images tho'. Couple other gotchas, on *nix without ASP support, you will need to use the php connectors.

Comment the asp lines at 95 and 103 and uncomment the php lines for ImageBrowser and LinkBrowser in fckconfig.js.

For images, if it's a new site you could (at the root) add two directories:
UserFiles/Image to match the default fck set-up.

I have a site already set up tho that I don't want to copy the images to fck's default so am working on it. Anyone else?

So far this is what I have that isn't working yet, must be one more variable to change somewhere...

I added &ServerPath=/media to fckconfig.js:
FCKConfig.ImageBrow serURL = FCKConfig.BasePath +

Code:

'filemanager/browser/default/browser.html?Type=Image&Connector=connectors/php/connector.php&ServerPath=/media' ;

Also changed in include/fck/editor/filemanager/default/connectors/php/connector.php line 29:

Code:

$GLOBALS["UserFilesPath"] = '/media' ;

but still no joy...

btw, fck generated code plays much nicer with css positioned pages

[Woudloper]

Have one of you tried to take a look at the 'connectors tester' that is available within FCK Editor? There you can test the different connector types and modify the location where the files will be stored, see:

http://localhost/wb/include/fck/editor/filemanager/browser/default/connectors/test.html

If you change the path to you own server you can test the connections for yourselve.

Furthermore you can take a look at this google cached page in which someone explains how to get FCK Editor working in-stead-of TinyMCE (on Etomite).

I myself will look into this not before the end of next week (as I have a funeral in the beginning of the week). If someone else finds a solution how to get the Image Browsers (from server) working I hope to see a reply. Yesterday I tested the 'connection testers' provide by FCK Editor and that was working correctly, so getting in to work with the config files should also work!

[bowenmark]

cool, will try this out in the afternoon when I get back from my 'day' job at the other marina, txs!

[Woudloper]

cool, will try this out in the afternoon when I get back from my 'day' job at the other marina, txs!

I have just taken a look, but after half an hour I still was not able to find a solution. The strange thing though is that with the 'connector tester' it all is working perfect.

Maybe a search within the FCK Editor forum (with the keywords: image browser, connectors php, browse images, etc) will result in a solution. According to me it should work easily (as the test suite also works), but it is just a matter of the correct parameters.

If someone has the solution I really would like to see the answer here, so I can adjust my code.

I am mainly testing the website under Firefox, so I thought it had to do with some security settings, but that's not the case. Even the script is not working within Internet Explorer. Within the Firefox debugger, it mentions the following:

Error: this.DOMDocument has no properties
Source File: http://127.0.0.1/wb/include/fck/editor/filemanager/browser/default/js/fckxml.js
Line: 102

[bowenmark]

This is what I've found so far after playing with fck for a couple hours this afternoon, btw a DOM with no properties was helpful, txs The real bestest help was the test.html file in connectors.

WSB and FCK treat media in different ways within their own framework. Ryan has basically the same idea to browse and create URI's: a seperate window from the admin main page that reads the directories and spits out a list of file names, click and it pastes to your form for submit etc.

It's where the uploads are, things get different. The basics are the same, but FCK has four directories within it's default UserFiles folder, (you can rename UserFiles to media easy enough, but you may want to do it the other way around). The appy seperates the types of upload-able content into 'File','Image','Flash','Media' that also get used as names for directories in Userfiles, which is part of an array called ResourceType...

that's what I was looking for -

So... decision time for me... pardon my ramble...

it would be just as easy to call the media file at install time 'UserFiles' and do almost nothing except comment/uncomment the fckconfig.js at lines 95,97,103,104/98,106 for an asp/php install. Also needed to be done is change in fckeditor.js/fckeditor.php the properties of this.Height/$this->Height to at least 400 to make the editor window a decent size. Also in the php version, change $this->BasePath to '/include/fck/' ; if you've renamed the editor file when uploading to fck.

Now comes the hard part... retro fitting existing sites and keeping the same web page file name/structure is turning out to be pretty dang easy with WSB. In my experience, most clients really don't care about the URI's, as long as the menu is the same as before and they go to the same page. I always use a Permanent301 redirect for anything that isn't so it's seamless in their eyes.

The additional functionality of uploading other media types is too good to pass up for new sites, and as I've only got a few live WSB sites going, (they are small brochure-webs) it's going to be just as easy to upload the existing images to the new fck folders and leave the images in the 'old' media folder there for pages that have already been created. A small duplication me willing to take for small sites.

imho, it's going to be a real pita retro-fitting existing sites with fck as an editor in it's full functionality, unless the client doesn't care where media is stored, (most don't). If you do, there's a lot of references to that ResourceType array in the code, that's where you need to start (a lot of!) modding but it's really not worth it if you have a good rapport with your client.

[Woudloper]

After a night sleep I found the solution and even thought why didn't I do this earlier.

Open the file 'config.php' which is located in the PHP connector directory and do what the comment says:

Code:

// Path to user files relative to the document root.
// SECURITY TIP: Uncomment the following line to set a fixed path.
$Config['UserFilesPath'] = '/wb/media/' ;

When I did this all seems to work correctly now and I can browse the media/image folder. I need to analyse why this is working correctly now and that it is not working with the 'ServerPath' configuration.

It looks like it has to do with the following code within the 'connector.php' file:

Code:

// Get the "UserFiles" path.
$GLOBALS["UserFilesPath"] = '' ;

if ( isset( $Config['UserFilesPath'] ) )
$GLOBALS["UserFilesPath"] = $Config['UserFilesPath'] ;
else if ( isset( $_GET['ServerPath'] ) )
$GLOBALS["UserFilesPath"] = $_GET['ServerPath'] ;
else
$GLOBALS["UserFilesPath"] = '/UserFiles/' ;

if ( ! ereg( '/$', $GLOBALS["UserFilesPath"] ) )
$GLOBALS["UserFilesPath"] .= '/' ;

[widlund]

I also use FCKeditor with WB and have experienced the same problem. FCK is great apart from the filemanager. I solved the problem getting FCK to use the media directory, but the problem now is that the filemanager shows all files in the media directory including index.php. I would like it to show only a few specified file types. Any ideas how this can be done?

I have made a module out of FCK. Feel free to try it out, though its not been thoroughly tested yet.  
http://www.lysator.liu.se/~widlund/fckeditor.zip

[ruebenwurzel]

wow, this is a great modul. I tried it and all seems to work fine. So everyone can now choose between htmlarea an fckeditor as wysiwyg-editor.

Media folder is now integrated, but what about the link integration for internal links? If this is integrated too, fckeditor schould be the default-wysiwyg-editor.

Very good work, WB seems to get one of the best an simplest CMS. Keep Rockin.