Features in TYPO3 11 LTS

Introduced in version 11.3

The List module lets backend users work with various database records. Users can now easily select the columns to be shown in the list. This was possible in older TYPO3 versions but only in the “single table view”. The updated user interface makes it much easier for users to add and remove columns.

TYPO3 integrators can customize the view by applying a few lines of User TSconfig, and can disable the “column selector” for specific tables or for all tables as required.

Documentation

Introduced in version 11.3

The List module has an extended view to access further functions such as displaying extra details or seeing the change history on content elements. These functions are secondary actions that backend users need less frequently in their daily work. Previously the extended view was activated by a checkbox, which then applied the view to all the tables on the page.

With TYPO3 version 11.3, the checkbox has been removed, and  users can access the secondary functions for each table individually (using the button with three vertical dots).

Introduced in version 11.3

Do you know that backend users can download almost all database tables as CSV files from the List module? Of course, appropriate access permissions to the tables are required. This "export" functionality has long been part of TYPO3 Core but was sometimes missed by users.

In TYPO3 v11.3, the download button is now prominently displayed in the header of each table. But that’s not all. Instead of a simple CSV download, backend users can now customize the export. A dialog box lets users configure the file name and the format (CSV or JSON), along with other settings.

Introduced in version 11.3

Previous TYPO3 v11 sprint releases already received some well-received improvements for the page and file tree as well as for the Record Selector. These components now feature super-fast and lightweight techniques such as the underlying SVG-based code. We started tackling another area in TYPO3 v11.3 that requires an overhaul: selecting files and records from a list.

Let’s look at an example: adding images to a page using the “Text and Media” content element. The “Add media file” button displays a modal window to select one or more files from a list. Backend users can now enable a checkbox on the left-hand side for each file, or open a context menu and check/uncheck all elements with one click. They can also toggle the current selection.

You will also find this great functionality in another often used area of the TYPO3 backend: the file list module. 

Introduced in version 11.3

The TYPO3 Core is now compatible with PHP version 8.0. This PHP version receives security updates for at least the next 28 months from now, until November 2023. Developers can leverage many new features, optimizations, and improvements of the programming language that powers TYPO3. Read more about PHP version 8 on php.net.

The compatibility with PHP version 7.4 also remains in place.

Documentation

Introduced in version 11.2

In TYPO3 v9, we reworked the page tree, switched to a SVG-only approach, and removed all ExtJS code from the backend. This resulted in super-fast rendering times and has made working in the page tree much smoother. We further optimized this area in v10 and reworked the “Filelist” backend module in TYPO3 v11.1 earlier this year. Since then, the folder list uses the same lightweight technique as the page tree. Guess what — we did not stop there!

Both components, the page tree and the file/folder list, also appear in the “Record Selector”. This is the modal window that lets users select a page, a file, a folder, an external URL or an email address, etc. The Record Selector now features the same state-of-the-art components and architecture for the page tree and the file/folder list.

Users can, for example, apply a filter and collapse the tree component. Content elements are now much easier to find and select. They appear neatly listed in the content area. An input field at the top lets users filter the folder list based on search terms. TYPO3 even takes file names into account and shows a list of folders that contain files matching the pattern that users specify.

We used the SVG-only technology that is lightweight, slim, and renders super-fast in all modern browsers. As the data is loaded using JSON-based AJAX, only the required parts of the trees are fetched from the server. The same applies to the content area which results in an incredible performance boost when working in the backend.

Whenever a tree component (page or file tree) comes into play, its visual appearance and functions are now streamlined and consistent across the TYPO3 backend. Backend users can even use their keyboard to navigate within the tree components.

Introduced in version 11.2

Some members of the TYPO3 community scratched their heads when we announced our intention to implement deep linking and link sharing for the TYPO3 backend. What are the benefits and do we really need this feature?

Deep links are nothing unusual in the frontend. If you are interested in TYPO3 Association memberships, for example, you visit the typo3.org website and navigate to the respective page. You eventually end up at typo3.org/project/association/membership. This link represents the path to the piece of web content on the website. You can bookmark this link in your browser and/or send it to your colleagues.

Users now have this option when they work in the TYPO3 backend too. You will soon realize how amazing and helpful this feature is.

Let’s look at a few examples of what you and your backend users can do with deep linking and link sharing.

If two or more editors are responsible for maintaining the content of a website, they can now easily point their colleagues to a specific target in the backend. This is not limited to a page. Backend users can, for example, share a deep link to a particular content element:

“Hello Spock. I updated the crew roster page as discussed. Could you please add your working shifts to the following content element:
https﹕//example.com/typo3/record/edit?edit[tt_content][3]=edit.
Thanks, Uhura.”

Backend users who frequently update the same content of a page now have the option to bookmark the link and open it directly. If they are not logged in to the backend yet, the login form appears, and the user is automatically redirected to the right target once successfully authenticated.

Those experienced with TYPO3 often have to guide a newcomer or client through the backend. Sometimes in an email, sometimes remotely on the phone. Do instructions like the following sound familiar to you?

“Please locate the module ‘Web’ in the backend on the left-hand-side, then click on ‘List’. Now choose the page ‘Star Trek Actors’ from the page tree. If you don’t know where the page is located in the page tree, enter the name in the search box. Once you click the page, locate the table ‘Voyager’ in the content area. Then...”

This is all history now. Integrators and clients can simply share a deep link. The recipient follows the link and ends up at the right place. Quick and easy.

There is no doubt that backend users will embrace this feature as it makes working in the backend much more efficient.

Introduced in version 11.2

System locales are used to localize various formats across the system. Locales are generated on the server and are basically conventions on how to use date and time formatting, currency display, etc.

In older versions of the CMS, when setting up a new site for their instance, TYPO3 integrators had to enter the locale identifier by hand. To make it faster to set up a site and its languages, TYPO3 v11.2 now detects which locales are available on the system and lists them in a dropdown box.

Integrators can now easily select the appropriate item from the list making it a time saver and less prone to error.

Introduced in version 11.1

When you log in to the backend of TYPO3, you control a wide range of functions. Depending on your level of access, you can edit the contents of your company’s online presence, change business-critical data, or access highly sensitive user information. This great power needs to be protected so that only you have access to it.

Sometimes, a user name and password is just not secure enough. Multi-factor authentication (MFA) addresses this by adding a second factor to the login process or even multiple factors. The use of two factors is also referred to as two-factor authentication (2FA). When implemented correctly, MFA makes it significantly more difficult for an adversary to gain unauthorized access. That’s why MFA is considered one of the most effective security measures in information systems today.

When introducing an additional authentication method, it’s important to consider the user experience. If the login process becomes too cumbersome and complicated, users don’t configure it and miss out on an increased security level.

With our users at front-of-mind, we implemented a modern, secure, easy-to-use, and flexible MFA solution in TYPO3 version 11.1. You could say: "Your key to the galaxy!"

Once an administrator has activated an MFA provider, backend users can use it as a second authentication method for their login process. Typical providers are, for example, time-based one-time password (TOTP), counter-based one-time password, or WebAuthn. WebAuthn is a state-of-the-art web standard published by the World Wide Web Consortium (W3C) and supported by modern versions of Chrome, Firefox, and Edge browsers.

Following our promise to let TYPO3 site owners customize as many aspects of an instance as possible, the MFA implementation in TYPO3 allows developers to create additional providers. Check out the working examples “mfa_yubikey” (by Torben Hansen), “mfa_hotp” (by Oliver Bartsch), and “mfa_webauthn” (by Benjamin Franzke).

Documentation

Introduced in version 11.1

Space travelers around the galaxy know how important a user-friendly control panel is. It can save your life if you detect meteor showers early during your journey. As a TYPO3 backend user, your life usually doesn’t depend on it. Still, the option to adjust the backend view to your individual needs makes your day-to-day work easier and more pleasant.

The navigation area has had a fixed width since TYPO3 version 8. This area is the second column from the left in the backend, which shows the page tree (when modules under the “Web” section are accessed) or the file list (section “File”). Sometimes, the fixed width caused problems. In TYPO3 instances with long page titles and page trees with many levels, the contents in this area were cut off.

We reworked this component and reintroduced a resizable navigation area in TYPO3 version 11.1. We also got rid of a lot of JavaScript code.

We moved the icon to collapse and reopen the navigation area inside the panel. This location is now a better place from a usability perspective. You don’t need to readjust the navigation area’s width every time you re-login to the backend. TYPO3 remembers the last setting and restores the previous state on the next login.

By using CSS/Flexbox scaffolding, browsers now load the TYPO3 backend faster. Also, less data is transferred between TYPO3 and the client, which improves performance.

Documentation

Introduced in version 11.1

The module “Filelist” received a visual overhaul in TYPO3 v11.1. Using the same lightweight technologies as the page tree does, both components now feature a consistent look and feel in the navigation area. This change also means that we removed the iframe that was previously used by the module.

The main benefit is a performance boost, but you will also notice an input field at the top. This field lets you filter down the folder list based on search terms, similar to the page tree filter many backend users are used to in the page tree. The search in the file list even takes file names into account.

Documentation

Introduced in version 11.1

We are continuously striving to improve accessibility so that  people with diverse hearing, movement, sight, and cognitive ability can use the TYPO3 backend.

Following the suggestions by the WAI-ARIA Authoring Practices 1.1, users can now navigate through the main module menu and the help menu by using only their keyboard. This group also includes users with screen readers or similar assistive technology.

Another accessibility improvement is that you can now set an alt-tag for a custom backend login image. To help users comply, a warning is triggered in the deprecation logs when no alt-tag exists.

Documentation

Introduced in version 11.0

As part of a visual refresh, we switched the TYPO3 backend from Bootstrap 3 to 5. Initially released in 2011, Bootstrap is the world’s most popular frontend open-source toolkit today. The decision to use version 5 (which is still a beta-version at the time of writing) puts TYPO3 at the forefront of modern content management systems from a UI perspective.

Backend users won’t need to learn how to use a new user interface with Bootstrap 5. They might, however, notice a few minor usability changes in TYPO3 v11.0. The new Bootstrap version also adds a few accessibility improvements to the TYPO3 backend.

Documentation

Introduced in version 11.0

Redirects typically aim to forward your website visitors from an old to a new destination—for example, a page. In many cases, these redirects are only required for a certain amount of time. Site administrators can now configure TYPO3 to automatically remove redirects based on specific criteria, for example, their age, domain, or hit count. Backend users (e.g., editors with appropriate access privileges) can mark redirects as “protected” to prevent their deletion.

Documentation

Introduced in version 11.0

As part of streamlining the authentication process I mentioned earlier, we reworked some components of the TYPO3 Core responsible for frontend and backend user authentication. In previous versions of TYPO3, the user session handling was part of the user authentication components of the TYPO3 Core. We reworked these in TYPO3 v11.0 and separated the user object, the authentication process, and the session handling.

We created a dedicated session handling API that offers core and extension developers centralized handling of sessions. The new UserSession object contains all session-related data. Developers should use the UserSessionManager to create new sessions.

Documentation

Introduced in version 11.0

If you’re an extension developer whose code uses an authentication component, you are encouraged to keep an eye on related PHP classes—for example, the class  “AbstractUserAuthentication” which received a software redesign in preparation for the multi-factor authentication (MFA).

See:

• https://docs.typo3.org/c/typo3/cms-core/master/en-us/Changelog/11.0/Breaking-92989-AbstractUserAuthentication-loginFailureRemoved.html
• https://docs.typo3.org/c/typo3/cms-core/master/en-us/Changelog/11.0/Breaking-92990-AbstractUserAuthentication-svConfigRemoved.html
• https://docs.typo3.org/c/typo3/cms-core/master/en-us/Changelog/11.0/Breaking-92997-Authentication-relatedHTTPCacheHeadersAreEmittedOnlyByPSR-15Middlewares.html
• https://docs.typo3.org/c/typo3/cms-core/master/en-us/Changelog/11.0/Breaking-93047-RemovedPropertySendNoCacheHeadersInAbstractUserAuthentication.htm

Documentation

Introduced in version 11.0

Developers should also observe the development of Extbase’s Dependency Injection (DI). We plan to deprecate and remove the current implementation in Extbase and use the feature offered by the TYPO3 Core instead. This solution is based on the PSR-11 standard and incorporates Symfony’s industry-proven DI concepts.

Documentation

Introduced in version 11.0

The “Workspaces” feature is one of TYPO3’s unique selling points. Workspaces let editors work collaboratively on versioned content of a TYPO3 site and review/preview pages before publishing them. At the most basic level, you can configure permissions so that backend users can only edit content in an isolated workspace. Every change requires a supervisor’s approval, which gives you full control of which content goes live and when. However, TYPO3’s Workspaces are often overlooked—and that’s what we aim to change!

In TYPO3 v11.0, we started to improve the underlying code and addressed some conceptual issues. In further releases, we will stabilize existing functionality, update the documentation, improve the user experience, and introduce new features.

Documentation

Introduced in version 11.0

I cannot say often enough how vital unified standards are. Using coding guidelines and following official recommendations, we make sure that the TYPO3 Core architecture meets the highest standards and uses state-of-the-art technologies. The PHP Framework Interop Group issues and publishes exactly such standards: the well-known PSR standards. We already adopted a wide range of them and introduced the PSR-11 ContainerInterface, PSR-14 EventDispatchers, and PSR-15 Middlewares in previous TYPO3 versions.

PSR-7 and PSR-17 are not new to the TYPO3 world either. These standards describe common interfaces for representing HTTP messages. In simple terms: how PHP applications receive and generate HTTP requests, and how they should respond to them.

We continuously improve the TYPO3 Core according to these standards and have made PSR-7 Request/Response objects available for extension developers and integrators in even more places—for example, in custom-developed content objects (“cObjects”).

Documentation

Introduced in version 11.0

This initiative also affects the Extbase framework. To comply with PSR standards, controller actions should return an instance of the “Psr\Http\Message\ResponseInterface” from now on:

Extbase controller actions return ResponseInterface

It may sound like a massive task for extension developers to update their existing code. However, the advantages are apparent. Developers will have much more control over the responses and, using the ResponseFactory, it is easy to adjust the response even further. Have a look at the change log to learn more and look up some examples.

It is worth mentioning that the typical old ResponseInterface behavior (of not returning anything) triggers a deprecation warning in TYPO3 v11, which you find in the logs. Still, it will continue to work for the time being and there is enough time to update your code before it produces an error in TYPO3 v12.

Documentation