Hey everybody! in a few weeks we're going to be upgrading to the latest version of the CK Editor, which powers the Rich Text Editor (RTE) on our site that allows you to reply to posts.
The new version of the RTE will have two modes. Quick Mode is light and simple, with a streamlined toolbar, and won't interfere with your browser's right-click menu. Advanced Mode will have a fuller set of editing tools, including some new features that have never been in the RTE before. Switching between Quick/Advanced will be easy and instant, and whichever mode you used last will "stick" for you without having to set any preferences. This is an upgrade to the Rich Text Editor only. Aside from a minor facelift of the toolbar icons, the BBCode Editor will not be affected.
A little backstory...
What is CK Editor, you may ask? Well, it's a third-party product which we license and embed in the page to give users rich WYSIWYG content editing capabilities. It's what I used to type this post, and it's what you'll probably use to type your reply. With the exception of BBCode users, CK Editor is the window through which all incoming new content, the lifeblood of our businesses, is created.
Why do we use a third-party editor? Put simply: it's a case of not reinventing the wheel. We use many 3rd party products to power BYC. We didn't write our own web server: we use Apache. We didn't create our own database software: we use PostgreSQL. Similarly, we have not written our own WYSIWYG editor from the ground up: we use CK Editor.
Creating a WYSIWYG editing experience inside a web browser is a difficult task, and keeping it working in all browsers is even more work. Various teams have produced quality editors over the years: you may have used or heard of TinyMCE or some others. CK has been around over 10 years, and we originally chose it because it offered the most functionality, including things like WYSIWYG table building and a plug-in architecture.
About that right-click menu...
As a third-party product, we don't have absolute control over all of CK's behaviors and characteristics. One of the more disliked is the way CK intercepts right-clicks from the user's mouse and surfaces its own context menu instead of the browser's menu. Users frequently report frustration with this because it prevents them from using their browser's inline spellchechecker.
Every single one of us has been here:
Here's what the Editor will look like in Quick Mode. We removed the right click menu and the advanced functionality that's tied to it, like tables, leaving only the main functions users employ frequently:
You probably clenched your teeth a little when you saw the above mockup, right? What about spoilers? What about strikethrough? What about html source mode??? Well, look closely at the mockup above and you'll notice a downward-pointing carat at top right.
Users can use this to switch to "advanced mode" (see below) when they want to do something fancy like edit a table or attach a file.
"Advanced Mode" WILL have the CK right-click menu. That menu needs to live somewhere so that users working with tables will have access to it when needed. That's the trade off here.
Users can switch between Quick & Advanced modes. Switching modes will be nearly instantaneous. And you will not lose the content you're drafting when switching modes! Also, whatever mode you choose will stick and follow you as a user preference.
Here's a mockup of what "Advanced Mode" will look like:
In Summary
Let's break down which functions would be available in which mode. I'll compare Quick and Advanced modes to the CK editor we have today. This should give you a pretty good picture of this proposal.
Text Format (H1, etc)
Text Size
Text Color
Bold, Italic, Underline
Strikethrough
Subscript / Superscript
Remove Text Styles
Link / Unlink
Anchor
Bulleted / # Lists
+ / - List Level
Justification options
Insert Image
Insert Video
Insert Table
Insert Horizontal Rule
Insert Special Character
Insert Smiley
Insert Quote Block
Insert Attachment
Insert Spoiler
Cut/Copy/Paste
Paste as Plain Text
Paste from MS Word
Undo / Redo
Find Text
Find / Replace Text
Maximize Editor
Again, these changes to the editor won't happen for a few weeks, but we wanted to give everyone a head's-up well in advance!
The new version of the RTE will have two modes. Quick Mode is light and simple, with a streamlined toolbar, and won't interfere with your browser's right-click menu. Advanced Mode will have a fuller set of editing tools, including some new features that have never been in the RTE before. Switching between Quick/Advanced will be easy and instant, and whichever mode you used last will "stick" for you without having to set any preferences. This is an upgrade to the Rich Text Editor only. Aside from a minor facelift of the toolbar icons, the BBCode Editor will not be affected.
A little backstory...
What is CK Editor, you may ask? Well, it's a third-party product which we license and embed in the page to give users rich WYSIWYG content editing capabilities. It's what I used to type this post, and it's what you'll probably use to type your reply. With the exception of BBCode users, CK Editor is the window through which all incoming new content, the lifeblood of our businesses, is created.
Why do we use a third-party editor? Put simply: it's a case of not reinventing the wheel. We use many 3rd party products to power BYC. We didn't write our own web server: we use Apache. We didn't create our own database software: we use PostgreSQL. Similarly, we have not written our own WYSIWYG editor from the ground up: we use CK Editor.
Creating a WYSIWYG editing experience inside a web browser is a difficult task, and keeping it working in all browsers is even more work. Various teams have produced quality editors over the years: you may have used or heard of TinyMCE or some others. CK has been around over 10 years, and we originally chose it because it offered the most functionality, including things like WYSIWYG table building and a plug-in architecture.
About that right-click menu...
As a third-party product, we don't have absolute control over all of CK's behaviors and characteristics. One of the more disliked is the way CK intercepts right-clicks from the user's mouse and surfaces its own context menu instead of the browser's menu. Users frequently report frustration with this because it prevents them from using their browser's inline spellchechecker.
Every single one of us has been here:
Here's what the Editor will look like in Quick Mode. We removed the right click menu and the advanced functionality that's tied to it, like tables, leaving only the main functions users employ frequently:
You probably clenched your teeth a little when you saw the above mockup, right? What about spoilers? What about strikethrough? What about html source mode??? Well, look closely at the mockup above and you'll notice a downward-pointing carat at top right.
Users can use this to switch to "advanced mode" (see below) when they want to do something fancy like edit a table or attach a file.
"Advanced Mode" WILL have the CK right-click menu. That menu needs to live somewhere so that users working with tables will have access to it when needed. That's the trade off here.
Users can switch between Quick & Advanced modes. Switching modes will be nearly instantaneous. And you will not lose the content you're drafting when switching modes! Also, whatever mode you choose will stick and follow you as a user preference.
Here's a mockup of what "Advanced Mode" will look like:
In Summary
Let's break down which functions would be available in which mode. I'll compare Quick and Advanced modes to the CK editor we have today. This should give you a pretty good picture of this proposal.
Quick Mode
Today's CK Editor
Advanced Mode
CK Right-Click Menu NO
YES
YES
Source Mode
Again, these changes to the editor won't happen for a few weeks, but we wanted to give everyone a head's-up well in advance!
Last edited:
