Before I sat down to write this article, not only did a drink a little Southern Comfort, but I installed the WYSIWYG API version 2.0 from drupal.org, CKEditor version 3.0 from ckeditor.com and applied this patch (for CKEditor support in WYSIWYG API) as well as this small one line change, and this other small one line change. This recipe has given me what I haven't had in quite some time; hope that there was a quick solution to the problem with WYSIWYG editors in Drupal. But enough link porn, here is the real eye-candy!
Now, not only am I writing this blog post in under 20 minutes (start of install to finish of this writing), but I have a rich text edit that works on a CDN in Drupal without so much as breaking a headache. ![]()
Related links:
Comments
This editor is amazing. I've
This editor is amazing. I've never wanted to install a wysiwyg editor because they were ugly, had poor crossbrowser compatibility issues, and were a hog to load. I will now be using this editor as a replacement for all my textareas, it makes any site look fresh and clean.
It's showing fine for me in
It's showing fine for me in FF3.5, Opera, Safari, and Chrome, but the text controls are not showing at all in IE7 at the default Medium-High setting.
Dragging (e.g. resizing
Dragging (e.g. resizing images using image_resize_filter) is still broken in Safari. Pretty annoying.
#
# sirkitree.net-wysiwyg_ckeditor_combo_with_three_patches-2009.09.23.txt
I find myself here having followed a link at planetdrupal..
"CKEditor 3.0 and WYSIWYG API 2.0
Sirkitree - August 22, 2009 - 09:01"
Prior to Drupal, all my sites were static hand coded html / css.
I am more than a little intriqued as I think that my months of doubt and headaches from trying to implement WYSIWYG on Drupal 6 may be over; if I were to follow your five steps.
I want a wyaiwyg editor for my guests, most definitely; and I understand that I can switch to a text only editing mode for myself on an "as needed basis".
But what I really want is to be able to hand code the HTML "on-site", if I find it necessary or desireable, and keep the line-break and spacing system I use intact-- instead of my code being compressed according to someone elses scheme.
It would be nice if I did not have to juggle html files on my system for each page on my site just to keep my preferred spacing format.
Is my dream possible with any combination of Drupal modules / editors that you are aware of; or have ever heard of?
Abandoning for now the hope of ever finding a "leave my text as I had it" solution, I am still looking for an immediate solution to implementing wysiwyg; and I would like to try what you have recommended.
Since you confidently undertook the installation above-- even with SC in hand-- you are Guru status in comparison to me.
: o )
All of my five previous drupal sites have been test sites; abandoned as I "try again"; and my present site is a test site as well.
I will attempt to replicate your suggested installation.
(1.)
Install Wysiwyg module so that, as an example, I have the following file:
my-bluehost-site.com/(drupal_6.13)/sites/all/modules/wysiwyg/wysiwyg.api.php
I am curious if I am correct that I could have-- or please tell me if I should have-- installed it instead so that, as an example, I would have had the following file:
my-bluehost-site.com/(drupal_6.13)/modules/wysiwyg/wysiwyg.api.php
..Or, whether that higher level installation location is, as I understand it, potentially a site-breaker via other module conflicts. ?
I enable the wysiwyg module; and disable the FCKeditor previously installed. And just for good luck, I "uninstall" FCKeditor after un-enabling via the "'Uninstall' tab" page.
Note: I have "Other" modules 'Global Redirect', 'Front Page', IMCE, and poormanscron enabled.
And while I am thinking about FCKeditor, I can not delete the FCKeditor file path from two previous Drupal test installations; and on the most recent, I even "uninstalled" FCKeditor from "Administer" >> "Site Building" >> "Modules": "'Uninstall' tab" after I first un-enabled it. I then unistalled Drupal via cPanel Simple-Scripts; and I then tried to delete the old "Drupal Installation" folder in bulk via cPanel-- but FCKeditor will not die and is the only folder path reamining; and FTP will not kill it either. Any thoughts?
(2.)
Install ckeditor 3.0 so that, as an example, I have the following file:
my-bluehost-site.com/(drupal_6.13)/ckeditor/_samples/index.html
This choice of locations for me I based on information from the ckeditor/INSTALL.html page:
======
"Extract (decompress) the downloaded file into the root of your web site."
...
"For example:
http://www.example.com/ckeditor/_samples/index.html"
======
I am curious if I am correct that this top level folder installation is the required installation location;
..or if I might have installed it deeper with a minimal of, or no, other site code changes;
..or if this is even the proper placement, as I do not remember ever having extracted any non-core Drupal items in the Root.
?
This test is recommended in the ckeditor/INSTALL.html page: ..
my-bluehost-site.com/(drupal_6.13)/ckeditor/_samples/index.html
Do I properly assume that this is Not a true test, but rather is meant to simply be a test of proper file location?
That page displays; and that page links to visions of splendor and happy wysiwyg days: Truly Brain Candy for me; and so I seek Oz further.
"Site configuration" >> "Input Formats": Full HTML: all Filters de-selected.
"Site configuration" >> "Wysiwyg":..
.. This reads, "There are no editor libraries installed currently."
..and that has to be trouble.
Heavy sigh.
3., 4., and 5. Um... So much for my dreams of a quick installation and testing. .lol.
How in the world do I apply these fine pieces of clean code? Answer: http://drupal.org/node/534548.
I'll figure this out, I am relatively sure.
But where above in steps 1 or 2 have I gone wrong?
It is really madening, if you can believe it.
Thanking you ahead of time for any thoughts at all; and thank you for your time.
- Chris
### sirkitree.net-wysiwyg_ckeditor_combo_with_three_patches-2009.09.23.txt
(1) Modules should be
(1) Modules should be installed in {root}/sites/all/modules. For posterity I also split these out into custom and contrib folders so that I have {root}/sites/all/modules/contrib and {root}/sites/all/modules/custom. WYSIWYG API should be placed into {root}/sites/all/modules/contrib/wysiwyg.
(1a) As for FCKEditor not being removed, this is because it is third party software and not actually part of the module you download from drupal.org. Being as such, the modules on drupal.org utilize these third party libraries but do not manipulate them. This means that you not only download them separately but you must delete them manually as well. Module file are not deleted from your server as part of the uninstall process, they are simply disabled.
(2) Read the instructions for WYSIWYG API for where to place the ckeditor files. The part you read which says that "There are no editor libraries installed currently." also tells you where it is expecting the files to be placed: in {root}/sites/all/libraries
where does the ckeditor.inc
where does the ckeditor.inc file come into play? also I am getting an error about /sites/all/modules/wysiwyg/editor/js/ckeditor-3.0.js ... any ideas? I'd love to get CKeditor working... when I enable it I am only getting a blank box where my CKeditor should be, no buttons nothing, even though I've configured/enabled the buttons properly from what I can tell in the wysiwyg API configuration section = admin/settings/wysiwyg/profile.
little help?
thanks for the good document! I am almost there, just missing these last 2 steps...
These are both part of the
These are both part of the patches that must be applied. ckeditor goes in /sites/all/modules/wysiwyg/editors and there should also be a ckeditor-3.0.js file created in /sites/all/modules/wysiwyg/editor/js
Could help for some Download
Could help for some
Download the last file of ckeditor-3.0.js
Drupal thread related (if some want to follow)
Anyway, your post is a great summary!
Thank you for adding these,
Thank you for adding these, I've added them to the post as well.
Looks like the first link I
Looks like the first link I had to the main patch was the wrong link. Fixed.
http://drupal.org/files/issues/wysiwyg-HEAD.ckeditor_0.patch
ohhh, u are da man! thanks so
ohhh, u are da man! thanks so much!! excellent post
How can I apply the patch to
How can I apply the patch to the editor using windows
Read:
Read: http://drupal.org/node/60179
A simple search on drupal.org would have found you this.
Hi: 2009.aug.30. I have
Hi: 2009.aug.30. I have diffilculty with applying the 3 patcjes for CKeditor support. Will you be so kind pto post here the already patched ckeditor.inc and ckeditor.js and please let me know where shoul I put them also what will be a plce for CKeditor libraries or modules Thank you very much John
I've updated the post with
I've updated the post with the related files
THANK YOU VERY MUCH ! for the
THANK YOU VERY MUCH ! for the patched files. It is working nicelyfor CKeditor. However, I learned with great pains over sleepless nights, that only on a fresh, untouched drupal installation is possible to install CKeditor !!! I also would like to use IMCE as a plugin of CKeditor. Will you be so kind to enlighten me, how can I force CKeditor to show IMCE as a plugin. I istalled IMCE as module, and also the imce-wysiwyg module 2009.09.03 Sincerely, John
Actually this site itself is
Actually this site itself is not a fresh install, and I've installed it on other sites that are not fresh install with no problem. So I'm not sure that statement is accurate.
IMCE has not been integrated with CKEditor and the best place to ask about that would be the appropriate issue queues.
great rather cool editor
great
rather cool editor
Trying to figure out how to
Trying to figure out how to have multiple editors in a single page. I get a little closer each day, but am guessing about how to do it. You can see the progress at a test page I'm hacking away at.
I made a SWAG (Scientific Wild Ass Guess) by giving separate names for each 'editor' area in the 'headscript' js which gets them to work in my browser, but they don't "Save" the edits, yet.
I'm hoping someone here will have sympathy for my inept efforts and lead me on the right track to success. Where/what do I configure to get the edits saved back up to the server?
TIA........Ron
I'm not really sure, haven't
I'm not really sure, haven't had to deal with this myself. I think you will get a much better response if you post it to the wysiwyg issue queue instead where you'll get many more eyes on it.
http://drupal.org/project/issues/wysiwyg
We would like to install this
We would like to install this editor on our website. We no longer have the developers that created it... so we are a little afraid to make changes... is there a COMPLETE ... step-by-step instructions on how to do this?
There's still some bugs being
There's still some bugs being worked out in the issue queue, but it's fairly stable. My instructions in teh article are probably the best you can find so far. If you need some help, please feel free to contact me personally by email - sirkitree -[at]- gmail [-dot-] com--
Am I correct in believing
Am I correct in believing that you can't manage file uploads through CKeditor because you need their new commercial file browser?
As far as I know you are
As far as I know you are correct.
Hi, thanks for this info and
Hi, thanks for this info and the already patched files. Not sure what I am doing wrong with this, but WYSIWYG recognizes ckeditor:
CKeditor (Download) 3.0.4148
I set wysiwyg to use it as the editor for one of my input types. When i go to use it, no buttons show at all in FF 3.5 or IE 8. I tested the editor itself by going to /sites/all/libraries/ckeditor/_samples/index.html and everything works great. I have Drupal 6.14 running.
I grabbed the ckeditor.inc and ckeditor-3.0.js from your links above, tried multiple revisions of the files as well.
ckeditor.inc rev 1.2 seems to be the right one for drupal 6?
ckeditor-3.0.js i tried:
1.1.4.1
1.2
1.1
Files are all in correct locations, not sure what else I am doing wrong? Any ideas?
Nope, sorry. Make sure you
Nope, sorry. Make sure you followed the directions I outlined, should be alright.
CKeditor officialy added to
CKeditor officialy added to the dev versions of WYSIWYG today :)