From 54d86563143e9b9a883ac16117fcf4d64c6981cf Mon Sep 17 00:00:00 2001 From: "lina.wolf" Date: Fri, 6 Feb 2026 08:04:14 +0100 Subject: [PATCH] [TASK] Use lightboxes and galleries for screenshots Releases: main, 13.4 --- Documentation/Administration/BackendUsers/Administrator.rst | 4 ++++ Documentation/Administration/BackendUsers/Groups.rst | 3 +++ Documentation/Concepts/Backend/LayoutModule/Index.rst | 1 + .../Concepts/Backend/SiteManagement/TypoScript.rst | 1 + .../Concepts/Backend/SystemMaintainerArea/Index.rst | 1 + Documentation/Concepts/TypoScript/Index.rst | 1 + Documentation/FirstProject/CreateRootPage.rst | 6 ++++++ Documentation/FirstProject/CreateSitePackage.rst | 1 + Documentation/FirstProject/Settings.rst | 4 ++++ Documentation/FirstProject/SiteManagement/Index.rst | 3 +++ Documentation/Installation/ApplicationContext.rst | 1 + Documentation/ProjectTemplates/GitLabTemplate/Index.rst | 4 ++++ 12 files changed, 30 insertions(+) diff --git a/Documentation/Administration/BackendUsers/Administrator.rst b/Documentation/Administration/BackendUsers/Administrator.rst index e39cf919..cd33503d 100644 --- a/Documentation/Administration/BackendUsers/Administrator.rst +++ b/Documentation/Administration/BackendUsers/Administrator.rst @@ -75,6 +75,7 @@ you can go to module `Administration > Users Users` and click on "Create new backend user" @@ -82,6 +83,7 @@ and create a new administrator there. When creating the user check the "Admin" option: .. figure:: /Images/ManualScreenshots/BackendUser/CreateAdmin.png + :zoom: gallery :alt: The Admin option is the first option in the tab "General" in the backend user edit form When you check the Admin option the form needs to reload once. Answer the dialogue with "OK". @@ -98,6 +100,7 @@ Access the Install Tool at `https://my-site.ddev.site/typo3/install.php` using the Install Tool password defined during the installation process. .. figure:: /Images/ManualScreenshots/BackendUser/InstallTool.png + :zoom: gallery :alt: The Install Tool: Create Administrative User, Create new administrative users and grant them system maintainer privileges (optional). In the module "Maintenance" module use the button "Create Administrator". @@ -124,6 +127,7 @@ Using the module :guilabel:`System > Settings` and card should be granted "System Maintainer" rights. .. figure:: /Images/ManualScreenshots/BackendUser/ManageSystemMaintainers.png + :zoom: gallery :alt: "Manage System Maintainers" window in the module System > Settings. Disabled backend admins are marked with [DISABLED], you can choose them any way. diff --git a/Documentation/Administration/BackendUsers/Groups.rst b/Documentation/Administration/BackendUsers/Groups.rst index acc171ac..f0db3261 100644 --- a/Documentation/Administration/BackendUsers/Groups.rst +++ b/Documentation/Administration/BackendUsers/Groups.rst @@ -54,6 +54,7 @@ the previous step have access to the :guilabel:`Media` module, however, as the file mount is created automatically, they will only see an error message: .. figure:: /Images/ManualScreenshots/BackendUser/MissingFolderPermissions.png + :zoom: gallery :alt: Error message: Missing folder permissions. You have no access to the folder "1:/user_upload/". Error message when a user with the auto-generated groups opens the :guilabel:`Media` module @@ -68,6 +69,7 @@ Right click on the folder in the directory tree and choose "New Filemount" from the context menu: .. figure:: /Images/ManualScreenshots/BackendUser/CreateNewFilemount.png + :zoom: gallery :alt: New filemount option in the dropdown of a folder in the Media module in the TYPO3 backend Create a new filemount, give a name to it and save it @@ -114,6 +116,7 @@ You can fix such page permissions recursively in the module :guilabel:`Administr Permissions`. .. figure:: /Images/ManualScreenshots/BackendUser/PermissionsModule.png + :zoom: gallery :alt: The page permissions module in the TYPO3 backend. You can then fix the permissions recursively. It is recommended to have a group diff --git a/Documentation/Concepts/Backend/LayoutModule/Index.rst b/Documentation/Concepts/Backend/LayoutModule/Index.rst index a7aa8d98..8c3808c8 100644 --- a/Documentation/Concepts/Backend/LayoutModule/Index.rst +++ b/Documentation/Concepts/Backend/LayoutModule/Index.rst @@ -43,6 +43,7 @@ The "New Page Content" wizard ============================= .. figure:: /Images/ManualScreenshots/Backend/NewPageContentWizard.png + :zoom: lightbox :alt: Screenshot of a "New page content" wizard in a standard TYPO3 installation The "New page content" wizard diff --git a/Documentation/Concepts/Backend/SiteManagement/TypoScript.rst b/Documentation/Concepts/Backend/SiteManagement/TypoScript.rst index ac6c5808..8bc95d15 100644 --- a/Documentation/Concepts/Backend/SiteManagement/TypoScript.rst +++ b/Documentation/Concepts/Backend/SiteManagement/TypoScript.rst @@ -26,6 +26,7 @@ The TypoScript module consists of the following submodules. You can switch them in the docheader: .. figure:: /Images/ManualScreenshots/Modules/TypoScript.png + :zoom: lightbox :alt: Screenshot of the TypoScript module in the backend demonstrating the location of the submodule switch, a drop down in the document header Switch between the TypoScript submodules in diff --git a/Documentation/Concepts/Backend/SystemMaintainerArea/Index.rst b/Documentation/Concepts/Backend/SystemMaintainerArea/Index.rst index 15bc377d..044d6e7b 100644 --- a/Documentation/Concepts/Backend/SystemMaintainerArea/Index.rst +++ b/Documentation/Concepts/Backend/SystemMaintainerArea/Index.rst @@ -94,6 +94,7 @@ Or you can set a new password by entering your desired password on the Install Tool login page, then copying the calculated hash: .. figure:: /Images/ManualScreenshots/AdminTools/InstallToolHash.png + :zoom: lightbox :alt: Screenshot demonstrating copying the calculated hash in the install tool Copy the calculated hash diff --git a/Documentation/Concepts/TypoScript/Index.rst b/Documentation/Concepts/TypoScript/Index.rst index 0896612d..34cb443a 100644 --- a/Documentation/Concepts/TypoScript/Index.rst +++ b/Documentation/Concepts/TypoScript/Index.rst @@ -86,6 +86,7 @@ Open the backend module :guilabel:`Sites > TypoScript > Active TypoScript`. .. figure:: ActiveTypoScript.png + :zoom: lightbox :alt: Screenshot of the submodule "Active TypoScript" in the module "Sites > TypoScript" Switch the submodules of module :guilabel:`Sites > TypoScript` diff --git a/Documentation/FirstProject/CreateRootPage.rst b/Documentation/FirstProject/CreateRootPage.rst index 930a2470..2dd42dd2 100644 --- a/Documentation/FirstProject/CreateRootPage.rst +++ b/Documentation/FirstProject/CreateRootPage.rst @@ -41,6 +41,7 @@ Click on the :guilabel:`Layout` module to open the page tree. .. figure:: /Images/ManualScreenshots/CreateRootPage/CreateNewPage.png + :zoom: gallery :alt: The "Content > Layout" module in the TYPO3 backend with a context menu to create a new page * In the page tree, right-click on the "root level" or the top node of the page @@ -64,6 +65,7 @@ Now, you need to configure the new page: "Use as Root Page". Ensure this is checked. .. figure:: /Images/ManualScreenshots/CreateRootPage/SetRootPage.png + :zoom: gallery :alt: Page properties, tab "Behaviour", highlighting the "Use as root page" .. _create-root-page-save: @@ -77,6 +79,7 @@ form. Your new root page will now appear in the page tree on the left. The page is only visible in the Backend at this point .. figure:: /Images/ManualScreenshots/CreateRootPage/PageCreated.png + :zoom: gallery :alt: Backend module "Content > Layout" with a newly created but still disabled root page The root page is disabled, therefore it is marked with the red icon. @@ -92,6 +95,7 @@ If you have created a new page in the root of the page tree, the site configurat created automatically and you can edit it: .. figure:: /Images/ManualScreenshots/CreateRootPage/AutogeneratedSiteConfig.png + :zoom: gallery :alt: The auto-generated site of a new root page viewed in the "Sites" module You can find the auto-generated site configuration for your root page in @@ -113,6 +117,7 @@ The site needs a theme, also known as a "site package" in the TYPO3 world. Learn the page in the frontend: .. figure:: /Images/ManualScreenshots/CreateRootPage/NoTypoScriptFound.png + :zoom: gallery :alt: Error message: No TypoScript record found! Error message when no site package is installed or configured @@ -130,6 +135,7 @@ Enable the page when you are ready :guilabel:`Enable` the page as newly created pages are hidden by default. .. figure:: /Images/ManualScreenshots/CreateRootPage/EnablePage.png + :zoom: gallery :alt: A disabled root page and its context menu Right click on the newly created page and chose `Enable` from the context menu. The red icon should disappear. diff --git a/Documentation/FirstProject/CreateSitePackage.rst b/Documentation/FirstProject/CreateSitePackage.rst index ec24f34e..80de5c83 100644 --- a/Documentation/FirstProject/CreateSitePackage.rst +++ b/Documentation/FirstProject/CreateSitePackage.rst @@ -39,6 +39,7 @@ To create a site package, you have two main options: and include the sets in your `site configuration `_. .. figure:: /Images/ManualScreenshots/CreateSitePackage/SitePackageBuilder.png + :zoom: lightbox :alt: Screenshot of the site package builder at get.typo3.org demonstrating the installation steps Click on "Composer-based TYPO3 installation" for the commands to install the site package diff --git a/Documentation/FirstProject/Settings.rst b/Documentation/FirstProject/Settings.rst index 4294a942..2eec6dea 100644 --- a/Documentation/FirstProject/Settings.rst +++ b/Documentation/FirstProject/Settings.rst @@ -37,6 +37,7 @@ default installation, can be made in the :guilabel:`System > Settings > Extension Configuration` submodule. .. figure:: /Images/ManualScreenshots/AdminTools/ExtensionConfiguration.png + :zoom: gallery :alt: Screenshot demonstration the location of the Extension Configuration in module "Settings" You can find the global Extension Configuration in module Settings @@ -45,6 +46,7 @@ After opening the submodule, you can make your changes and hit "Save": .. figure:: /Images/ManualScreenshots/AdminTools/ExtensionConfigurationDetail.png + :zoom: gallery :alt: Screenshot of the Extension Configuration submodule Make changes and hit "Save". @@ -69,6 +71,7 @@ the "Site Identifier". For demonstration purposes, we use "my-site" here. The Site Identifier is also used as the path for saving the configuration file. .. figure:: /Images/ManualScreenshots/SiteManagement/SiteIdentifier.png + :zoom: gallery :alt: Screenshot demonstration field "Site Identifier" in a site configuration The Site Identifier can be changed in this field @@ -90,6 +93,7 @@ keep this file under version control, you must commit and push the changes made to this file. .. figure:: /Images/ManualScreenshots/SiteManagement/SiteSettingsOverview.png + :zoom: gallery :alt: Screenshot of the Site Settings Overview You can find all sites in the "Settings" module. If editable settings are available, there is a button "Edit Settings" diff --git a/Documentation/FirstProject/SiteManagement/Index.rst b/Documentation/FirstProject/SiteManagement/Index.rst index 4789dbd6..d6d28e34 100644 --- a/Documentation/FirstProject/SiteManagement/Index.rst +++ b/Documentation/FirstProject/SiteManagement/Index.rst @@ -33,6 +33,7 @@ the button :guilabel:`Add new site configuration` next to the relevant page to create a site configuration for it. .. figure:: NewSite.png + :zoom: gallery :alt: Screenshot of the "Sites" module with no site created yet Create a new site configuration @@ -57,6 +58,7 @@ have one. You can learn how to create a site package in the :ref:`TYPO3 Sitepackage Tutorial `. .. figure:: NewSitePage1.png + :zoom: gallery :alt: Screenshot of the tab "General" of a newly created site configuration Enter the basic data and choose the site set @@ -65,6 +67,7 @@ Since our set already depends on the set of `fluid_styled_content`, it is not necessary to choose that set here. .. figure:: NewSitePageLanguage.png + :zoom: gallery :alt: Screenshot of the tab "Languages" of a newly created site configuration Create a language for your site by selecting it from the list of presets diff --git a/Documentation/Installation/ApplicationContext.rst b/Documentation/Installation/ApplicationContext.rst index 8f519c5e..fe2a2f74 100644 --- a/Documentation/Installation/ApplicationContext.rst +++ b/Documentation/Installation/ApplicationContext.rst @@ -12,6 +12,7 @@ TYPO3 Application context: Development or Production ==================================================== .. figure:: _ApplicationContext/ApplicationContextInformation.png + :zoom: lightbox :alt: Screenshot showing the current application context in the "System Information" box The current application context is displayed on the top-right in the "System Information" box diff --git a/Documentation/ProjectTemplates/GitLabTemplate/Index.rst b/Documentation/ProjectTemplates/GitLabTemplate/Index.rst index 345b5052..419aff68 100644 --- a/Documentation/ProjectTemplates/GitLabTemplate/Index.rst +++ b/Documentation/ProjectTemplates/GitLabTemplate/Index.rst @@ -24,6 +24,7 @@ or to path `/new#create_from_template` on your self-hosted GitLab. And chose :guilabel:`TYPO3 Distribution` from the list: .. figure:: UseTemplate.png + :zoom: gallery :alt: The "TYPO3 Distribution" entry on the "Create from template" page on GitLab. Click on "Use template" @@ -34,6 +35,7 @@ Fill in project details ======================= .. figure:: ProjectDetails.png + :zoom: gallery :alt: Detail page when creating a project from a template in GitLab Fill in the details @@ -47,6 +49,7 @@ Clone the project to your local machine. You can download the SSH link from the :guilabel:`Code` dropdown: .. figure:: GitClone.png + :zoom: gallery :alt: Screenshot demonstration the location of the Code button where you can copy the Clone with SSH link Copy the "Clone with SSH" link @@ -116,6 +119,7 @@ A default user has been created. Username and password are displayed in your console. .. figure:: Backend.png + :zoom: gallery :alt: TYPO3 Backend of a project created with the GitLab Template Once logged in, you can preview a page and see it rendered with a basic theme.