Quick Reference"

This website contains links to software which is either no longer maintained or will be supported only until the end of 2019 (CKFinder 2). For the latest documentation about current CKSource projects, including software like CKEditor 4/CKEditor 5, CKFinder 3, Cloud Services, Letters, Accessibility Checker, please visit the new documentation website.

If you look for an information about very old versions of CKEditor, FCKeditor and CKFinder check also the CKEditor forum, which was closed in 2015. If not, please head to StackOverflow for support.

(Image replacement, tooltips added)
(Missing dots added)
 
(23 intermediate revisions by the same user not shown)
Line 1: Line 1:
−
This section describes all functions available in the default CKEditor’s toolbar ([[Media:CKEditor_Toolbar.pdf|download as pdf]]).
+
__TOC__
−
 
+
Below you will find an overview of all features available in the default CKEditor [[CKEditor 3.x/Users Guide/Interface/Toolbar|toolbar]].
−
 
 
−
== Common Toolbar Functions  ==
 
  
 +
== Working with a Document ==
 
{| cellspacing="0" cellpadding="3" border="1"
 
{| cellspacing="0" cellpadding="3" border="1"
 
|-
 
|-
−
| nowrap="nowrap" align="center" | '''Toolbar Element'''<br>
+
| width="120px" nowrap="nowrap" align="center" | '''Toolbar Button'''
−
| '''Function'''
+
| '''Description'''
 
|-
 
|-
−
| align="center" | [[Image:CKEditor_source.png|Source]]<br>
+
| align="center" | [[Image:CKEditor_source.png|Source]]  
−
| View or edit the document source code (for advanced users). See [[CKEditor 3.x/Users Guide/Source Editor|Source Editor]].<br>
+
| View or edit the source code of the document (for advanced users). See [[CKEditor 3.x/Users Guide/Document/Source|Document Source]].
 
|-
 
|-
 
| align="center" | [[Image:CKEditor_save.png|Save]]  
 
| align="center" | [[Image:CKEditor_save.png|Save]]  
−
| Saves the page you were editing.
+
| Save the contents of CKEditor and submit its data to the server, when CKEditor is placed inside an HTML form. See [[CKEditor 3.x/Users Guide/Document/Save|Saving Content]].
 
|-
 
|-
 
| align="center" | [[Image:CKEditor_new.png|New Page]]  
 
| align="center" | [[Image:CKEditor_new.png|New Page]]  
−
| Removes all contentes, creating a new blank page.
+
| Clear the editing area and create a new page. See [[CKEditor 3.x/Users Guide/Document/New|Creating a New Page]].
 +
|-
 +
| align="center" | [[Image:CKEditor_preview.png|Preview]]
 +
| Show a preview of the document in the shape that will be displayed to end users. See [[CKEditor 3.x/Users Guide/Document/Preview|Document Preview]].
 +
|-
 +
| align="center" | [[Image:CKEditor_templates.png|Templates]]
 +
| Select a layout template. See [[CKEditor_3.x/Users Guide/Document/Templates|Templates]].
 +
|-
 +
| align="center" | [[Image:CKEditor_cut.png|Cut]]
 +
| Cut the selected text fragment to the clipboard. See [[CKEditor_3.x/Users Guide/Document/Cut, Copy and Paste#Cut|Cut]].
 +
|-
 +
| align="center" | [[Image:CKEditor_copy.png|Copy]]
 +
| Copy the selected text fragment to the clipboard. See [[CKEditor_3.x/Users Guide/Document/Cut, Copy and Paste#Copy|Copy]].
 +
|-
 +
| align="center" | [[Image:CKEditor_paste.png|Paste]]
 +
| Paste content copied to the clipboard along with formatting. See [[CKEditor 3.x/Users Guide/Document/Cut, Copy and Paste#Paste|Paste]].
 +
|-
 +
| align="center" | [[Image:CKEditor_paste_text.png|Paste as plain text]]
 +
| Paste content copied to the clipboard without formatting. See [[CKEditor 3.x/Users Guide/Document/Cut, Copy and Paste#Paste as Plain Text|Paste as Plain Text]].
 +
|-
 +
| align="center" | [[Image:CKEditor_paste_word.png|Paste from Word]]
 +
| Paste content copied from Microsoft Word or similar applications along with formatting. See [[CKEditor 3.x/Users Guide/Document/Cut, Copy and Paste#Paste from Word|Paste from Word]].
 +
|-
 +
| align="center" | [[Image:CKEditor_print.png|Print]]
 +
| Print document contents. See [[CKEditor_3.x/Users Guide/Document/Printing|Printing]].
 
|-
 
|-
−
| align="center" | [[Image:CKEditor_preview.png|Preview]]<br>
+
| align="center" | [[Image:CKEditor_pagebreak.png|Insert Page Break for Printing]]  
−
| Preview what the HTML page will look like for users.<br>
+
| Insert a page break. This only impacts the printed version. See [[CKEditor_3.x/Users Guide/Document/Printing#Page_Breaks|Page Breaks]].
 
|-
 
|-
−
| align="center" | [[Image:CKEditor_templates.png|Templates]]<br>
+
| align="center" | [[Image:CKEditor_spellcheck.png|Check Spelling]] [[Image:CKEditor_SCAYT.png|Spell Check As You Type]]
−
| Select a layout template. See [[CKEditor_3.x/Users Guide/Common Tasks/Templates|Templates]]<br>
+
| Check spelling of the document text or turn on the Spell Check As You Type (SCAYT) feature. See [[CKEditor_3.x/Users Guide/Spell Checking|Spell Checking]].
 
|-
 
|-
−
| align="center" | [[Image:CKEditor_cut.png|Cut]]<br>
+
| align="center" | [[Image:CKEditor_undo.png|Undo]] [[Image:CKEditor_redo.png|Redo]]
−
| Cut the highlighted text to the clipboard. See [[CKEditor_3.x/Users Guide/Common Tasks/Cut, Copy and Paste|Cut, Copy and Paste]].<br>
+
| Undo or redo the most recent action performed. See [[CKEditor_3.x/Users Guide/Document/Undo and Redo|Undo and Redo]].
 
|-
 
|-
−
| align="center" | [[Image:CKEditor_copy.png|Copy]]<br>
+
| align="center" | [[Image:CKEditor_find.png|Find]]
−
| Copy the highlighted text to the clipboard. See [[CKEditor_3.x/Users Guide/Common Tasks/Cut, Copy and Paste|Cut, Copy and Paste]]. <br>
+
| Find a word or phrase in the document. See [[CKEditor_3.x/Users Guide/Document/Find and Replace#Find|Find]].
 
|-
 
|-
−
| align="center" | [[Image:CKEditor_paste.png|Paste]] [[Image:CKEditor_paste_text.png|Paste as plain text]]<br>
+
| align="center" | [[Image:CKEditor_find_replace.png|Replace]]
−
| Paste the data copied to the clipboard (with or without formatting). See [[CKEditor_3.x/Users Guide/Common Tasks/Cut, Copy and Paste|Cut, Copy and Paste]].<br>
+
| Find and replace a word or phrase in the document. See [[CKEditor_3.x/Users Guide/Document/Find and Replace#Replace|Replace]].
 
|-
 
|-
−
| align="center" | [[Image:CKEditor_paste_word.png|Paste from Word]]<br>
+
| align="center" | [[Image:CKEditor_selectall.png|Select All]]
−
| Paste content copied from Microsoft Word or similar applications. See [[CKEditor_3.x/Users Guide/Common Tasks/Cut, Copy and Paste|Cut, Copy and Paste]]. <br>
+
| Select all contents of the document. See [[CKEditor_3.x/Users Guide/Document/Selecting|Text Selection]].
 
|-
 
|-
−
| align="center" | [[Image:CKEditor_print.png|Print]]<br>
+
| align="center" | [[Image:CKEditor_remove_format.png|Remove Format]]  
−
| Print the current document. See [[CKEditor_3.x/Users Guide/Other Tasks/Printing|Printing]]. <br>
+
| Remove the formatting of the selected text. See [[CKEditor_3.x/Users Guide/Document/Remove Format|Remove Format]].
 
|-
 
|-
−
| align="center" | [[Image:CKEditor_spellcheck.png|Check Spelling]] [[Image:CKEditor_SCAYT.png]]<br>
+
| align="center" | [[Image:CKEditor_maximize.png|Maximize]]  
−
| Spell check the text in the document or spell check the text as you type. See [[CKEditor_3.x/Users Guide/Other Tasks/Spell Checking|Spell Checking]].<br>
+
| Maximize the editor in the browser window. See [[CKEditor 3.x/Users Guide/Interface#Resizing and Maximizing CKEditor|Resizing and Maximizing CKEditor]].
 +
|-
 +
| align="center" | [[Image:CKEditor_blocks.png|Show Blocks]]  
 +
| Highlight all block-level elements in the document. See [[CKEditor_3.x/Users Guide/Document/Blocks|Show Blocks]].
 +
|-
 +
| align="center" | [[Image:CKEditor_about.png|About CKEditor]]
 +
| Show information about CKEditor. See [[CKEditor 3.x/Users Guide/Introduction#CKEditor_Version|CKEditor Version]].
 +
|}
  
 +
== Text Styling ==
 +
{| cellspacing="0" cellpadding="3" border="1"
 
|-
 
|-
−
| align="center" | [[Image:CKEditor_undo.png|Undo]] [[Image:CKEditor_redo.png|Redo]]<br>
+
| width="120px" nowrap="nowrap" align="center" | '''Toolbar Button'''
−
| Undo or redo the most recent action taken. See [[CKEditor_3.x/Users Guide/Other Tasks/Undo and Redo|Undo and Redo]].<br>
+
| '''Description'''
 
|-
 
|-
−
| align="center" | [[Image:CKEditor_find.png|Find]]<br>  
+
| align="center" | [[Image:CKEditor_bold.png|Bold]] [[Image:CKEditor_italic.png|Italic]] [[Image:CKEditor_underline.png|Underline]] [[Image:CKEditor_strikethrough.png|Strike Through]]
−
| Find a word or phrase within the document. See [[CKEditor_3.x/Users Guide/Other Tasks/Find and Replace|Find and Replace]].<br>
+
| Apply '''bold''', ''italic'', <ins>underline</ins> or <strike>strike-through</strike> formatting to the text. See [[CKEditor_3.x/Users Guide/Styling/Bold, Italic, Underline, and Strike-through|Bold, Italic, Underline, and Strike-through]].
 
|-
 
|-
−
| align="center" | [[Image:CKEditor_find_replace.png|Replace]]<br>
+
| align="center" | [[Image:CKEditor_subscript.png|Subscript]] [[Image:CKEditor_superscript.png|Superscript]]
−
| Find and replace a word or phrase within the document. See [[CKEditor_3.x/Users Guide/Other Tasks/Find and Replace|Find and Replace]].<br>
+
| Apply superscript or subscript formatting to the text. See [[CKEditor 3.x/Users Guide/Styling/Subscript and Superscript|Subscript and Superscript]].
 
|-
 
|-
−
| align="center" | [[Image:CKEditor_selectall.png|Select All]]<br>
+
| align="center" | [[Image:CKEditor_styles.png|Formatting Styles]]  
−
| Select the entire content in the document.<br>
+
| Apply pre-defined combinations of various formatting options to block and inline elements. See [[CKEditor_3.x/Users Guide/Styling/Styles|Formatting Styles]].
 
|-
 
|-
−
| align="center" | [[Image:CKEditor_remove_format.png|Remove Format]]<br>
+
| align="center" | [[Image:CKEditor_paragraphformat.png|Paragraph Format]]  
−
| Remove the formatting from the highlighted text.<br>
+
| Apply pre-defined block-level combinations of various formatting options. See [[CKEditor_3.x/Users Guide/Styling/Format|Paragraph Format]].
 
|-
 
|-
−
| align="center" | [[Image:CKEditor_bold.png|Bold]] [[Image:CKEditor_italic.png|Italic]] [[Image:CKEditor_underline.png|Underline]] [[Image:CKEditor_strikethrough.png|Strike Through]]<br>
+
| align="center" | [[Image:CKEditor_font.png|Font Name]]  
−
| Applies '''bold''', ''italic'', <u>underscore</u> or <strike>strikethrough</strike> formatting to the highlighted text.See [[CKEditor_3.x/Users Guide/Common Tasks/Text Formatting|Text Formatting]].<br>
+
| Change the typeface of the text. See [[CKEditor 3.x/Users Guide/Styling/Font|Font Name]].
 
|-
 
|-
−
| align="center" | [[Image:CKEditor_subscript.png|Subscript]] [[Image:CKEditor_superscript.png|Superscript]]<br>
+
| align="center" | [[Image:CKEditor_size.png|Font Size]]  
−
| Superscript or subscript the highlighted text.See Superscript and subscript in [[CKEditor_3.x/Users Guide/Common Tasks/Text Formatting|Text Formatting]].<br>
+
| Change the font size of the text. See [[CKEditor 3.x/Users Guide/Styling/Size|Font Size]].
 
|-
 
|-
−
| align="center" | [[Image:CKEditor_numberedlist.png|Insert/Remove Numbered List]] [[Image:CKEditor_bulletedlist.png|Insert/Remove Bulleted List]]  
+
| align="center" | [[Image:CKEditor_textcolor.png|Text Color]]
−
| Creates numbered or bulleted lists. See [[CKEditor_3.x/Users Guide/Common Tasks/Creating Lists|Creating Lists]].<br>
+
| Change the color of the text. See [[CKEditor_3.x/Users Guide/Styling/Text Color|Text Color]].
 +
|-
 +
| align="center" | [[Image:CKEditor_backgroundcolor.png|Background Color]]  
 +
| Change the background color of the text. See [[CKEditor_3.x/Users Guide/Styling/Background Color|Background Color]].
 +
|}
 +
 
 +
 
 +
== Text Layout ==
 +
{| cellspacing="0" cellpadding="3" border="1"
 +
|-
 +
| width="120px" nowrap="nowrap" align="center" | '''Toolbar Button'''
 +
| '''Description'''
 
|-
 
|-
 
| align="center" | [[Image:CKEditor_outdent.png|Decrease Indent]] [[Image:CKEditor_indent.png|Increase Indent]]  
 
| align="center" | [[Image:CKEditor_outdent.png|Decrease Indent]] [[Image:CKEditor_indent.png|Increase Indent]]  
−
| Increase or decrease the text indentation. <br>
+
| Increase or decrease text indentation. See [[CKEditor 3.x/Users Guide/Layout/Indentation|Text Indentation]].
 
|-
 
|-
−
| align="center" | [[Image:CKEditor_blockquote.png|Block Quote]]<br>
+
| align="center" | [[Image:CKEditor_blockquote.png|Block Quote]]
−
| Format a block of text to identify quotations (text provenient from other sources).<br>
+
| Format a block of text as indented quotation. See [[CKEditor 3.x/Users Guide/Layout/Block Quote|Block Quote]].
 
|-
 
|-
−
| align="center" | [[Image:CKEditor_div.png|Create Div Container]]<br>
+
| align="center" | [[Image:CKEditor_div.png|Create Div Container]]
−
| Create a new div container in document source.<br>
+
| Create a new <code>div</code> element in document source. See [[CKEditor_3.x/Users_Guide/Layout/Div|Creating Div Container]].
 
|-
 
|-
 
| align="center" | [[Image:CKEditor_alignleft.png|Align Left]] [[Image:CKEditor_center.png|Center]] [[Image:CKEditor_alignright.png|Align Right]] [[Image:CKEditor_justify.png|Justify‎]]  
 
| align="center" | [[Image:CKEditor_alignleft.png|Align Left]] [[Image:CKEditor_center.png|Center]] [[Image:CKEditor_alignright.png|Align Right]] [[Image:CKEditor_justify.png|Justify‎]]  
−
| Sets the text alignment (left, centered, right or justified). See Text layout and format in [[CKEditor_3.x/Users Guide/Common Tasks/Text Formatting|Text Formatting]].<br>
+
| Set text alignment (left, centered, right or justified). See [[CKEditor 3.x/Users Guide/Layout/Alignment|Text Alignment]].
 
|-
 
|-
 
| align="center" | [[Image:CKEditor_ltr.png|Text direction from left to right]] [[Image:CKEditor_rtl.png|Text direction from right to left]]
 
| align="center" | [[Image:CKEditor_ltr.png|Text direction from left to right]] [[Image:CKEditor_rtl.png|Text direction from right to left]]
−
| Sets the text direction from left to right or from right to left. <br>
+
| Set text direction as from left to right (default value for most Western languages) or from right to left (languages like Arabic, Persian, Hebrew).
 +
|-
 +
| align="center" | [[Image:CKEditor_hr.png|Insert Horizontal Line]]
 +
| Insert a divider line (horizontal rule) into the document. See [[CKEditor 3.x/Users Guide/Layout/Horizontal Line|Horizontal Line]].
 +
|}
 +
 
 +
== Rich Text ==
 +
{| cellspacing="0" cellpadding="3" border="1"
 +
|-
 +
| width="120px" nowrap="nowrap" align="center" | '''Toolbar Button'''
 +
| '''Description'''
 +
|-
 +
| align="center" | [[Image:CKEditor_numberedlist.png|Insert/Remove Numbered List]] [[Image:CKEditor_bulletedlist.png|Insert/Remove Bulleted List]]
 +
| Create a numbered or bulleted list. See [[CKEditor 3.x/Users Guide/Rich Text/Lists|Creating Lists]].
 
|-
 
|-
 
| align="center" | [[Image:CKEditor_link.png|Link]] [[Image:CKEditor_unlink.png|Unlink]]  
 
| align="center" | [[Image:CKEditor_link.png|Link]] [[Image:CKEditor_unlink.png|Unlink]]  
−
| Converts or removes the text in hyperlinks. It may also by used to manage file uploads and links to files on the web server. See [[CKEditor_3.x/Users Guide/Common Tasks/Links, E-Mails and Anchors|Links, E-Mails and Anchors]].<br>
+
| Create or remove a hyperlink in the text. These features may also be used to manage file uploads and links to files on the web server. See [[CKEditor 3.x/Users Guide/Rich Text/Links|Links, E-Mails and Anchors]].
−
 
 
 
|-
 
|-
 
| align="center" | [[Image:CKEditor_anchor.png|Anchor]]  
 
| align="center" | [[Image:CKEditor_anchor.png|Anchor]]  
−
| Inserts or modifies a link anchor. See [[CKEditor_3.x/Users Guide/Common Tasks/Links, E-Mails and Anchors|Links, E-Mails and Anchors]]
+
| Insert a link anchor to the text. See [[CKEditor 3.x/Users Guide/Rich Text/Links#Anchors|Anchors]].
 
|-
 
|-
 
| align="center" | [[Image:CKEditor_image.png|Image]]  
 
| align="center" | [[Image:CKEditor_image.png|Image]]  
−
| Inserts images into the document. See [[CKEditor_3.x/Users Guide/Common Tasks/Inserting Images|Inserting Images]].<br>
+
| Insert an image into the document. See [[CKEditor 3.x/Users Guide/Rich Text/Images|Inserting Images]].
 
|-
 
|-
 
| align="center" | [[Image:CKEditor_flash.png|Flash]]  
 
| align="center" | [[Image:CKEditor_flash.png|Flash]]  
−
| Inserts a Adobe Flash element into the page. See [[CKEditor_3.x/Users Guide/Common Tasks/Inserting Flash|Inserting Flash]]
+
| Insert an Adobe Flash object into the document. See [[CKEditor 3.x/Users Guide/Rich Text/Flash|Inserting Flash]].
 
|-
 
|-
 
| align="center" | [[Image:CKEditor_table.png|Table]]  
 
| align="center" | [[Image:CKEditor_table.png|Table]]  
−
| Creates a table with the defined number of columns and rows. See [[CKEditor_3.x/Users Guide/Common Tasks/Tables|Tables]].<br>
+
| Create a table with the defined number of columns and rows. See [[CKEditor_3.x/Users Guide/Rich Text/Tables|Creating Tables]].
−
|-
 
−
| align="center" | [[Image:CKEditor_hr.png|Insert Horizontal Line]]
 
−
| Inserts a divider line (horizontal rule). <br>
 
 
|-
 
|-
 
| align="center" | [[Image:CKEditor_smiley.png|Smiley]]  
 
| align="center" | [[Image:CKEditor_smiley.png|Smiley]]  
−
| Inserts an emoticons image (smiley faces, email icon, lightbulb, etc.).<br>
+
| Insert an emoticon image (smiley or icon). See [[CKEditor_3.x/Users Guide/Rich Text/Special Characters and Smileys#Inserting Smileys|Inserting Smileys]].
 
|-
 
|-
 
| align="center" | [[Image:CKEditor_specialchar.png|Insert Special Character]]  
 
| align="center" | [[Image:CKEditor_specialchar.png|Insert Special Character]]  
−
| Inserts special characters.<br>
+
| Insert a special character or symbol. See [[CKEditor_3.x/Users Guide/Rich Text/Special Characters and Smileys#Inserting Special Characters|Inserting Special Characters]].
−
|-
 
−
| align="center" | [[Image:CKEditor_pagebreak.png|Insert Page Break for Printing]]
 
−
| Inserts a printing page break. Only impacts printed version. <br>
 
−
|-
 
−
| align="center" | [[Image:CKEditor_styles.png|Formatting Styles]]
 
−
| Styles &amp; formatting determine the appearance and semantic value of your document. You may use the drop down boxes to apply styles, set the font, its size, etc. To remove the applied style select the style name again. See [[CKEditor_3.x/Users Guide/Common Tasks/Text Formatting|Text Formatting]].<br>
 
 
|-
 
|-
−
| align="center" | [[Image:CKEditor_textcolor.png|Text Color]]  
+
| align="center" | [[Image:CKEditor_iframe.png|IFrame]]  
−
| Changes the color of the text. See[[CKEditor_3.x/Users Guide/Common Tasks/Text Formatting|Text Formatting]].<br>
+
| Insert an inline frame (<code>iframe</code>). See [[CKEditor 3.x/Users Guide/Rich Text/IFrame|Inserting IFrames]].
−
|-
 
−
| align="center" | [[Image:CKEditor_backgroundcolor.png|Background Color]]
 
−
| Changes the background color of the text. See[[CKEditor_3.x/Users Guide/Common Tasks/Text Formatting|Text Formatting]].<br>
 
−
|-
 
−
| align="center" | [[Image:CKEditor_maximize.png|Maximize]]
 
−
| Maximizes the editor size inside the browser.
 
−
|-
 
−
| align="center" | [[Image:CKEditor_blocks.png|Show Blocks]]
 
−
| Shows the block elements boundaries in the text.
 
−
|-
 
−
| align="center" | [[Image:CKEditor_about.png|About CKEditor]]  
 
−
| Shows information about the CKEditor.
 
 
|}
 
|}
  
−
== Form Functions ==
+
== Form Elements ==
−
 
 
 
{| cellspacing="0" cellpadding="3" border="1"
 
{| cellspacing="0" cellpadding="3" border="1"
 
|-
 
|-
−
| nowrap="nowrap" align="center" | '''Toolbar Element'''<br>
+
| width="120px" nowrap="nowrap" align="center" | '''Toolbar Button'''
−
| '''Function'''
+
| '''Description'''
 
|-
 
|-
 
| align="center" | [[Image:CKEditor_form.png|Form]]
 
| align="center" | [[Image:CKEditor_form.png|Form]]
−
| Creates a new form block into the page.<br>
+
| Insert a new form into the document. See [[CKEditor 3.x/Users Guide/Rich Text/Forms|Creating Forms]].
 
|-
 
|-
 
| align="center" | [[Image:CKEditor_checkbox.png|Checkbox]]
 
| align="center" | [[Image:CKEditor_checkbox.png|Checkbox]]
−
| Inserts a checkbox to the page.
+
| Insert a checkbox into the document form. See [[CKEditor 3.x/Users Guide/Rich Text/Forms#Checkbox|Checkbox]].
 
|-
 
|-
 
| align="center" | [[Image:CKEditor_radiobutton.png|Radio Button]]
 
| align="center" | [[Image:CKEditor_radiobutton.png|Radio Button]]
−
| Inserts a radio button to the page.
+
| Insert a radio button into the document form. See [[CKEditor 3.x/Users Guide/Rich Text/Forms#Radio Button|Radio Button]].
 
|-
 
|-
−
| align="center" | [[Image:CKEditor_textfield.png|Text Field]]<br>
+
| align="center" | [[Image:CKEditor_textfield.png|Text Field]]
−
| Inserts a text field into the page.<br>
+
| Insert a text field into the document form. See [[CKEditor 3.x/Users Guide/Rich Text/Forms#Text Field|Text Field]].
 
|-
 
|-
 
| align="center" | [[Image:CKEditor_textarea.png|Textarea]]
 
| align="center" | [[Image:CKEditor_textarea.png|Textarea]]
−
| Inserts a multi-line text area into the page.
+
| Insert a multi-line text area into the document form. See [[CKEditor 3.x/Users Guide/Rich Text/Forms#Textarea|Textarea]].
 
|-
 
|-
−
| align="center" | [[Image:CKEditor_selectionfield.png|Selection Field]]<br>
+
| align="center" | [[Image:CKEditor_selectionfield.png|Selection Field]]
−
| Inserts a selection field into the page.<br>
+
| Insert a selection field into the document form. See [[CKEditor 3.x/Users Guide/Rich Text/Forms#Selection Field|Selection Field]].
 
|-
 
|-
−
| align="center" | [[Image:CKEditor_button.png|Button]]<br>
+
| align="center" | [[Image:CKEditor_button.png|Button]]
−
| Inserts a form button into the page.<br>
+
| Insert a button into the document form. See [[CKEditor 3.x/Users Guide/Rich Text/Forms#Button|Button]].
 
|-
 
|-
 
| align="center" | [[Image:CKEditor_imagebutton.png|Image Button]]
 
| align="center" | [[Image:CKEditor_imagebutton.png|Image Button]]
−
| Inserts an image into the page, which behaves much like form button used to submit forms. Do not use it to insert plain images into the document.<br>
+
| Insert an image button into the document form. See [[CKEditor 3.x/Users Guide/Rich Text/Forms#Image Button|Image Button]].
 
|-
 
|-
−
| align="center" | [[Image:CKEditor_hiddenfield.png|Hidden Field]]<br>
+
| align="center" | [[Image:CKEditor_hiddenfield.png|Hidden Field]]
−
| Inserts a hidden field into the page.<br>
+
| Insert a hidden field into the document form. See [[CKEditor 3.x/Users Guide/Rich Text/Forms#Hidden Field|Hidden Field]].
 
|}
 
|}

Latest revision as of 13:28, 10 March 2011

Below you will find an overview of all features available in the default CKEditor toolbar.

Working with a Document

Toolbar Button Description
Source View or edit the source code of the document (for advanced users). See Document Source.
Save Save the contents of CKEditor and submit its data to the server, when CKEditor is placed inside an HTML form. See Saving Content.
New Page Clear the editing area and create a new page. See Creating a New Page.
Preview Show a preview of the document in the shape that will be displayed to end users. See Document Preview.
Templates Select a layout template. See Templates.
Cut Cut the selected text fragment to the clipboard. See Cut.
Copy Copy the selected text fragment to the clipboard. See Copy.
Paste Paste content copied to the clipboard along with formatting. See Paste.
Paste as plain text Paste content copied to the clipboard without formatting. See Paste as Plain Text.
Paste from Word Paste content copied from Microsoft Word or similar applications along with formatting. See Paste from Word.
Print Print document contents. See Printing.
Insert Page Break for Printing Insert a page break. This only impacts the printed version. See Page Breaks.
Check Spelling Spell Check As You Type Check spelling of the document text or turn on the Spell Check As You Type (SCAYT) feature. See Spell Checking.
Undo Redo Undo or redo the most recent action performed. See Undo and Redo.
Find Find a word or phrase in the document. See Find.
Replace Find and replace a word or phrase in the document. See Replace.
Select All Select all contents of the document. See Text Selection.
Remove Format Remove the formatting of the selected text. See Remove Format.
Maximize Maximize the editor in the browser window. See Resizing and Maximizing CKEditor.
Show Blocks Highlight all block-level elements in the document. See Show Blocks.
About CKEditor Show information about CKEditor. See CKEditor Version.

Text Styling

Toolbar Button Description
Bold Italic Underline Strike Through Apply bold, italic, underline or strike-through formatting to the text. See Bold, Italic, Underline, and Strike-through.
Subscript Superscript Apply superscript or subscript formatting to the text. See Subscript and Superscript.
Formatting Styles Apply pre-defined combinations of various formatting options to block and inline elements. See Formatting Styles.
Paragraph Format Apply pre-defined block-level combinations of various formatting options. See Paragraph Format.
Font Name Change the typeface of the text. See Font Name.
Font Size Change the font size of the text. See Font Size.
Text Color Change the color of the text. See Text Color.
Background Color Change the background color of the text. See Background Color.


Text Layout

Toolbar Button Description
Decrease Indent Increase Indent Increase or decrease text indentation. See Text Indentation.
Block Quote Format a block of text as indented quotation. See Block Quote.
Create Div Container Create a new div element in document source. See Creating Div Container.
Align Left Center Align Right Justify‎ Set text alignment (left, centered, right or justified). See Text Alignment.
Text direction from left to right Text direction from right to left Set text direction as from left to right (default value for most Western languages) or from right to left (languages like Arabic, Persian, Hebrew).
Insert Horizontal Line Insert a divider line (horizontal rule) into the document. See Horizontal Line.

Rich Text

Toolbar Button Description
Insert/Remove Numbered List Insert/Remove Bulleted List Create a numbered or bulleted list. See Creating Lists.
Link Unlink Create or remove a hyperlink in the text. These features may also be used to manage file uploads and links to files on the web server. See Links, E-Mails and Anchors.
Anchor Insert a link anchor to the text. See Anchors.
Image Insert an image into the document. See Inserting Images.
Flash Insert an Adobe Flash object into the document. See Inserting Flash.
Table Create a table with the defined number of columns and rows. See Creating Tables.
Smiley Insert an emoticon image (smiley or icon). See Inserting Smileys.
Insert Special Character Insert a special character or symbol. See Inserting Special Characters.
IFrame Insert an inline frame (iframe). See Inserting IFrames.

Form Elements

Toolbar Button Description
Form Insert a new form into the document. See Creating Forms.
Checkbox Insert a checkbox into the document form. See Checkbox.
Radio Button Insert a radio button into the document form. See Radio Button.
Text Field Insert a text field into the document form. See Text Field.
Textarea Insert a multi-line text area into the document form. See Textarea.
Selection Field Insert a selection field into the document form. See Selection Field.
Button Insert a button into the document form. See Button.
Image Button Insert an image button into the document form. See Image Button.
Hidden Field Insert a hidden field into the document form. See Hidden Field.
Retrieved from "https://docs-old.ckeditor.com/index.php?title=CKEditor_3.x/Users_Guide/Quick_Reference&oldid=5927"
This page was last edited on 10 March 2011, at 13:28.