The document outlines the required and good-to-have functions for a CK Editor including basic formatting tools like cut, copy, paste as well as more advanced options like undo/redo history, spell check, lists, alignments, links, and inserting images, tables, and other elements. It also discusses the need for toolbars to group these functions and enable/disable buttons, modal states for inline editors, and custom styles.

1. Email CK Editor
Design & Layout

2. Preview Email Send Test Mail

3. CK Editor Properties
• Scrolling with the content area in Fixed point state.
• The editor should have Enabling and Disabling of Buttons
including the selections in the content
• Inline Editor is Usable when it is in Modal state for the user, so
it requires an explicit Save and Cancel buttons for Editor state.
• In modal state the remaining area of the template is not
clickable and is out of focus (bg - dark & low opacity).
• Control properties like Redo, Undo (History - last 5 actions)
are imp to work with content editing.
• Grouping of Buttons on basis of Toolbar.

4. Editing with CK Editor

5. Preview Email Send Test Mail

6. Editor Functions
Required:
Cut-Copy-Paste
Paste as Plain text/Word
Undo-Redo
Spell check
B I U S
List Ordered/Bulleted
Indentation (Left/Right)
Block Quotes
Alignments (L/R/C/J)
Link-Unlink-Anchor
Good to have:
Block Preview
Print
Undo (Last 5 history)
Search
Find and Replace
Select ALL
Form Toolbar
Subscript-Superscript
Insert iframe (video compliant clients)
Show Blocks
Full Screen
Show Blocks | Show Source code
Inserter Toolbar
• Image
• Link
• Table
• Div Container (Goes
nested)
• Spacers (Blanks)
• Dividers (! Page breaks)
• Emoticons (Encoded)
• Special Characters
Styles drop-down (Grouped buttons)
Font Toolbar
• Font family
• Font size
• Font Color
• Text background
Save Custom styles (Apply styles)
Clear block styles
Magic Line*
Table Re-Sizer (Re-sizing attributes)
Data tags inserter
• Email Address
• Fname/Lname
• Salutation etc.

7. Grouping
Basic
Toolbar
Inserter
Toolbar
Font
Toolbar
Misc
Toolbar
Code/Visual Controls
Cut
Copy
Paste
Image
Table
Div
Font family
Font size
Font Colour
TextBG
Link
Unlink
Anchor
Source Save
Blocks Cancel
Paste Text
Paste Word
Preview
Email
Redo
Undo
Spacer
Dividers
Spell check
Black Quote
Left indent
Right indent
Alignment
L-R-C-J
B I U S
Emoticons
Sp. Char

8. Customized CK Editor
Controls
Code/Visual
Font bar Text bar
Insert barBasic tools
* A collapsible advanced editor with more functionality can be done in future releases.
Use of styles/customs in
Font drop down can be a
usable feature