[Backport 13.4] [TASK] Update RTE page (#208)

* [TASK] Update Media page

releases: main, 13.4

* Apply suggestions from code review

Co-authored-by: Stefan Frömken <froemken@gmail.com>

* Update Documentation/ContentElements/RichTextEditor/Index.rst

Co-authored-by: Stefan Frömken <froemken@gmail.com>

* Update Documentation/ContentElements/RichTextEditor/Index.rst

* Solve typo in life search

---------

Co-authored-by: lina.wolf <lwolf@w-commerce.de>
Co-authored-by: Lina Wolf <48202465+linawolf@users.noreply.github.com>
Co-authored-by: Stefan Frömken <froemken@gmail.com>

Documentation/ContentElements/RichTextEditor/Index.rst

@@ -1,81 +1,97 @@
-.. include:: /Includes.rst.txt
-
-
-.. _rte:
+..  include:: /Includes.rst.txt
+..  _rte:
 
 ====================
 The rich text editor
 ====================
 
 ..  image:: /Images/ManualScreenshots/ContentElements/RegularText.png
-    :alt: Content element Regular Text in the TYPO3 backend
-    :class: img-thumbnail float-end
-    :width: 250
+     :alt: Content element Regular Text in the TYPO3 backend
+     :class: img-thumbnail float-end ms-1
+     :width: 250
+
+Start by `Creating a content element <https://docs.typo3.org/permalink/t3editors:content-creating>`_
+of type "Text & Images", "Text & Media", or "Regular Text Element". You can find them in the
+tab `Typical page content <https://docs.typo3.org/permalink/t3editors:content-typical>`_.
 
 The TYPO3 text editing interface is not much different from a word processor.
 The options available in the toolbars vary depending on how your TYPO3
 installation is configured.
 
-.. include:: /Images/AutomaticScreenshots/EditContent/EditContentRichTextEditor.rst.txt
+..  figure:: /Images/ManualScreenshots/ContentElements/Text/RichTextEditor.png
+     :alt: Screenshot of a typical rich text editor in the TYPO3 backend
+
+     The options you see depend on the configuration of your site
 
 You can format text, set the alignment, insert tables and symbols and add
 internal and external links to text.
 
-
-.. _rte-linking:
+..  _rte-linking:
 
 Creating a link
 ===============
 
-#. Select the text you want to link.
-#. Click the :guilabel:`Link` icon in the toolbar.
-   The :guilabel:`Link Browser` window displays.
+Select the text you want to link.
 
-   .. figure:: /Images/ManualScreenshots/Link/LinkBrowser.png
-      :alt: The TYPO3 CMS link browser
-      :class: with-border
+Click the :guilabel:`Link` icon in the toolbar or use the shortcut
+:kbd:`Ctrl + K` or :kbd:`Cmd + K`. This shortcut only works when
+your focus is within the editor. Outside the editor the same
+shortcut would open the live search.
+
+..  figure:: /Images/ManualScreenshots/ContentElements/Text/Link.png
+    :alt: Linking the highlighted text in the TYPO3 rich text editor
+
+The :guilabel:`Link Browser` window displays.
 
 This window lets you link to an internal page, file, folder, external
 URL, email address or phone number.
 
+..  _rte-linking-internal:
+
 Internal links
 --------------
+
+..  figure:: /Images/ManualScreenshots/Link/LinkBrowser.png
+    :alt: The TYPO3 CMS link browser
+
 You can link to an internal file, folder, page or content element on a page.
 
-On the :guilabel:`Page` tab, select the page in the page tree that you want to link to.
+On the :guilabel:`Page` tab, select the page in the page tree that you want
+to link to, then click the :guilabel:`Link to ...` button.
 
-Alternatively, you can link to a specific point (anchor) on the page. Browse
-to the page you want to link to, then click the arrow icon next to the page
-name. The content elements on that page are displayed and you can select the
-content element you want to link to.
+You can also link directly to a content element. In that case an anchor
+(link with a hashtag) is used so your readers will automatically jump to the
+desired content element.
 
-.. figure:: ../../Images/ManualScreenshots/Link/LinkBrowserAnchor.png
-   :alt: Display the anchors on a page
-   :class: with-border
+You can also link to uploaded files, for example PDF files:
 
-The :guilabel:`Link Browser` window closes and the link is added to your text.
+..  figure:: /Images/ManualScreenshots/Link/LinkBrowserFile.png
+    :alt: Linking to a file for download in TYPO3
 
+..  _rte-linking-external:
 
 External links
 --------------
 
-#. In the :guilabel:`Link Browser` window, go to the :guilabel:`*External URL` tab.
-#. Type your link in the :guilabel:`URL` field.
-#. In the Target drop-down list, select :guilabel:`New window` to open the
-   link in a new browser window.
+#.  In the :guilabel:`Link Browser` window, go to the :guilabel:`External URL` tab.
+#.  Type your link in the :guilabel:`URL` field.
+#.  In the Target drop-down list, select :guilabel:`New window` to open the
+    link in a new browser window.
 
-   .. figure:: ../../Images/ManualScreenshots/Link/LinkBrowserExternal.png
-      :alt: Display the anchors on a page
-      :class: with-border
+    ..  figure:: /Images/ManualScreenshots/Link/LinkBrowserExternal.png
+        :alt: Display the anchors on a page
+        :class: with-border
 
-#. Click the :guilabel:`Set Link` button to close the :guilabel:`Link Browser`
-   window.
+#.  Click the :guilabel:`Set Link` button to close the :guilabel:`Link Browser`
+    window.
 
+..  _rte-linking-remove:
 
 Removing a link
 ===============
 
 To remove a link from text, put your cursor anywhere in the linked text then
-click the :guilabel:`Unlink` icon on the toolbar.
+click the :guilabel:`Unlink` button in the popover:
 
-.. include:: /ContentElements/TipKeyboardCommands.rst.txt
+..  figure:: /Images/ManualScreenshots/ContentElements/Text/Unlink.png
+    :alt: Unlinking using the popover in the rich text editor