Pages

Working with the page tree

Page module

There are two ways to add a new page to your website: either drag the icon for a new page to the desired position in the page tree, or right-click on an existing page and use the context menu.

To start adding pages:

In the backend, select the Web > Page module.

Expand the page tree so that all subpages are visible (optional).

Adding pages to the page tree

You can create a new page by dragging a page icon from the top bar of the page tree to the desired position using drag-and-drop.

Creating a page using drag-and-drop:

Select the page type you wish to add by choosing one of the icons. In this example, we are creating a standard page.

Drag the icon either between two existing pages to create a sibling page, or onto an existing page to create a subpage.

Give the new page a title.

New pages are disabled by default. To enable a newly created page, right-click on the page and select ‘Enable’. Alternatively, you can enable the page in the ‘Access’ tab of the page properties.

Add pages using the context menu

1. Right-click on an existing page and select “More options” > “Create new page” from the context menu.
2. The “Create New Record” screen appears.
3. Select the position for the new page in the page tree by clicking on one of the black arrows.
4. In the “Create New Page” screen, enter a title for the page. Optionally, you can enable the page in the “Access” tab to make it visible on the front end.

Creating multiple pages

1. Position the cursor in the page tree on the page that is to serve as the parent page for the new pages.
2. Right-click on the page and select “More options” > “Create multiple pages” from the context menu.
3. The “Create multiple pages” screen appears with five blank pages.
4. Assign a title to each new page and select its type. Click on “Add more rows” to create five additional pages, if necessary.
5. Configure the new pages using the options at the bottom of the screen:

• “Place new pages below existing subpages” adds new pages below the existing subpages. Otherwise, they will be placed above them.
• “Hide new pages” and “Hide new pages in the menu” control the visibility of the new pages.
• A hidden page is not accessible via the website. A page that is hidden in the menu does not appear in the navigation, but can be accessed via the direct URL.

1. Click on “Create pages” to create the new pages.

Manage pages

• Move pages: Select the page you wish to move and drag it to the desired position in the page tree. A horizontal line indicates the new position. If the background of an existing page is outlined in grey, the moved page will become a sub-element of that page. Release the mouse button and select “Move this element” in the confirmation message.
• Copying pages: Select the page you want to copy and drag it to the new position in the page tree. Release the mouse button and select “Copy” in the confirmation message.
• Deleting pages: Select the page you wish to delete and drag it to the right to display the “Delete” option.
• Context menu: Right-clicking on a page opens a context menu with various functions.
• Filter the page tree: There is a filter tool at the top of the page tree. Enter a word or a number to filter the page tree by matching page titles or page IDs.

Standard page types in TYPO3

• Page (Default): The most common and default page type, covering all basic requirements.
• Backend user area: This page type is only visible to a specific group of backend users in the frontend and requires login in the backend.
• Shortcut: A link to another page in the page tree. When this page is accessed, the user is redirected directly to the target page.
• Mount Point: Allows you to select another page in the page tree, whose subpages are displayed as subpages of the mount point. This duplicates the navigation, but not the page content.
• External URL: Similar to the shortcut type, but takes the user to a page on another website.
• Special
  • Folder: A container for records that is not displayed in the frontend.
  • Recycler: Removed in version 13.0. The Recycler module should be used instead.
  • Menu Separator: Creates a visual separation in the page tree, which can also be displayed in the front-end navigation using TypoScript.

Custom page types: Depending on the project, custom page types may also be available.

Page properties

To edit the page properties, click on the "Edit page properties" icon in the docheader.

The available page properties depend on the page type, user permissions and the configuration of the TYPO3 installation.

• General: Contains general information about the page. Here you can change the page type and edit the title and URL. The page title is used for descriptive URLs and in menus. An alternative navigation title can also be set.
• SEO: Used for search engine optimisation. Uses the cs_seo system extension.
• Social media: Enriches social media snippets for the page’s URL and uses the typo3/cms-seo system extension.
• Metadata: The available fields depend on the website configuration, e.g. abstract, author name, and last update.
• Appearance: Affects how the page is rendered. Backend layouts can be assigned to align the layout in the backend and frontend. You can also specify that the content of another page is displayed.
• Behaviour: Determines various aspects of the page, e.g. link targets, cache duration, use as root page, include in search, hide subpages in the page tree, and include plugins.
• Resources: Allows you to link media files to the current page; how these are handled depends on the frontend configuration.
• Language: Controls the visibility of the page based on localisation.
• Access: Controls the visibility of the page.
• Categories: TYPO3 offers a system-wide categorisation tool. Categories can be applied to pages, content elements and files.
• Notes: Used for editorial notes and internal comments that are only visible in the backend.