View source for TinyMCE/en

<noinclude><languages /></noinclude>
'''TinyMCE''' is the default editor for both Frontend and Backend users. TinyMCE is a '''WYSIWYG''' (what you see is what you get) editor that allows users a familiar word-processing interface to use when editing Articles and other content.

TinyMCE can be configured with 3 different sets of toolbar buttons

*'''Set 2''' is assigned to 'Public'.
*'''Set 1''' is assigned to the 'Manager' and 'Registered'.
*'''Set 0''' is the most extended toolbar and is by default assigned to the 'Administrator', 'Editor' and 'Super Users'.

<includeonly>[[Image:Help30-editor-tinymce-advanced-en.png|600px|none]]
Learn about Toolbars, Editor Buttons and Accessibility of [[S:MyLanguage/Chunk30:TinyMCE|TinyMCE]].</includeonly>
<noinclude>
==Toolbars==
===Set Two===
The set provides one row of buttons as shown below.
[[Image:Help30-editor-tinymce-simple-en.png|500px|none]]
:*Buttons allow you to make text bold, italic, underlined, or strikethrough.
:*Undo (Ctrl+Z) and Re-do (Ctrl+Y).
:*Unordered list, Ordered list.
:*Cut, Copy, Paste, Paste as Plain Text, Paste from Word. Often when copying and pasting text from other sources, such as PDF files, Word documents, or web pages, the selected text contains formatting information that is not needed or wanted. Using the Paste as Plain Text will strip out all formatting from the text. Paste as Word tries to preserve some of the formatting while stripping out unnecessary formatting.
:*Insert 'Field', 'Image', 'Read More'. [[#Editor Buttons|Learn more about Editor Buttons]].

=== Set One ===

The set provides a 3-row (depending your screen) toolbar as shown below: 

[[Image:Help30-editor-tinymce-advanced-en.png|600px]]

This is the default setting for Manager and Registered. The 3-row toolbar provides many standard editing commands, as follows:

'''First Row''' 
:*Buttons in the upper left allow you to make text bold, italic, underlined, or strikethrough. Next to that are buttons for align left, right, center, and full. 
:*Format. Select pre-defined formats for Paragraph, Address, Heading1, and so on.
:*Unordered List, Ordered list, Outdent (move left) and Indent (indent right). 
:*Undo (Ctrl+Z) and Re-do (Ctrl+Y).
'''Second Row''' 
:*Insert/Edit Link. To insert or edit a link, select the linked text and press this button. A popup dialog displays that lets you enter details about the link.
:*Unlink. To remove a link, highlight the linked text and press this button.
:*Insert/Edit Anchor. An [[S:MyLanguage/Glossary#Anchor |anchor]] is a bookmark inside an article that lets you link directly to that point in the article. To insert an anchor, move the cursor to the desired location within the article and click this button. A window will display. Enter the name of the Anchor and press Insert. A small anchor icon will show in the location of the anchor. You can edit the name of the anchor by clicking on it and pressing this button. You can delete the anchor just by selecting it and pressing the Delete key.
:*Edit HTML Source. A popup displays showing the HTML source code, allowing you to edit the HTML source code.
:*Insert Horizontal Ruler.
:*Insert New Table, Table Row Properties, Table Cell Properties, Insert Row Before, Insert Row After, Delete Row, Insert Column Before, Insert Column After, Delete Column, Split Merged Table Cells, Merge Table Cells.
:*Subscript, Superscript, Insert Custom Character.
:*Paste as Plain Text. Often when copying and pasting text from other sources, such as PDF files, Word documents, or web pages, the selected text contains formatting information that is not needed or wanted. Using the Paste as Plain Text will strip out all formatting from the text.
:*Preview text in popup
:*Insert Module, Menu, Contact, Field. In a popup you can choose the item you want to insert.
'''Third Row'''  
:*Insert 'Article', 'Image', 'Page Break', 'Read More'. [[#Editor Buttons|Learn more about Editor Buttons]].

===Set Zero===
<hr/>
The set 0 toolbar provides the most extensive editing options, as shown below.

[[Image:Help30-editor-tinymce-extended-en.png]]

This option provides all of the same buttons as documented in the Set 1 (Advanced) Toolbar above. In addition, the following options are available:

'''First Row'''
:*Styles. Caption and System Pagebreak styles can be set. Highlight the desired text and select the style. This will allow this text to be formatted based on CSS rules.
:*Font Family. Select the desired font.
:*Font Size. Select the desired font size.
:*Find and Find/Replace.

'''Second Row'''
:*Select Text Color or Background Color.
:*Toggle Full Screen Mode.
:*Insert New Table, Table Row Properties, Table Cell Properties, Insert Row Before, Insert Row After, Delete Row, Insert Column Before, Insert Column After, Delete Column, Split Merged Table Cells, Merge Table Cells.
:*Insert Emotions.
:*Insert Embedded Media. To insert embedded media (such as Flash), place the cursor at the desired location and press this button. A popup dialog will display that allows you to enter the Type, File or URL, and other information about the media.
:*Direction Left to Right and Direction Right to Left. These buttons allow you to enter or change the text direction, for example for languages that read right to left.
:*Cut, Copy, Paste, Paste as Plain Text. Often when copying and pasting text from other sources, such as PDF files, Word documents, or web pages, the selected text contains formatting information that is not needed or wanted. Using the Paste as Plain Text will strip out all formatting from the text.

'''Third Row'''
:*Show/Hide Visual Control Characters (like paragraph endings). 
:*Show/Hide Block Elements.
:*Insert Non-Breaking Space Character.
:*Block Quote.
:*Insert Predefined Template Content.

This is set as an option in [[S:MyLanguage/Help310:Extensions_Plugin_Manager| Plugins]] for [[Help310:Extensions_Plugin_Manager_Edit#Editor_-_TinyMCE|Editor - TinyMCE]].

==Editor Buttons==
8 buttons are located at the bottom row of the editor toolbar and one below the content, as shown below:
:[[Image:Help35-Module-Article-Image-Pagebreak-Readmore-buttons-en.png|border]]
{{Chunk30:Help_screen_toolbar_icon_Module/en}}
{{Chunk30:Help_screen_toolbar_icon_Menu/en}}
{{Chunk30:Help_screen_toolbar_icon_Contact/en}}
{{Chunk30:Help_screen_toolbar_icon_Fields/en}}
{{Chunk30:Help_screen_toolbar_icon_Article/en}}
{{Chunk30:Help_screen_toolbar_icon_Image/en}}
{{Chunk30:Help_screen_toolbar_icon_Page_Break/en}}
----
{{Chunk30:Help_screen_toolbar_icon_Read_More/en}}
{{Chunk30:Help_screen_toolbar_icon_Toggle_Editor/en}}

==Accessibility==
TinyMCE is compatible with screen readers such as JAWS and NVDA. You can use it effectively even if you don't use the mouse. To use the editor's toolbar, use the following keyboard shortcuts: 

* [ALT + F9] Move focus and jump to menu bar
* [ALT + F10] Move focus and jump to toolbar
* [ALT + F11] Move focus and jump to element path
* [ESC] Close menu/submenu/dialog (also gets you back to editor area)
* [Tab]/[Arrow] Navigate left/right through menu/toolbar
For more information, see: [https://www.tiny.cloud/docs/advanced/accessibility/ TinyMCE - Accessibility]
</noinclude>