Drupal
/
drupal
mirror of https://git.drupalcode.org/project/drupal.git
1
0
Fork 0
Code Issues Projects Releases Wiki Activity

Issue #3304596 by bnjmnm, lauriii, Wim Leers: Update editor help topic page to mention CKEditor 5 

(cherry picked from commit 9d82b6d212)
merge-requests/2250/merge
Lauri Eskola 2022-08-19 12:26:32 +03:00
parent a620cedf94
commit 0eb92220b5
No known key found for this signature in database
GPG Key ID: 382FC0F5B0DF53F8
1 changed files with 5 additions and 5 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

10
core/modules/help_topics/help_topics/editor.overview.html.twig
View File

@ -10,14 +10,14 @@ related:
<h2>{% trans %}Goal{% endtrans %}</h2>
<p>{% trans %}Configure a text format so that when a user is editing text and selects this text format, a text editor installed on your site is shown. Configure the text editor, such as choosing which buttons and functions are available. See {{ filter_overview_topic }} for more about text formats.{% endtrans %}</p>
<h2>{% trans %}What is a text editor?{% endtrans %}</h2>
<p>{% trans %}A text editor is software (typically, a JavaScript library) that provides buttons and other command mechanisms to make editing HTML text easier. Some editors are called <em>visual</em> or <em>WYSIWYG (What You See Is What You Get)</em> editors; these editors hide the details of HTML from the user, and instead show formatted output on the screen. The core Text Editor module provides a framework for deploying text editors on your site. The core CKEditor module provides CKEditor, which is a widely-used JavaScript WYSIWYG editor that creates clean and valid HTML; the module also enforces the HTML tag restrictions in the associated text format. Various contributed modules provide other editors; to install a new editor, besides installing the module, you may need to download the editor library from a third-party site.{% endtrans %}</p>
<p>{% trans %}A text editor is software (typically, a JavaScript library) that provides buttons and other command mechanisms to make editing HTML text easier. Some editors are called <em>visual</em> or <em>WYSIWYG (What You See Is What You Get)</em> editors; these editors hide the details of HTML from the user, and instead show formatted output on the screen. The core Text Editor module provides a framework for deploying text editors on your site. The core CKEditor 5 module provides CKEditor 5, which is a widely-used JavaScript text editor that creates clean and valid HTML; the module also enforces the HTML tag restrictions in the associated text format. Various contributed modules provide other editors; to install a new editor, besides installing the module, you may need to download the editor library from a third-party site.{% endtrans %}</p>
<h2>{% trans %}Steps{% endtrans %}</h2>
<ol>
<li>{% trans %}In the <em>Manage</em> administrative menu, navigate to <em>Configuration</em> &gt; <em>Content Authoring</em> &gt; <a href="{{ content_url }}"><em>Text formats and editors</em></a>. The <em>Text editor</em> column in the table shows the text editor that is currently connected to each text format, if any.{% endtrans %}</li>
<li>{% trans %}Follow the steps on {{ filter_overview_topic }} to add a new text format or configure an existing text format; when you reach the step about text editors, return to this topic.{% endtrans %}</li>
<li>{% trans %}Select <em>CKEditor</em> as the <em>Text editor</em>, or another text editor that you have installed. The rest of these steps assume you selected <em>CKEditor</em>.{% endtrans %}</li>
<li>{% trans %}Under <em>Toolbar configuration</em>, drag buttons between <em>Available buttons</em> and <em>Active toolbar</em>; only buttons in <em>Active toolbar</em> will be shown to the user. If you are using a mouse, you can hover over a button to see a tooltip explaining what the button does.{% endtrans %}</li>
<li>{% trans %}Drag buttons within <em>Active toolbar</em> to the desired order, and group buttons by dragging them into the grouping boxes; click <em>Add group</em> to add additional groups.{% endtrans %}</li>
<li>{% trans %}Under <em>CKEditor plugin settings</em>, configure the buttons that have configuration. This section will not be present if there are no active buttons with configuration.{% endtrans %}</li>
<li>{% trans %}Select <em>CKEditor 5</em> as the <em>Text editor</em>, or another text editor that you have installed. The rest of these steps assume you selected <em>CKEditor 5</em>.{% endtrans %}</li>
<li>{% trans %}Under <em>Toolbar configuration</em>, drag buttons between <em>Available buttons</em> and <em>Active toolbar</em>; only buttons in <em>Active toolbar</em> will be shown to the user. Focusing or hovering over a button will display a tooltip explaining what the button does.{% endtrans %}</li>
<li>{% trans %}Drag buttons within <em>Active toolbar</em> to the desired order, and group buttons by dragging them between group identifiers; drag <em>a new group identifier</em> to the toolbar to add additional groups.{% endtrans %}</li>
<li>{% trans %}If you add buttons that require configuration, the <em>CKEditor 5 plugin settings</em> section will be visible, and provide their respective configuration forms. {% endtrans %}</li>
<li>{% trans %}Return to {{ filter_overview_topic }} to complete the text format configuration, and be sure to save the text format.{% endtrans %}</li>
</ol>