Interactive demos added in the user documentation

Author: julitafalcondusza

docs/ai_actions/work_with_ai_actions.md

@@ -7,6 +7,8 @@ description: Create new AI actions or modify existing ones to work faster and in
 AI actions define what results are available to editors in AI-enabled areas, such as, for example, the AI Assistant.
 If the AI Actions LTS update has been installed and configured in your application, and you have the required [permissions]([[= developer_doc =]]/permissions/policies/#ai-actions), including `Action configuration/Edit` and `Action configuration/Create`, you can reconfigure the existing AI actions, and create new ones.
 
+<!--ARCADE EMBED START--><div style="position: relative; padding-bottom: calc(51.27314814814815% + 41px); height: 0; width: 100%;"><iframe src="https://demo.arcade.software/oDRgSawmcExFx2NUJYbM?embed&embed_mobile=tab&embed_desktop=inline&show_copy_link=true" title="Use AI to expand the body text" frameborder="0" loading="lazy" webkitallowfullscreen mozallowfullscreen allowfullscreen allow="clipboard-write" style="position: absolute; top: 0; left: 0; width: 100%; height: 100%; color-scheme: light;" ></iframe></div><!--ARCADE EMBED END-->
+
 ## View AI actions
 
 With the right permissions, you can view all AI actions configured in the application by navigating to the Admin Panel and selecting **AI actions**.

docs/content_management/create_edit_content_items.md

@@ -54,6 +54,9 @@ description: Create content for your website with different fields, rich text, t
 
     For more information, see [Publish content](publish_content.md).
 
+<!--ARCADE EMBED START--><div style="position: relative; padding-bottom: calc(51.27314814814815% + 41px); height: 0; width: 100%;"><iframe src="https://demo.arcade.software/T4dqNwZwGGpS3RaLHA6R?embed&embed_mobile=tab&embed_desktop=inline&show_copy_link=true" title="Create and edit article" frameborder="0" loading="lazy" webkitallowfullscreen mozallowfullscreen allowfullscreen allow="clipboard-write" style="position: absolute; top: 0; left: 0; width: 100%; height: 100%; color-scheme: light;" ></iframe></div><!--ARCADE EMBED END-->
+
+
 !!! note "Versioning and autosave"
 
     Whenever you edit a content item, a [new version](content_versions.md) is created in the repository.
@@ -99,7 +102,7 @@ Its options appear when you click inside the field box.
 
 ![Online editor menu](img/online_editor_menu.png "Online editor menu")
 
-You can chooose from available options to edit and customize Rich Text field, for example, move up or down its elements, select heading style, add text elements, like superscript, block quote, or anchor.
+You can choose from available options to edit and customize Rich Text field, for example, move up or down its elements, select heading style, add text elements, like superscript, block quote, or anchor.
 
 You can also add new elements to the field.
 To do it, choose one of the available elements:
@@ -118,7 +121,7 @@ To do it, choose one of the available elements:
 Each of these elements can have its own settings, such as text formatting.
 The option bar also lets you reorder or remove any elements in the Rich Text field.
 
-
+<!--ARCADE EMBED START--><div style="position: relative; padding-bottom: calc(51.27314814814815% + 41px); height: 0; width: 100%;"><iframe src="https://demo.arcade.software/wkdL1r9PRunTeF6hPtEs?embed&embed_mobile=tab&embed_desktop=inline&show_copy_link=true" title="Online Editor - work in Rich Text field" frameborder="0" loading="lazy" webkitallowfullscreen mozallowfullscreen allowfullscreen allow="clipboard-write" style="position: absolute; top: 0; left: 0; width: 100%; height: 100%; color-scheme: light;" ></iframe></div><!--ARCADE EMBED END-->
 
 #### Edit embedded content items
 

docs/content_management/create_edit_pages.md

@@ -38,18 +38,22 @@ You can now navigate away from the Page by clicking the **Close** button.
 
 !!! note "Autosave"
 
-    To help you preserve your work, [[= product_name =]] saves drafts of content items automatically.
+    To help you preserve your work, [[= product_name =]] saśves drafts of content items automatically.
     For more information, see [Autosave](content_versions.md#autosave).
 
 ## Edit page
 
 To edit an existing page, in the back office, from the content tree, choose the page that you want to edit, and click the **Edit** button.
 
+<!--ARCADE EMBED START--><div style="position: relative; padding-bottom: calc(51.27314814814815% + 41px); height: 0; width: 100%;"><iframe src="https://demo.arcade.software/d4T5EgOwz6bri2Zgy53M?embed&embed_mobile=tab&embed_desktop=inline&show_copy_link=true" title="Edit existing page" frameborder="0" loading="lazy" webkitallowfullscreen mozallowfullscreen allowfullscreen allow="clipboard-write" style="position: absolute; top: 0; left: 0; width: 100%; height: 100%; color-scheme: light;" ></iframe></div><!--ARCADE EMBED END-->
+
 ### Page Builder interface
 
 Page Builder has a plain and intuitive interface.
 You can create pages without having advanced technical skills.
 
+<!--ARCADE EMBED START--><div style="position: relative; padding-bottom: calc(51.27314814814815% + 41px); height: 0; width: 100%;"><iframe src="https://demo.arcade.software/kbdnGkdrkXL2VAJW6c3O?embed&embed_mobile=tab&embed_desktop=inline&show_copy_link=true" title="Page Builder interface" frameborder="0" loading="lazy" webkitallowfullscreen mozallowfullscreen allowfullscreen allow="clipboard-write" style="position: absolute; top: 0; left: 0; width: 100%; height: 100%; color-scheme: light;" ></iframe></div><!--ARCADE EMBED END-->
+
 ![Page Builder interface](img/page_builder_interface.png)
 
 Page Builder user interface consists of:
@@ -249,4 +253,4 @@ There are several options for saving work on the page:
 |Save draft|Save the page draft*.|
 |Delete draft|Delete the page draft.|
 
-* To help you preserve your work, system saves drafts of content items automatically. For more information, see [Autosave](https://doc.ibexa.co/projects/userguide/en/master/content_management/content_versions/#autosave).
+* To help you preserve your work, system saves drafts of content items automatically. For more information, see [Autosave](https://doc.ibexa.co/projects/userguide/en/master/content_management/content_versions/#autosave).

docs/content_management/preview_content_items.md

@@ -30,3 +30,6 @@ Additionally, if you select a specific SiteAccess from the **Site context** drop
 - when you hover over content items in the content tree, miniature previews appear
 - in Focus mode, when you browse content items in content tree, their full screen preview is displayed
 - if you [disable the Focus mode](../getting_started/discover_ui.md#disable-focus-mode) or click **Exit full view**, the **View** tab appears in the content item's details view, where you can quickly preview the content item
+
+<!--ARCADE EMBED START--><div style="position: relative; padding-bottom: calc(51.27314814814815% + 41px); height: 0; width: 100%;"><iframe src="https://demo.arcade.software/5Y1i3W29Jsg6J0za71GL?embed&embed_mobile=tab&embed_desktop=inline&show_copy_link=true" title="Preview an article,
+switch between sites and views" frameborder="0" loading="lazy" webkitallowfullscreen mozallowfullscreen allowfullscreen allow="clipboard-write" style="position: absolute; top: 0; left: 0; width: 100%; height: 100%; color-scheme: light;" ></iframe></div><!--ARCADE EMBED END-->

docs/content_management/schedule_publishing.md

@@ -46,6 +46,8 @@ Use it to remove the previously selected publication date.
 
 ![Discard publish later button in the menu](img/discard_publish_date.png "Discard publish later button in the menu")
 
+<!--ARCADE EMBED START--><div style="position: relative; padding-bottom: calc(51.27314814814815% + 41px); height: 0; width: 100%;"><iframe src="https://demo.arcade.software/pXVyhWY2v5qD5Q6oS2W6?embed&embed_mobile=tab&embed_desktop=inline&show_copy_link=true" title="Publish in the future" frameborder="0" loading="lazy" webkitallowfullscreen mozallowfullscreen allowfullscreen allow="clipboard-write" style="position: absolute; top: 0; left: 0; width: 100%; height: 100%; color-scheme: light;" ></iframe></div><!--ARCADE EMBED END-->
+
 You can also [reschedule or cancel planned publications](#reschedule-or-cancel-publication).
 To browse all the future events, use the [Calendar widget](#calendar-widget).
 

docs/content_management/work_with_forms.md

@@ -10,6 +10,10 @@ You can then review the results gathered from website users, for example, to imp
 
 For more information about building and styling forms, see [Developer Documentation]([[= developer_doc =]]/content_management/forms/forms).
 
+You can create a form with a visual drag-and-drop editor, the Form Builder.
+
+<!--ARCADE EMBED START--><div style="position: relative; padding-bottom: calc(51.27314814814815% + 41px); height: 0; width: 100%;"><iframe src="https://demo.arcade.software/6TuwPfbDTXTo6SnYSiyW?embed&embed_mobile=tab&embed_desktop=inline&show_copy_link=true" title="Form Builder interface" frameborder="0" loading="lazy" webkitallowfullscreen mozallowfullscreen allowfullscreen allow="clipboard-write" style="position: absolute; top: 0; left: 0; width: 100%; height: 100%; color-scheme: light;" ></iframe></div><!--ARCADE EMBED END-->
+
 ## Create forms
 
 Editors can use the created form anywhere on the website.
@@ -65,6 +69,10 @@ You can choose one of a few options of what is shown to the user after filling i
 
     For more information, see [Publish content](publish_content.md).
 
+**Check out the interactive demo below:**
+
+<!--ARCADE EMBED START--><div style="position: relative; padding-bottom: calc(51.27314814814815% + 41px); height: 0; width: 100%;"><iframe src="https://demo.arcade.software/YayMqLkQ6QeCZFeVyQxp?embed&embed_mobile=tab&embed_desktop=inline&show_copy_link=true" title="Build a form" frameborder="0" loading="lazy" webkitallowfullscreen mozallowfullscreen allowfullscreen allow="clipboard-write" style="position: absolute; top: 0; left: 0; width: 100%; height: 100%; color-scheme: light;" ></iframe></div><!--ARCADE EMBED END-->
+
 ## View results
 
 Once you publish a form and users start filling it in, you can preview the results in the **Submissions** tab in the content item view.

docs/content_management/workflow_management/editorial_workflow.md

@@ -27,4 +27,6 @@ If your installation is [configured to support draft locking]([[= developer_doc
 
 In the Review queue table, you can access the draft for editing, review its history, unlock the draft, or request that a lock is released.
 
-For more information, see [Work with versions](work_with_versions.md).
+For more information, see [Work with versions](work_with_versions.md).
+
+<!--ARCADE EMBED START--><div style="position: relative; padding-bottom: calc(51.27314814814815% + 41px); height: 0; width: 100%;"><iframe src="https://demo.arcade.software/6ADNUCnEPbEa6MAqWI9u?embed&embed_mobile=tab&embed_desktop=inline&show_copy_link=true" title="Assign an article to review" frameborder="0" loading="lazy" webkitallowfullscreen mozallowfullscreen allowfullscreen allow="clipboard-write" style="position: absolute; top: 0; left: 0; width: 100%; height: 100%; color-scheme: light;" ></iframe></div><!--ARCADE EMBED END-->

docs/content_management/workflow_management/work_with_versions.md

@@ -26,6 +26,7 @@ You can also do it in **My dashboard**, the **Review queue** table, by clicking
 If you're not assigned to the draft, depending on the permissions set for your role, in the **Review queue** table, you can either release the lock by clicking the **Unlock** icon, or request that the lock is released by the reviewer by clicking the **Request access** icon.
 
 ## Compare versions
+
 You can compare two versions of the same content item.
 
 To do it, [disable the Focus mode](../../getting_started/discover_ui.md#disable-focus-mode).
@@ -50,6 +51,8 @@ When you compare two versions, the system highlights the changes:
 
 ![Version comparison in Split view](img/split_view.png "Version comparison in Split view")
 
+<!--ARCADE EMBED START--><div style="position: relative; padding-bottom: calc(51.27314814814815% + 41px); height: 0; width: 100%;"><iframe src="https://demo.arcade.software/RRBS7OWNfcFMQOmiVgBs?embed&embed_mobile=tab&embed_desktop=inline&show_copy_link=true" title="Compare versions" frameborder="0" loading="lazy" webkitallowfullscreen mozallowfullscreen allowfullscreen allow="clipboard-write" style="position: absolute; top: 0; left: 0; width: 100%; height: 100%; color-scheme: light;" ></iframe></div><!--ARCADE EMBED END-->
+
 You can also compare media field types such as images.
 
 ![Image comparison](img/image_comparison.png "Image comparison")

docs/getting_started/dashboard/dashboard.md

@@ -40,4 +40,8 @@ By default, dashboard in [[= product_name_exp =]] and [[= product_name_com =]] c
 
 ![Dashboard - Experience and Commerce edition](dashboard.png "Default dashboard in Experience and Commerce edition")
 
-For more information, see [Work with dashboard](work_with_dashboard.md).
+For more information, see [Work with dashboard](work_with_dashboard.md).
+
+**Check out the interactive demo below:**
+
+<!--ARCADE EMBED START--><div style="position: relative; padding-bottom: calc(51.27314814814815% + 41px); height: 0; width: 100%;"><iframe src="https://demo.arcade.software/RowOtNIs36IO5DTmdbXP?embed&embed_mobile=tab&embed_desktop=inline&show_copy_link=true" title="Dashboard - How to navigate" frameborder="0" loading="lazy" webkitallowfullscreen mozallowfullscreen allowfullscreen allow="clipboard-write" style="position: absolute; top: 0; left: 0; width: 100%; height: 100%; color-scheme: light;" ></iframe></div><!--ARCADE EMBED END-->

docs/getting_started/discover_ui.md

@@ -104,6 +104,8 @@ Focus mode helps editors focus on information that is only relevant to their lin
 It's enabled by default, after you log in.
 If you need access to certain settings or technical details, you can [disable the focus mode](#disable-focus-mode) at any time.
 
+<!--ARCADE EMBED START--><div style="position: relative; padding-bottom: calc(51.27314814814815% + 41px); height: 0; width: 100%;"><iframe src="https://demo.arcade.software/2YM6EhsN5eeohdLzYBpi?embed&embed_mobile=tab&embed_desktop=inline&show_copy_link=true" title="Search and focus mode" frameborder="0" loading="lazy" webkitallowfullscreen mozallowfullscreen allowfullscreen allow="clipboard-write" style="position: absolute; top: 0; left: 0; width: 100%; height: 100%; color-scheme: light;" ></iframe></div><!--ARCADE EMBED END-->
+
 - **Dark theme for content tree**
 : In areas where the content tree is displayed, for example, in **Content structure**, the tree is displayed on a dark background.