TYPO3

Create and edit pages

This guide will help you edit pages and their properties and create new pages.

Understanding the page tree and menu

Each website is divided into pages, and each page can contain subpages. You can see this structure in the backend in TYPO3 as a page tree. In the frontend, i.e., on the website, the menu is built from these pages.

Pages at the top level are listed in the horizontal menu. Click on the menu item to see a dropdown menu with the subpages of that page.

Horizontal menu

Due to space constraints, the horizontal menu can display a maximum of 6 items.

Drop-down menu

The drop-down menu can contain a maximum of 3 sub-levels. Together with the top level listed in the horizontal menu, this means you have a maximum of 4 menu levels available for structuring your website.

Back-end menu vs. front-end menu

Here you can see a comparison of the TYPO3 backend (left), showing the site structure, and the frontend (right), showing the website navigation.

Each page created in the backend corresponds to a menu item in the frontend:

Main pages are displayed as main menu items, subpages appear in the drop-down menu.

→ The structure and order in the page tree therefore directly determine how the navigation for visitors is organised.

Create page

You can create different page types or folders above the page tree. Drag one of the icons to the desired location in the page tree to insert it:

  1. Standard: Creates a standard content page. This can be displayed in the menu and populated with content elements.
  2. Shortcut (internal link): Redirects to another page within your website. This option is useful if content is only to be maintained in one place.
  3. Link to external URL: Links to an external website. Visitors will leave the current website.
  4. Folder: Used for back-end organisation. Folders are not visible in the front end and are used, e.g., for data records or plugins.
  5. Menu Separator: Used for back-end organisation. Folders are not visible in the front end and are used, e.g., for data records or plugins.

Page title and URL can be set under Page properties in the General tab

New pages, links, and folders...

  • ...can be renamed immediately after creation. If you want to change the name later, you can do so by double-clicking on the page name in the page tree.
  • ...are initially deactivated or invisible so that they can be edited before publication. You can activate the page and make it visible using the context menu.

Enable, cut, copy, or delete page

You can use the context menu to further edit the page, for example, activate or deactivate it, cut, copy, or delete it.

To open the context menu, click on the icon in front of the page name in the page tree or right-click on the page name itself.

The options available to you in the context menu depend on your permissions.

Create a main menu entry without its own landing page

If a main menu item is to remain visible in the navigation but should not have its own content page, you can configure it so that visitors can only select the subpages below it. This is particularly suitable for main menu items without their own content.

  1. Open the page properties of the desired page.
  1. In the General tab, select the Shortcut option in the Type field.
  2. In the Shortcut mode field, select the First subpage of selected/current page option.

Save the changes.

The page will remain visible as a parent menu item in the navigation, but cannot be accessed via the dropdown menu.

→ Important: Update the URL of the page in question after making the change. Otherwise, automatically generated URL components (e.g. content-page) may remain and result in less user-friendly web addresses.

Edit page properties

To edit the properties or settings of a page, select Edit from the context menu for that page. Alternatively, click the Edit page properties button at the top of the workspace for the page in question.

On the start page, you can edit the following tabs:

General | SEO | Social media | Resources | Access

General tab - Set page title and URL here

Here you can edit the basic settings for the page:

  1. Type: Select whether the page should be a normal page, an internal link (reference), an external link, a folder or a menu separator.
  2. Page Title: Customise the page title. The page title is automatically displayed as an H1 heading and is mandatory for digital accessibility reasons.
  3. URL segment: Specify the page’s URL or update it by clicking the two circling arrows. Important: If the page is already online, the URL segment should not be changed, as this will alter the page’s address.
  4. Alternative Navigation Title: Enter a title here that will be displayed in the menu instead of the normal page title.

SEO tab

Here you can specify how search engines should handle this page.

  1. Title for search engines: Short, concise title for search results (approx. 55–60 characters).
  2. Description (for search engines): Concise text for search results (approx. 118–165 characters).
  3. Robot instructions
    1. Index this page: This page will be displayed by search engines in search results. Disable this option if you do not want this page to appear in search engine results.
    2. Follow this page: The web crawler is allowed to follow other links on this page

Social media tab

Here you can specify how the page will appear when shared on social media. For Facebook and X, you can add a title, description and an image that will be displayed in the preview.

  1. Open Graph (Facebook)
  1. X / Twitter Cards
  1. Card type to be displayed
    1. Summary Card: displays the title, description and a small preview image
    2. Summary Card with large image: displays the title, description and a large preview image spanning the full width.

Resources tab - Set header here

  1. Media: You can add an image or video under Create new relation.
  2. Shadow: Optionally, you can add a shadow to the header image. The shadow is displayed to the right and below the image. To do this, select one of the seven accent colours.

Access tab

  1. Visibility
    1. Page visible: The page is accessible/not accessible to all users.
    2. Page enabled in menus: The page is displayed/not displayed in the menu.
  2. Publish Date: Determines when a page becomes accessible online.
  3. Expiration Date: Determines how long the page remains visible online. After that, it is automatically hidden.
  4. Usergroup Access Rights: Here you can specify which user groups are permitted to view the page. If a group is selected, the page will only be visible to logged-in users in that group. Visitors without the appropriate permissions will not be able to access the page.

Do you have any questions?

Do you have questions or comments about the TYPO3 instructions?

To top