Whilst this tutorial does not cover templating in TYPO3, this section is intended to answer both of these questions and give you a brief introduction to TYPO3’s templating engine and also discuss best practices for managing your sites HTML templates, stylesheets and other assets.
Introducing Fluid ¶
Fluid is TYPO3’s templating engine. Fluid acts as the glue between your static HTML templates and the content you create in TYPO3’s backend.
A typical Fluid template will contain HTML that defines the structure of your page and Fluid tags that call various types of dynamic content.
For example a simple web page that features a navigation menu, a few paragraphs of text and a company logo would contain three Fluid tags.
- One to insert the content element that contains our text.
- Another to call the Typoscript menu for our main navigation bar
- And a third to insert the company logo
Fluid’s syntax is easy to learn and is very similar to HTML by design.
Where are templates stored ¶
You can store your HTML templates in Fileadmin alongside your projects static content such as documents and images. This is a convenient way of storing your files when you are first starting out with Fluid. It is also very common to find templates stored in Fileadmin on older, legacy TYPO3 projects.
However, using Fileadmin to store your templates comes with considerable drawbacks. The main issue being that you cannot prevent backend users from accessing and potentially deleting your sites HTML templates with no easy ability in place to retrieve the files once they are deleted.
Sitepackages are a convenient way of bundling your sites HTML,CSS and other assets into a single, reusable extension. By using Sitepackages we can:
- Move all of our assets into a single extension, meaning they can be managed more easily in version control with multiple contributors.
- Store our templates alongside other Extensions in the ext/ directory, preventing backend users from accessing them.
- Install our Sitepackage using a one click installation process, making it easier to deploy across multiple instances.