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.

Line 14: Line 14:
 
| Saves the page you were editing.
 
| Saves the page you were editing.
 
|-
 
|-
| align="center" | [[Image:CKEditor_new.png]]  
+
| align="center" | [[Image:CKEditor_new.gif]]  
 
| Removes all contentes, creating a new blank page.
 
| Removes all contentes, creating a new blank page.
 
|-
 
|-
| align="center" | [[Image:CKEditor prewiev.png]]<br>  
+
| align="center" | [[Image:CKEditor preview.gif]]<br>  
 
| Preview what the HTML page will look like for users.<br>
 
| Preview what the HTML page will look like for users.<br>
 
|-
 
|-
Line 79: Line 79:
 
|-
 
|-
 
| align="center" | [[Image:CKEditor_text_direction_left.gif]][[Image:CKEditor_text_direction_right.gif]]
 
| align="center" | [[Image:CKEditor_text_direction_left.gif]][[Image:CKEditor_text_direction_right.gif]]
| Sets the text direction from left to right or from right to left
+
| Sets the text direction from left to right or from right to left. <br>
| align="center" | [[Image:Link.gif]][[Image:Unlink.gif]]  
+
|-
 +
| align="center" | [[Image:CKEditor_link.gif]][[Image:CKEditor_unlink.gif]]  
 
| 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>
 
| 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>
  
 
|-
 
|-
| align="center" | [[Image:Anchor.png]]  
+
| align="center" | [[Image:CKEditor_anchors.gif]]  
 
| Inserts or modifies a link anchor. See [[CKEditor_3.x/Users Guide/Common Tasks/Links, E-Mails and Anchors|Links, E-Mails and Anchors]]
 
| Inserts or modifies a link anchor. See [[CKEditor_3.x/Users Guide/Common Tasks/Links, E-Mails and Anchors|Links, E-Mails and Anchors]]
 
|-
 
|-
| align="center" | [[Image:Image.gif]]  
+
| align="center" | [[Image:CKEditor_image.gif]]  
 
| Inserts images into the document. See [[CKEditor_3.x/Users Guide/Common Tasks/Inserting Images|Inserting Images]].<br>
 
| Inserts images into the document. See [[CKEditor_3.x/Users Guide/Common Tasks/Inserting Images|Inserting Images]].<br>
 
|-
 
|-
| align="center" | [[Image:Flash.png]]  
+
| align="center" | [[Image:CKEditor_flash.gif]]  
| Inserts a Adobe Flash element into the page.
+
| Inserts a Adobe Flash element into the page. See [[CKEditor_3.x/Users Guide/Common Tasks/Inserting Flash|Inserting Flash]]
 
|-
 
|-
| align="center" | [[Image:Table.gif]]  
+
| align="center" | [[Image:CKEditor_table.gif]]  
 
| Creates a table with the defined number of columns and rows. See [[CKEditor_3.x/Users Guide/Common Tasks/Tables|Tables]].<br>
 
| Creates a table with the defined number of columns and rows. See [[CKEditor_3.x/Users Guide/Common Tasks/Tables|Tables]].<br>
 
|-
 
|-
| align="center" | [[Image:Inserthorizontalrule.gif]]  
+
| align="center" | [[Image:CKEditor_horizontal_line.gif]]  
 
| Inserts a divider line (horizontal rule). <br>
 
| Inserts a divider line (horizontal rule). <br>
 
|-
 
|-
| align="center" | [[Image:Smiley.gif]]  
+
| align="center" | [[Image:CKEditor_smiley.gif]]  
 
| Inserts an emoticons image (smiley faces, email icon, lightbulb, etc.).<br>
 
| Inserts an emoticons image (smiley faces, email icon, lightbulb, etc.).<br>
 
|-
 
|-
| align="center" | [[Image:Specialchar.gif]]  
+
| align="center" | [[Image:CKEditor_specialchar.gif]]  
| Inserts symbols &amp; special characters (accented characters, trademark, currency symbol, etc.).<br>
+
| Inserts special characters.<br>
 
|-
 
|-
| align="center" | [[Image:Pagebreak.gif]]  
+
| align="center" | [[Image:CKEditor_pagebreak.gif]]  
 
| Inserts a printing page break. Only impacts printed version. <br>
 
| Inserts a printing page break. Only impacts printed version. <br>
 
|-
 
|-
Line 111: Line 112:
 
| 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>
 
| 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:Textcolor.gif]]  
+
| align="center" | [[Image:CKEditor_textcolor.gif]]  
| Changes the color of the text. See Size and color in [[CKEditor_3.x/Users Guide/Common Tasks/Text Formatting|Text Formatting]].<br>
+
| Changes the color of the text. See[[CKEditor_3.x/Users Guide/Common Tasks/Text Formatting|Text Formatting]].<br>
 
|-
 
|-
| align="center" | [[Image:Bgcolor.gif]]  
+
| align="center" | [[Image:CKEditor_bgcolor.gif]]  
| Changes the background color of the text. See Size and color in [[CKEditor_3.x/Users Guide/Common Tasks/Text Formatting|Text Formatting]].<br>
+
| Changes the background color of the text. See[[CKEditor_3.x/Users Guide/Common Tasks/Text Formatting|Text Formatting]].<br>
 
|-
 
|-
| align="center" | [[Image:Maximize.png]]  
+
| align="center" | [[Image:CKEditor_maximize.gif]]  
 
| Maximizes the editor size inside the browser.
 
| Maximizes the editor size inside the browser.
 
|-
 
|-
| align="center" | [[Image:Show blocks.png|Image:Show_blocks.png]]  
+
| align="center" | [[Image:CKEditor_show blocks.gif]]  
 
| Shows where the block elements boundaries in the text.
 
| Shows where the block elements boundaries in the text.
 
|-
 
|-
 
| align="center" | [[Image:About.png]]  
 
| align="center" | [[Image:About.png]]  
| Shows information about the FCKeditor.
+
| Shows information about the CKEditor.
 
|}
 
|}
  

Revision as of 13:20, 25 August 2010

In this section you can have a quick overview about all functions available in the default CKEditor toolbar.

Common Toolbar Functions

Toolbar Element
Function
CKEditor source.jpg
View or edit the document source code (for advanced users). See Source Editor.
File:CKEditor save.jpg Saves the page you were editing.
CKEditor new.gif Removes all contentes, creating a new blank page.
CKEditor preview.gif
Preview what the HTML page will look like for users.
CKEditor templates.png
Select a layout template. See Templates
CKEditor cut.png
Cut the highlighted text to the clipboard. See Cut, Copy and Paste.
CKEditor copy.png
Copy the highlighted text to the clipboard. See Cut, Copy and Paste.
File:CKEditor paste.gifFile:CKEditor paste text.gif
Paste the data copied to the clipboard (with or without formatting). See Cut, Copy and Paste.
File:CKEditor paste word.gif
Paste content copied from Microsoft Word or similar applications. See Cut, Copy and Paste.
File:CKEditor print.gif
Print the current document. See Printing.
CKEditor spellcheck.gifCKEditor spellcheck type.gif
Spell check the text in the document or spell check the text as you type. See Spell Checking.
CKEditor undo.gifCKEditor redo.gif
Undo or redo the most recent action taken. See Undo and Redo.
CKEditor find.gif
Find a word or phrase within the document. See Find and Replace.
File:CKEditor find replace.gif
Find and replace a word or phrase within the document. See Find and Replace.
CKEditor selectall.gif
Select the entire content in the document.
CKEditor remove format.gif
Remove the formatting from the highlighted text.
File:CKEditor bold.gifFile:CKEditor italic.gifFile:CKEditor underline.gifFile:CKEditor strikethough.gif
Applies bold, italic, underscore or strikethrough formatting to the highlighted text.See Text Formatting.
CKEditor subscript.gifCKEditor superscript.gif
Superscript or subscript the highlighted text.See Superscript and subscript in Text Formatting.
CKEditor insertorderlist.gifCKEditor insertunorderedlist.gif Creates numbered or bulleted lists. See Creating Lists.
CKEditor outdent.gifCKEditor indent.gif Increase or decrease the text indentation.
CKEditor blokquote.gif
Format a block of text to identify quotations (text provenient from other sources).
CKEditor div container.gif
Create a new div container in document source.
CKEditor justifyleft.gifCKEditor justifycenter.gifCKEditor justifyright.gifCKEditor justifyfull.gif Sets the text alignment (left, centered, right or justified). See Text layout and format in Text Formatting.
CKEditor text direction left.gifFile:CKEditor text direction right.gif Sets the text direction from left to right or from right to left.
CKEditor link.gifCKEditor unlink.gif 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 Links, E-Mails and Anchors.
CKEditor anchors.gif Inserts or modifies a link anchor. See Links, E-Mails and Anchors
CKEditor image.gif Inserts images into the document. See Inserting Images.
CKEditor flash.gif Inserts a Adobe Flash element into the page. See Inserting Flash
CKEditor table.gif Creates a table with the defined number of columns and rows. See Tables.
CKEditor horizontal line.gif Inserts a divider line (horizontal rule).
CKEditor smiley.gif Inserts an emoticons image (smiley faces, email icon, lightbulb, etc.).
CKEditor specialchar.gif Inserts special characters.
CKEditor pagebreak.gif Inserts a printing page break. Only impacts printed version.
Image:FCK_style.gif Styles & 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 Text Formatting.
CKEditor textcolor.gif Changes the color of the text. SeeText Formatting.
CKEditor bgcolor.gif Changes the background color of the text. SeeText Formatting.
CKEditor maximize.gif Maximizes the editor size inside the browser.
CKEditor show blocks.gif Shows where the block elements boundaries in the text.
About.png Shows information about the CKEditor.

Form Functions

Toolbar Element
Function
CKEditor form.gif Creates a new form block into the page.
CKEditor checkbox.gif Inserts a checkbox to the page.
CKEditor radiobutton.gif Inserts a radio button to the page.
CKEditor textfield.gif
Inserts a text field into the page.
CKEditor textarea.gif Inserts a multi-line text area into the page.
CKEditor selection field.gif
Inserts a selection field into the page.
CKEditor button.gif
Inserts a form button into the page.
CKEditor button image.gif 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.
CKEditor hidden.gif
Inserts a hidden field into the page.