Jump to content
ryan

Module: CKEditor

Recommended Posts

CTRL/ALT+Z seems unreliable for undo. Edit > Undo from the browser menu seems ok still. This doesn't seem to be an issue with TinyMCE. Also, I don't seem to have a problem when using the demo on the CkEditor site, so not sure what the issue is.

I don't think we are changing any defaults in this area, unless Antti can think of anything? But we are using the 4.1 (dev) rather than the 4.0 (stable) version of CKEditor, so maybe that's where the difference comes from. 

The other thing I noticed in the lack of ability to resize an image with the mouse. Seems like this option is not available (at least by default) with CKEditor, which is probably smart given that HTML resizing is a bad idea, but with PW's ability to actually resize the image on the server when resizing in the editor, it seems a shame that CK doesn't have this - can it be enabled?

As far as I know, CKEditor doesn't have that capability. It's possible there may be a CKEditor plugin that provides it though, but I've not seen one yet. 

Share this post


Link to post
Share on other sites

Not changed anything (at least not intentional) regards undo. It might be something that needs to be enabled (plugin? setting?).

Share this post


Link to post
Share on other sites
CTRL/ALT+Z seems unreliable for undo. Edit > Undo from the browser menu seems ok still. This doesn't seem to be an issue with TinyMCE. Also, I don't seem to have a problem when using the demo on the CkEditor site, so not sure what the issue is.

For me CTRL+Z works fine (chrome on windows)

Is there any chance to include custom.css file in inline editor?

Share this post


Link to post
Share on other sites

I can't reproduce the undo problem now either - sorry. I know it happened several times in a row the other day though :)

Share this post


Link to post
Share on other sites

Regarding the image resizing - it looks like CK does support it (works fine in FF), but webkit has a bug that prevents it working. TinyMCE has implemented a workaround for webkit.

Here are some relevant discussions:

http://dev.ckeditor.com/ticket/6668

http://drupal.org/node/1459176

http://www.tinymce.com/forum/viewtopic.php?id=29222

Share this post


Link to post
Share on other sites

On a slight aside...

I am wondering whether TinyMCE should become a /site/ module rather than a wire module - basically so it can be uninstalled, or not installed in the first place.

If someone decides to use CK instead (or any other future RTF system), it seems daft to have tinyMCE still sitting in there.

(Or has this been already discussed and I missed it .... again.)

  • Like 1

Share this post


Link to post
Share on other sites
I have trouble with Iframe button.

Editor saves IFrame placeholder, instead iframe. The final result:


<p><img class="cke_iframe" alt="IFrame" title="IFrame" src="/site/modules/InputfieldCKEditor/ckeditor-4.1.0/plugins/fakeobjects/images/spacer.gif?t=D26E" style="width:600px;height:500px;"><br></p>

Share this post


Link to post
Share on other sites

On a slight aside...

I am wondering whether TinyMCE should become a /site/ module rather than a wire module - basically so it can be uninstalled, or not installed in the first place.

If someone decides to use CK instead (or any other future RTF system), it seems daft to have tinyMCE still sitting in there.

(Or has this been already discussed and I missed it .... again.)

Just wanted to link here: http://processwire.com/talk/topic/2535-inputfieldtinymce-should-be-in-sitemodules/ :)

Share this post


Link to post
Share on other sites
I am wondering whether TinyMCE should become a /site/ module rather than a wire module - basically so it can be uninstalled, or not installed in the first place.

Yes, I think that a lot of modules currently in the core should be removed from the core. But we can't just remove modules from the core because that could break someone's site during an upgrade. So it has to be part of a longer plan that involves a custom-download packager (enabling one to download PW with user-chosen modules included), and tied to a major version where users would be expecting something more to an upgrade process.

I actually think CKEditor's download packager is a pretty good example of what would work well for us. You can browse their plugin directory and click "add to cart" (or something like that) to add any given plugin to your CKEditor download. Then when you "checkout", you are downloading a CKEditor ZIP with all the plugins you wanted, ready-to-go.

  • Like 3

Share this post


Link to post
Share on other sites

Here's how to add your own styles in case someone is wondering. Before doing so, you need to add it into your text field under input, cke editor settings, cke toolbar, and add "Styles". Then you can modify styles.js under "inputfieldCKEditor/ckeditor-4.1.0/styles.js".

Pretty cool. You can add block styling and inline styling. Though the block styling could cause problems with site layout and look if you are not careful.

  • Like 1

Share this post


Link to post
Share on other sites
Here's how to add your own styles in case someone is wondering. Before doing so, you need to add it into your text field under input, cke editor settings, cke toolbar, and add "Styles". Then you can modify styles.js under "inputfieldCKEditor/ckeditor-4.1.0/styles.js".

You probably already know this, but you can also specify a path to your own "contents.css" file. It's basically the same as in TinyMCE, where you would want to copy out the default copy and place it somewhere in your /site/ structure, and then modify it to suit your needs. 

Share this post


Link to post
Share on other sites

Ryan, yes I figured that out. But modifying the content.css file just updates the styling of the editor field. It is helpful for a user to understand what it would look like on the site design.

I wish just modifying the content.css file would also modify the ckeeditor styles sheet. : (

It's kinda a pain to modify the ckeeditor style sheet. But maybe I'm just been a bit lazy.

Share this post


Link to post
Share on other sites

Are there plans to have a different location for a custom version of "inputfieldCKEditor/ckeditor-4.1.0/styles.js"?

Share this post


Link to post
Share on other sites
Are there plans to have a different location for a custom version of "inputfieldCKEditor/ckeditor-4.1.0/styles.js"?

I don't totally understand what that option does, but I've gone ahead and added it. You should see it in the latest commit. 

I wish just modifying the content.css file would also modify the ckeeditor styles sheet. : (
 
So long as you aren't using inline mode, it should allow you to specify the styles?  Though to be honest, I don't use these options myself. I like to keep the client thinking about content and not design when in the editor. So displaying the same styles on the front-and-back end is counterproductive towards that. 

Share this post


Link to post
Share on other sites

Ryan, I don't think styles.js is about matching backend styles to frontend styles - it is about adding site specific "style blocks" with classes. Like

CKEDITOR.stylesSet.add( 'my_styles',
[
    // Block-level styles
    { name : 'Blue Title', element : 'h2', styles : { 'color' : 'Blue' } },
    { name : 'Red Title' , element : 'h3', styles : { 'color' : 'Red' } },
 
    // Inline styles
    { name : 'CSS Style', element : 'span', attributes : { 'class' : 'my_style' } },
    { name : 'Marker: Yellow', element : 'span', styles : { 'background-color' : 'Yellow' } }
]);

http://docs.cksource.com/CKEditor_3.x/Developers_Guide/Styles

  • Like 1

Share this post


Link to post
Share on other sites

I love it how the inline mode looks like in the admin!

I'm still not that sure how this inline thing will work in the backend? Can anyone take a screenshot for me? :)

Share this post


Link to post
Share on other sites

Thanks mate! 

So it just remove all the formatting buttons until clicked on?

Looks nice and clean.

Share this post


Link to post
Share on other sites

That is the end result. Biggest thing though is that it doesn't load those editors until mouseover. So if you have three textfields with five languages, it doesn't have to load 3*5 = 15 editors at page load.

  • Like 1

Share this post


Link to post
Share on other sites

Excited to try this new editor, thanks Ryan, apesia et al who have made it so.

One question, does anyone know if out of the box it has keyboard shortcuts for H2, H3, P etc (as TinyMCE does (I think))?

Edit: OK, so Alt+F10 allows you to access the menu and then cursor/enter to choose a tag (H2 etc). That's a good start.

Edited by alanfluff
  • Like 1

Share this post


Link to post
Share on other sites

Has anybody had issues with the anchor button? For me it just seems to grey out the entire screen and I can't do anything until I refresh the page, which I have to do by clicking refresh as it also disables the keyboard shortcut.

Share this post


Link to post
Share on other sites

Which browser? Clear cache and check what console/firebug or similar says when freezing?

Share this post


Link to post
Share on other sites

Same here, anchor button doesn't work, and it grays the whole screen with no way out other than to exit the page. Tested in the latest Chrome. Doesn't matter whether it's normal or inline mode. No Javascript errors, so not clear about what's going on here. 

Share this post


Link to post
Share on other sites

Hmm.. I am not able to reproduce it (chrome). Latest InputfieldCKeditor and 2.3 stable pw.

Share this post


Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now

  • Recently Browsing   0 members

    No registered users viewing this page.

×
×
  • Create New...