Busy Noggin's Framework for TemplaVoila

Skip navigation and go to main content

• Introduction
• The Approach
• Workflow
• Templates
• Download
• Contact & Info

• About this Approach
• Adaptable Layouts
• Core Templates & Skins
• Standardization
• Mapping Blocks vs. Elements
• Editor Experience & Back End Layout

About this Approach

This framework is not about getting TYPO3 or TemplaVoila to do new things.

So, what is it?

Simply a workflow supported by a code base and set of best practices to produce visually-varied sites quickly and consistently using TemplaVoila.

To use the techniques presented in this site, at a minimum you need to:

• have a solid understanding of HTML and CSS.
• have the ability to look at a visual layout and determine the HTML structure needed to produce it for the web (i.e. where you need div's, what needs floats, etc.)
• be able to write HTML with a text editor. If you use a visual editor that keeps you from dealing with the source then you will not be able to use this framework.
• have some ability in coding TypoScript (or know someone who does)

Ideally, you will:

• have worked through the TemplaVoila tutorial entitled Futuristic Template Building.
• have experience in building sites with TemplaVoila (the more the better)
• have strong experience in coding TypoScript, HTML, CSS and JavaScript

My guess is that developers who use TemplaVoila to build a lot of sites will find it easier than most to understand this framework since they are already familiar with TypoScript, front-end code and TemplaVoila.

Adaptable Layouts  >>

• Adaptable layouts
• Core templates and skins
• Code standardization
• Mapping blocks vs. elements
• Editor experience & back end layout

If you have used TemplaVoila before, you are familiar with building full static files with HTML, CSS and JavaScript and then mapping them in TemplaVoila. In this framework this process has been flipped around. The templates are already mapped and working; therefore, your templating process involves using TypoScript to adjust the HTML and then using CSS to adjust the styling. 

Learn the How
Not Just the What

After reviewing the general concepts in this section you can find out how to use them in Workflow.