CKEditor 4
Fri, 02/26/2010 - 11:06
#1
rapha
rapha's picture
Joined: 24/02/2010
Posts: 5

How to "look into" CKEditor?

Hi,

I'm trying to write a new style (by changing things in the `v2' style to find out how things work), but it's generally a very cumbersome and unpleasant experience as I seem to be unable to find a way to "look into" the HTML produced by CKEditor in the browser.

For example, I apply some styles to "iframe" and not only the editing area but also the context menu changes. So I open Firebug and try to look at the context menu, but as soon as I click at something Firebug, the context menu closes again and that's that.

Looking for documentation, I've stumbled over http://docs.cksource.com/CKEditor_3.x/Developers_Guide where unfortunately the section on Skins hasn't been written yet; searching the forum doesn' t really turn up anything useful either...

So how does everybody do it? :-)

Thanks,
Raphael

Top
Fri, 02/26/2010 - 15:36
alfonsoml
alfonsoml's picture
Joined: 31/12/2006
Posts: 3737

Re: How to "look into" CKEditor?

After opening the context menu, the element will be available in the body of the page, but with display:none, so you just toggle that and look at the elements of the menu
Top
Fri, 02/26/2010 - 16:35
rapha
rapha's picture
Joined: 24/02/2010
Posts: 5

Re: How to "look into" CKEditor?

Thanks for the reply alfonsoml ... that was just meant as an example. I was more looking for info on the "global scale" ... from reading your comment I take it that indeed FireBug is the tool of choice for you. Is there anything else people use?
Top
Fri, 02/26/2010 - 17:08
alfonsoml
alfonsoml's picture
Joined: 31/12/2006
Posts: 3737

Re: How to "look into" CKEditor?

Each browser has its own version of this tool and except Firefox you can find them under a "Developer tools" menu.

If you want a step-by-step guide about how to write your own skin for CKEditor, then I can only suggest to pick one of the provided ones and start changing it. Of course, if you document that process and provide it to help other people that would be great.
Top
Fri, 03/05/2010 - 11:56
rapha
rapha's picture
Joined: 24/02/2010
Posts: 5

Re: How to "look into" CKEditor?

Alfonsoml,

thanks for clarifying. I've now learned that what Firebug shows is indeed reliable, and you just need to show some perseverance in finding what you're looking for. One problem I did have was that sometimes I tried to change the looks of something in the skin files, where I should have been changing it in the content.css file.

Regards,
Raphael
Top
Twitter Facebook Facebook Instagram Medium Linkedin GitHub Arrow down Phone Menu Close icon Check