The TYPO3 news system

Instructions

TYPO3 self-study for beginners

In the TYPO3 self-study course for beginners part 1 you will learn how the news system in TYPO3 is basically structured and how you can create your own news. In the exercise, you will use a system prepared for you in the sandbox, in which you can add new news items.

In the TYPO3 self-study for beginners part 3 you will return to this tutorial and learn more about creating news overviews and detail pages. In the exercise for Part 3, you will then build your news pages from scratch yourself.
We recommend that you repeat the first part of these instructions when working on Part 3. However, if you still have the content to hand, you can of course skip directly to the topics for Part 3.

About the TYPO3 news extension

The TYPO3 news system helps you to manage current news centrally and present it in a targeted manner on your website - with a system that is easy to maintain after a one-time setup and even provides an RSS feed for external use.
In the instructions you will learn step by step how to set up the page structure and content correctly so that your news is presented in a professional, clear and versatile way.

Use:

  • For current information that loses relevance over time
    In contrast to other information on your website that is of permanent interest, news are current messages that are subject to constant dynamics. As a rule, the news is therefore listed chronologically in descending order, so that newer news items gradually replace the old ones.
  • Archive date and expiration date
    When you create your messages, you can control when they can "only" be found via the archive of older messages and when they are no longer displayed because they are simply no longer relevant to anyone. In this way, you can keep your current messages clear and interesting for readers. After all, nothing is as old as yesterday's news!

This is what it looks like

Live view of the content item

News article list in standard layout

Click on a message for the detailed view.


How it works

The principle

The basic principle is that each news item is only recorded once - in a central location - and can then be automatically output in several places in the appropriate layout.

Your news is also provided in RSS format(Rich Site Summary). This makes it possible to integrate your news feed (from the English "to feed" - in the sense of supplying, feeding, delivering) into any other website, even outside the RPTU websites. In addition, interested parties can subscribe to the RSS channel and thus always be informed about new news.

For this system to work, you need these central components:

Overview page (Page)

This page shows a collection of current news items with a title and, if applicable, a teaser text. In addition, the RSS feed is automatically generated from this page.
If you click on a news item from the list here, the complete news item opens either directly on the overview page (instead of the news list) or in a new page specifically for the detailed view.

Detailed view (page)

If you want to display the individual messages on a separate page, create a detailed view page for this purpose. Here you define the basic layout in which an individual message is to be displayed.
The actual message is inserted automatically later. You therefore do not need to create a separate page for each individual message.

Data source (system folder)

You store all news centrally in a so-called system folder. The overview and detail pages access this data source via the news plugin (see below) and display the content automatically.

News (data set)

The messages (news) are saved as a single data record in the news folder (data source) with the message text, title and, if desired, an image and other properties of the message.

News plugin (used in content elements)

The news plugin is an integral part of the content elements used for the news system. It establishes the connection to the other components already mentioned.
You place a news article list (or another news system content element) on your website and specify in the plugin settings where the news is stored and how it should be displayed on the respective page.


Step by step

Illustrated instructions

News system in TYPO3

Step 1: Create page structure

Before you can create content, you must create a meaningful page structure in the TYPO3 page tree. This structure forms the basis for the subsequent presentation and management of the news.

  • Overview page ("News list")
    A content element of the news article list type will be inserted here later, which shows an overview of all published news.
    You can of course also use an existing page, e.g. your homepage, news or similar.
    Type: Normal page

  • Detailed view ("Newsdetail")
    A content element of the detailed view type is inserted here later, which displays a single news item in full.
    The page is hidden in the menu. To do this, deactivate the option "Page activated in menus" in the page properties under "Access".
    When placing the page in the page tree, please note that the URL of this page is decisive for which URL the individual news items will receive.
    Type: Normal page, hidden in the menu

  • News folder ("News")
    A special folder for storing all news records. It is best to create folders for individual years below the news folder. This makes it easy to remove old messages in the future.
    Type: Folder
Simplified setup

In a simplified setup, you can dispense with a separate detailed view page. When you click on a news item in the news overview, the complete news item is then opened directly on the overview page instead of the previously displayed news overview. This procedure is particularly suitable if there is only a little content on your overview page other than the news overview.

If, for example, you want to place a news overview on your home page alongside numerous other content elements, we recommend using a detail page to display the complete news item. This opens the individual news item in a new page, the layout of which you can design specifically as a news view.

Example

Your page structure could now look as follows:

  • Homepage
  • Subpage 1
  • Subpage 2
  • News list" page
    • "News detail" page (not required in the simple setup)
  • Storage" folder
    • Folder 1
    • Folder 2
    • News" folder
      • 2025
      • 2026

Step 2: Create message content

Once you have created the structure, you can create message content. This content will be displayed later in the frontend.

 

  • Switch to the Web > List module and navigate to the News folder that you created previously.
  • Click on the + symbol ("Create new data record") in the top bar.

You now have the choice of what type of data record you would like to create.

  • Select "Article" under "News system" to create a data record of the type "News".
  • Assign a headline and a short teaser text for your news item.

    The teaser text appears in the news overview and determines whether your message is clicked on and read. It should be short, concise and easy to understand. Use relevant keywords and activating formulations.

Examples
  • Study on learning motivation
    Psychology researchers are investigating how digital tools promote learning.
  • Campus run on June 15
    Get off to a sporty start: the campus run combines fitness and community.
  • Application deadline for Master's programs
    The deadline for Master's applications is 15 July. Discover and apply for the right program now.
  • Workshop: Presentation techniques
    In 90 minutes to convincing presentations - practical and compact.
  • Under Archive, indicate when the message is no longer relevant and should therefore be archived. You can later decide whether and where currently active and/or archived posts should be displayed on your website.
  • If necessary, check the "Is an event" box for event notices in order to be able to use additional fields such as "Event location" or "Event category". You can later decide whether or where on your website posts marked as an event should be displayed or not.
  • Finally, enter the message text.
Details for events

If you have activated the "Is event" option, you can enter further details about your event under the message text.

  • Under Event location, you can create a new event location using the + button ("Create new") on the far right. (You must first save your event notice before you can create an event location in it). The location data record is then saved in your message folder and can be easily selected for further events under available objects.

    Go to your news folder ("News") and switch to the List module to display and edit existing location records. (You can also create new event locations in the news folder independently of a news article via + Create record ).

  • You can use the Event category field to divide your news into different event categories. The available categories are predefined here.
  • Fill in the fields: Event type, Event registration link, Event language, Event target group, Event language.
  • Create additional fields if required: Event costs, More information
  • In the Content elements tab, you can add individual content elements to your message, which are then displayed below the content of the standard fields (which you have defined in the General tab).

    Such additional content elements are only necessary or useful in rare cases. In order to maintain the uniform presentation of your messages, you should generally make do with the standard fields.
  • Switch to the Media tab to add one or more images to your message.
  • Specify for which views the respective image should be used, for detail view and/or list view.
    Please note that images are only displayed in a list view if a corresponding template layout is selected. (see step 3: Setting up the news overview).
  • Add an alternative text (mandatory field).
  • If you only want your message to appear on the website from a certain point in time, set the publication date in the Access tab.
    You can also set an expiration date for messages that are no longer of interest from a certain point in time. The message is then automatically deactivated for the selected period and no longer displayed anywhere.
  • If required, you can make further settings for your message, for example in the Categories tab.
    By using categories, you can then control, for example, that only messages for this target group are displayed on a target group website.
  • Once all settings have been made, select Save in the top ribbon to save your newly created message data set.

TYPO3 self-study for beginners part 1

Tutorial

We have already set up a news system for you in the sandbox.

  1. Create various news items in the "News" folder, with and without an image, as an event, ...
  2. Open the "News" page. Your news items should now be displayed.

To the sandbox

Let's continue:

 

To the overviewNext topic

Step 3: Set up news overview
  • Open the Newslist page in the Web > Page module.
  • Add a new content element. Select the type
    • News article list for the standard setup,
    • News article list (incl. detailed view) for the simple setup.
  • Switch to the Plugin tab.
  • In the settings under Archive, specify whether (also) archived messages should be listed.

    To keep your view up to date and clear, usually select Only active (not archived) here.
    If required, you can create an additional overview page for archived messages only.
  • Enter the storage location of your news records under Starting point.
    Select your news folder.

It is best to enter the ID of the desired news folder in the search field to ensure that you link the correct folder.

  • If you have created a separate news detail page, switch to the More settings tab.
    Page ID for single view: Select your news detail page.
  • If you want to select whether no news or only news marked as an event should be displayed in the overview, switch to the Event news tab.

    Select the desired event restriction.
    • Defined in TypoScript (default, corresponds to "No restriction")
    • No restriction
    • Only events
    • All except events
  • If you do not want to use the standard layout for the news overview, switch to the Template tab.
    Select a suitable template layout to define the presentation of the overview according to your wishes.

    You can find out what the different layouts look like and what they are suitable for in the overview of template layouts.

    Layouts available for news overviews (as of 2025):

    • Standard list view
    • List view without images
    • List only images (60%-100% width)
    • 3 teaser pyramid (100% width)
    • 3 teaser cards (100% width)
    • 3 teaser events (100% width)
    • List with cards monthly view (100% width)
    • List Events (66%-100% width)
    • List classic with image (66%-100% width)
    • Teaser with title (without image)
  • Save the news article list.

Step 4: Set up detailed view

For a simplified setup without a separate news detail page, skip this step.

  • Open the Web > Page module and select the Newsdetail page.

  • Add a new content element.

    Select the News article detail type.

  • If you do not want to use the standard layout for the detailed view, switch to the Template tab.
    Select a suitable template layout to define the display of the view according to your requirements.

    You can find out what the different layouts look like and what they are suitable for in the overview of template layouts.

    Layouts available for detailed views (as of 2025):

    • Event detail page
    • Press release detail page
    • Detail page Standard
  • Save the detailed view.

To ensure that all pages work together as desired, make sure that you do not make any settings in the news plugin that you use on the detailed view page (e.g. for the starting point) that differ from the settings in the plugin on the overview page.

Step 5: Check the result in the frontend

Load the news list page in the frontend. Your created news items should now be visible. Clicking on the title of a news item takes you to the detailed view on the News detail page.

TYPO3 self-study for beginners part 3

Exercise

  1. Create a web page "News overview" and a news folder.
  2. Create various news items in the news folder, with and without images, as an event, ...
  3. Add the heading "News overview" and a news article list to the web page, which lists the news from the news folder and can display individual news items in detail.
  4. Check the result in the frontend.
  5. Try out different template layouts.
  6. Add at least 2 more content elements in front of the existing news article list.
  7. Then copy your website "News overview" and rename the copy to "Project XY". Change the heading accordingly.
  8. Create a "News detail" page with the heading "News" and a detailed view of the news articles. Use the same news folder as before.
  9. Configure the news overview on the "Project XY" page so that the individual news items are displayed on the "News detail" page.
  10. Check the result in the frontend. Do you recognize the difference between the configuration with and without the detail page (page "News overview" vs. page "Project XY")?

To the sandbox

Let's continue:

 

To the overviewNext topic


Learn more

Relevant information

For more detailed information on setting up, configuring and customizing the news system in TYPO3, we recommend taking a look at the official documentation for the extension. There you will find comprehensive explanations of data records, plugins, templating and other functions:

TYPO3 News Extension - Documentation

This is what the various template layouts of the Typo3 news system look like.