Difference between revisions of "Content editors"

From Joomla! Documentation

(Marked this version for translation)
Line 15: Line 15:
 
==No editor== <!--T:3-->
 
==No editor== <!--T:3-->
 
</translate>
 
</translate>
{{Chunk:No editor/<translate>en</translate>}}
+
{{Chunk:No editor/<translate><!--T:6-->
 +
en</translate>}}
  
 
<translate>
 
<translate>

Revision as of 19:28, 23 November 2014

Other languages:
Deutsch • ‎English • ‎Nederlands • ‎eesti • ‎español • ‎français • ‎italiano • ‎português • ‎português do Brasil • ‎русский

The standard editors available in Joomla multi

TinyMCE editor[edit]

The default editor for both front-end and back-end users in Joomla! is the TinyMCE editor.

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. The 3-row toolbar below provides many standard editing commands:

Article tinymce buttons-en.png


  • Top Row - Menu - You will find here Menus offering various features and often complementary to those in the buttons below.
    • Edit: Undo, Redo, Cut, Copy, Paste,
    • Insert: Picture, Link, Line, Special character,
    • View: with Visual aids,
    • Format: Bold, Italic, ... and all the different Formats available,
    • Table: with an easy way to specify rows and columns,
    • Tools: Edit Source Code. A popup displays, showing the HTML source code, allowing you to edit the HTML source code.
  • Second Row
    • Buttons on the left allow you to make text bold, italic, underlined, or strikethrough.
    • Next to that are buttons for align left, center, right and full.
    • Paragraph. Select pre-defined formats for Paragraph, Address, Heading 1, and so on.
    • List where you can choose between Bullet list or Numbered list.
  • Third Row
    • Decrease and Increase indent.
    • Undo and Redo.
    • 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.
    • Remove link. To remove a link, highlight the linked text and press this button.
    • Insert/Edit Image. To insert an image, place the cursor in the desired location and press this button. A popup dialog displays that lets you enter in the Image URL and other information about how the image will display.
    • Source code. A popup displays showing the HTML source code, allowing you to edit the HTML source code.
    • Horizontal line. To insert a line.
    • Table, to insert a new table, 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.

Accessibility[edit]

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

See for more information: TinyMCE - Accessibility

No editor[edit]

If 'No editor' is selected for a User, then a simple text editor displays. This allows you to enter in raw, unformatted HTML. You can use the toolbar 'Preview' button to preview how the HTML will display.

Note that the 'No Editor' option can be useful if you are entering in 'boilerplate' or custom HTML, for example to create a PayPal link. TinyMCE automatically re-formats and strips some HTML when a file is saved. This can cause complex HTML to not work correctly.

If this happens, you can temporarily change the editor to 'No Editor' and create the desired content. Note that if you wish to edit this content in the future, you should be careful to change your editor to 'No Editor'. Otherwise, if you open and save the content with TinyMCE, you may lose your custom HTML.