Feature Highlight: Create landing pages with TYPO3

First things first, you might be wondering: what is the TYPO3  Page Tree?
It’s the visual representation of your website’s structure.
The Page Tree is hierarchical, meaning that it’s organized and made up of top-level landing pages and nested under those “parent” pages, various subpages or “child” pages.

To add a new page, simply right click on your Page Tree and select the “New” option.

Once you’ve named your new page it will appear in the Page Tree. In the example below, I’ve added a page called “Bad Apples”. 
Keep it at the highest level to make it a landing page, or drag the line page and move it under another landing page (like “Kinds of apples,” in the example below) to make it a subpage.

By default, TYPO3 will generate automatic navigation from your Page Tree structure. If you have a header menu on your website, the menu items will be the top-level landing pages. If a parent page has child pages, those child pages will be nested under the landing page (as with the “Kinds of apples” subpages below).

TYPO3 also generates automatic slugs based on page and subpage titles. (Slugs are the segment of the URL that identifies which page you’re on, i.e., the “community”  typo3.org/community). In the example below, the page “Braeburn” is a subpage of “Kinds of apples” and so the automatically generated slug follows the format: root_address/landing_page_title/subpage_title.

You can change the slug if you want to customize it. For example, you might want to abbreviate a longer page name for social sharing or include SEO keywords in addition to those in the title.

When you’re building a page from scratch, you can either build it from a default page type like a “Standard” page that allows you to create a basic webpage, or other default options. In TYPO3, your developers or website admins can also configure custom page types, which enforce a certain layout or content types on a page-by-page basis (for example, an FAQ page would have a different layout than a blog post). 

Whether you’re building from a default or custom page type, you must fill out the following pieces of information to create a new page:

• Type: Select from a dropdown menu listing all possible page types available.
• Page Title: Name how your page will appear in the Page Tree.
• URL Segment: Optionally, you can change the automatically generated slug (we recommend sticking with the default naming conventions). 

Alternative Navigation Title: Write how your page will appear in navigation menus (your website menus will default to your Page Title if you leave it blank).

A content elementis a structured element that formats different building blocks of a page — like text and media, headings, or footers. They ensure consistent formatting and layout across your website. To build a landing page in TYPO3, we highly recommend adding content through these structured elements.  

As with pages, you can build a page out of the default content elements included in TYPO3 Core, like a Header or the “Text & Media” element, or you can create custom content elements, based on your website’s specific needs.
Here is a good example for the TYPO3 demo site where the editors created a custom content element called “Keyvisual” which includes a headline, text, image, and an optional CTA.

To try it out, visit the demo site’s backend and add a custom content element to the webpage by clicking on the “+ Content” button and selecting the “Keyvisual” content element from the popup menu. 

You can add (or choose not to add) data in each respective field. Once your fields have been filled out, save your content element.

You can now preview how it looks on the page. If you add the same “Keyvisual” content element to any other landing pages, then you can be confident they will follow the same layout and formatting as the one shown below.