---
title: Introduction to TYPO3 Parent and Child Theme Concept
url: "https://nitsantech.de/en/blog/concept-architecture-for-the-future-typo3-theme-manager"
description: "Have you ever heard the theme concept of parent and child theme in TYPO3 CMS? Many CMS have such fundamentals to create themes and templates for better productivity, quality, productivity and faster development."
image: "https://nitsantech.de/fileadmin/_processed_/6/f/csm_concept-and-architecutre-of-the-future-typo3-theme-manager_d2dc7c9e17.jpg"
author: Sanjay Chauhan - TYPO3 Technopreneur
date: 2019-11-26
modified: 2026-01-29
lastUpdated: 2026-02-25
categories:
  - TYPO3 CMS
---

# Introduction to TYPO3 Parent and Child Theme Concept

The future TYPO3 Theme Manager | Concept & Architecture
===========================================================

 26 Nov 2019

 [![](https://nitsantech.de/fileadmin/ns_theme_nitsan/Team_Slider/Sven_Thelemann.png)](https://nitsantech.de/en/blog/author/sven-thelemann)

 [Sven Thelemann](https://nitsantech.de/en/blog/author/sven-thelemann)

 [ TYPO3 CMS ](https://nitsantech.de/en/categories/typo3-cms)

TYPO3 does not have common standards to create a theme or template for the website. Using the Parent and Child theme concept, there are chances to design the backend theme manager module because every theme will be developed in a common framework and standards.

 ![The future TYPO3 Theme Manager | Concept & Architecture](https://nitsantech.de/fileadmin/ns_theme_ns2019/blog/live/Parent_Child_Theme_concept/Einf%C3%BChrung_in_das_TYPO3_Parent_und_Child_Theme_Konzept_.jpg)

   Table of content

I got a chance to deliver my talk about the concept of **“Essential Solutions for TYPO3 Productivity“** at last *TYPO3 developer days 2019 at Karshure, Germany*. Fortunately, got good feedback and appreciation from the lovely TYPO3 audience especially for TYPO3 parent/child theme framework. You can watch a video at [https://youtu.be/EiIKz-wK6z8?t=920.](https://www.youtube.com/watch?t=920&v=EiIKz-wK6z8&feature=youtu.be)

In this blog I’d like to share you a glimpse about the concept of parent theme hierarchy and reiteration in TYPO3. Happy reading :)

  ![TYPO3 needs Backend Theme Manager](https://nitsantech.de/fileadmin/_processed_/e/c/csm_parent_child_TYPO3_theme__14__db4d73855e.png "TYPO3 needs Backend Theme Manager")

In our opinion, the TYPO3 base and child theme concept will be able to help to draw the future of TYPO3 CMS - especially on theme-market. Because one of the most important thing that is missing in TYPO3 is “Backend: Plug-n-play Theme Manager”. IMHO: To get good CMS market-share, the TYPO3 community should implement asap.

With this fact, TYPO3 does not have common standards to create a template or [theme for the TYPO3 website](https://nitsantech.de/en/blog/typo3-templates). Using the Parent and Child theme concept, there are chances to design the backend theme manager module because every theme will be developed in a common framework and standards.

And... That’s our dream for the future!

Have you ever heard the theme concept of parent and child theme in CMS? Many CMS have such fundamentals to create themes and templates for better productivity, quality, productivity and faster development.

### Parent theme includes global configuration

- Useful in all the projects
- Global TypoScript constant & setup
- Global configuration to easily create custom elements
- Global TYPO3 extensions

### Child theme includes custom configuration

- Used in a particular project
- TypoScript constant & setup
- Custom content elements
- Specific TYPO3 extensions

### What’s most important?

- Follows TYPO3-core standards
- Saves energy, time and money
- Hassle-free future TYPO3 upgrades

That’s why our team NITSAN decided to implement such theme concept into [**TYPO3 CMS**](https://nitsantech.de/en/blog/typo3-perfect-cms-for-everyone). We have developed one TYPO3 extension and named it ns\_basetheme.

### Where can you find base-theme?

- **TER:** [https://extensions.typo3.org/extension/ns\_basetheme](https://extensions.typo3.org/extension/ns_basetheme)
- **Composer:** <https://packagist.org/packages/nitsan/ns-basetheme>

### Where can you find child-theme?

- **Composer:** <https://packagist.org/packages/nitsan/ns-theme-child>

### Features

We have considered implementing the following features into the base-theme:

- Pre-configured common configuration (include base typoscript, fluid etc)
- Pre-configured bootstrap theme (default theme)
- Pre-configured routing (config.yaml)
- Pre-configured page tree (automatically import page tree)
- Pre-configured lints (php, typoscript, yaml etc)
- Pre-configured composer support
- Pre-configured forms (core EXT:form)
- Pre-configured rich editor (core EXT:ckeditor)
- Pre-configured backend Typoscript (PageTSConfig)
- Pre-configured DataProcessing and Hooks (PHP APIs)
- Pre-configured smartly developed custom elements (in child theme)

### Architecture of EXT:ns\_basetheme

For the base-theme, we have considered configuring all commonly used default configuration.

  ![Architecture of EXT:ns_basetheme ](https://nitsantech.de/fileadmin/ns_theme_ns2019/blog/live/Parent_Child_Theme_concept/parent_child_TYPO3_theme__1_.png "Architecture of EXT:ns_basetheme ")

Child theme is actually your theme, where setup of your [**TYPO3 website**](https://nitsantech.de/en/blog/typo3-website) would take place. Child theme would be developed by extending Parent theme to re-use all the pre-configured setup.

### Architecture of EXT:ns\_theme\_child

In the child-theme, we have considered configuring all specifically used configuration to your particular TYPO3 site.

  ![Architecture of EXT:ns_theme_child](https://nitsantech.de/fileadmin/ns_theme_ns2019/blog/live/Parent_Child_Theme_concept/parent_child_TYPO3_theme__2_.png "Architecture of EXT:ns_theme_child")

### Practical-demo of TYPO3 parent & child theme

To understand it more, Let’s have one practical demo with setup and configure a TYPO3 site ;) For a quick demo, let’s use one of the popular DDEV and composer-based TYPO3 instance.

### **Clean Blog: Theme Sample**

Let’s have a goal to quickly install and configure one of our famous [TYPO3 clean-blog theme](https://extensions.typo3.org/extension/ns_theme_cleanblog).

- Demo: [https://demo.t3planet.com/t3-cleanblog/](https://demo.t3planet.de/t3-cleanblog/)
- TER: [https://extensions.typo3.org/extension/ns\_theme\_cleanblog](https://extensions.typo3.org/extension/ns_theme_cleanblog)
- Git: [https://github.com/nitsan-technologies/ns\_theme\_cleanblog/](https://github.com/nitsan-technologies/ns_theme_cleanblog/)
- Composer: <https://packagist.org/packages/nitsan/ns-theme-cleanblog>
- Pro-support: [https://t3planet.com/t3-clean-blog-free-typo3-template](https://t3planet.de/en/t3-clean-blog-free-typo3-template)

  ![Clean Blog: Theme Sample](https://nitsantech.de/fileadmin/_processed_/b/2/csm_parent_child_TYPO3_theme__3__2e67a7061d.png "Clean Blog: Theme Sample")

### **Install EXT:ns\_basetheme**

Once you are done with all the above steps, you will be able to see clean bootstrap theme as default theme of EXT:ns\_basetheme.

  ![Install EXT:ns_basetheme](https://nitsantech.de/fileadmin/_processed_/9/1/csm_parent_child_TYPO3_theme__4__b0bc6fd9a9.png "Install EXT:ns_basetheme")

**Step 1:** Create a project folder
mkdir t3-demo
cd t3-demo

**Step 2:** Configure PHP version
ddev config --project-type php --php-version 7.2

**Step 3:** Setup latest TYPO3 version
ddev composer create "typo3/cms-base-distribution:^9" --no-interaction --prefer-dist
ddev config --project-type typo3
ddev start

**Step 4:** Install ns-basetheme
ddev composer require nitsan/ns-basetheme

**Step 5:** Setup your site URL
Go to Sites > ns\_basetheme > Change Entry Point with your site-URL.

  ![Install EXT:ns_basetheme](https://nitsantech.de/fileadmin/ns_theme_ns2019/blog/live/Parent_Child_Theme_concept/parent_child_TYPO3_theme__5_.png "Install EXT:ns_basetheme")

### **Install & Configure EXT:ns\_theme\_cleanblog**

**Step 1:** Download TYPO3 child-theme
ddev composer require nitsan/ns-theme-cleanblog

  ![Install & Configure EXT:ns_theme_cleanblog](https://nitsantech.de/fileadmin/_processed_/0/2/csm_parent_child_TYPO3_theme__6__302dbeeca0.png "Install & Configure EXT:ns_theme_cleanblog")

**Step 2:** Done! You don’t need to perform any other steps. The page tree in backend will automatically create and all-configuration of child clean-blog theme will be configured and ready to launch!

  ![Theme ready to launch](https://nitsantech.de/fileadmin/ns_theme_ns2019/blog/live/Parent_Child_Theme_concept/parent_child_TYPO3_theme__7_.png "Theme ready to launch")

One more interesting thing I would like to share, Imagine, if you want to create “custom-element” using TYPO3 core then you would need to perform the following many-steps.

- Initiate CType Definition (with tt\_content\_defValues.CType)
- Prepare backend configuration with Flexform (with tt\_content\_defValues.CType)
- Add CType at PageTS Config (with mod.wizards.newContentElement.wizardItems.extra)
- Prepare [**TypoScript**](https://nitsantech.de/en/typoscript-conditions-with-symfony-expression-language) (with elementname = FLUIDTEMPLATE)
- Add into TypoScript Setup (with tt\_content.elementname)
- Register Icon (with IconRegistry::class)
- Setup /Configuration/TCA/Overrides/tt\_content.php (with addTcaSelectItem)
- Render through your Fluid Template
- And, so on.,

BUT to make it easier and faster, at our EXT:ns\_basetheme, we have smartly developed techniques to quickly develop custom-element with following steps in your child-theme EXT:ns\_theme\_name.

**Step 1:** Create ns\_\*.xml at /Configuration/Flexform/

  ![Custom element configuration](https://nitsantech.de/fileadmin/ns_theme_ns2019/blog/live/Parent_Child_Theme_concept/parent_child_TYPO3_theme__8_.png "Custom element configuration")

**Step 2:** Create ns\_\*.html at /Resources/Private/

  ![Custom element configuration ](https://nitsantech.de/fileadmin/_processed_/4/7/csm_parent_child_TYPO3_theme__9__aab2141d37.png "Custom element configuration ")

**Step 3:** Done! No more steps ;)

  ![Configuration done](https://nitsantech.de/fileadmin/ns_theme_ns2019/blog/live/Parent_Child_Theme_concept/parent_child_TYPO3_theme__10_.png "Configuration done")

Wait.. Do you want to have a cool backend preview?

  ![Back end preview](https://nitsantech.de/fileadmin/ns_theme_ns2019/blog/live/Parent_Child_Theme_concept/parent_child_TYPO3_theme__11_.png "Back end preview")

**Step 4:** Create Ns\*.html at /Resources/Private/Backend/

  ![Resource file setup](https://nitsantech.de/fileadmin/ns_theme_ns2019/blog/live/Parent_Child_Theme_concept/parent_child_TYPO3_theme__12_.png "Resource file setup")

Our favourite feature is to have easiness and hassle-free future [**TYPO3 upgrade**](https://nitsantech.de/en/services/typo3-upgrade-service) version. Checkout following screenshot, the child theme does not have even a single PHP file so there are no-more deprecation and breaking changes.

Whenever a new TYPO3 version is released, we just need to resolve ns\_basetheme’s breaking changes and deprecation, and just upgrade ns\_basetheme at all your TYPO3 instance to make theme compatible with TYPO3 latest version. Is it cool, huh?

  ![One upgrade for all TYPO3 projects](https://nitsantech.de/fileadmin/ns_theme_ns2019/blog/live/Parent_Child_Theme_concept/parent_child_TYPO3_theme__13_.png "One upgrade for all TYPO3 projects")

We would love to receive your feedback and suggestions to keep improving such exciting parent and child theme concept to productively develop TYPO3 sites. Based on your feedback, we will be happy to write more in-depth blog series on the concept of TYPO3 parent and child theme.

Have a Happy TYPO3 Theming!

#### Contact for Internet agency and TYPO3 projects

#### Sven Thelemann

Service Partner - Germany

 [ st@nitsantech.de ](mailto:st@nitsantech.de) [ +49 351 48196661 ](tel:4935148196661)

 ![Sven Thelemann](/fileadmin/ns_theme_nitsan/CTA/SVEN__1_.png "Sven Thelemann")

![](https://nitsantech.de/fileadmin/ns_theme_nitsan/Team_Slider/Sven_Thelemann.png)

### Sven Thelemann

Client Service Lead

- [](https://www.linkedin.com/in/sven-thelemann-0a30867b/ "linkedin")

Sven Thelemann serves as the Client Service Lead at NITSAN, focusing on delivering TYPO3 solutions that meet client goals. With a strong understanding of technology and client expectations, he ensures smooth communication and project execution. Outside of work, Sven enjoys cycling and experimenting with homemade recipes.

  <a id="c9786"></a>Comments and Responses
----------------------

 Thank you for your comment. Your Comment Added Successfully.

Thank you for your comment. Your Comment Will Be Visible After Approval.

Oops! Something went wrong, please try again later.

##### **Be the First to Comment**

  <a id="c9787"></a> ### Related Blogs

 [ ![](https://nitsantech.de/data:,)

#### TYPO3 CMS for Public Sector Websites: Requirements and Best Practices

 ](https://nitsantech.de/en/typo3-public-sector-2026)

 [ ![](https://nitsantech.de/data:,)

#### TYPO3 SEO: Improve Your TYPO3 Website Ranking

 ](https://nitsantech.de/en/blog/typo3-seo)