Portal:Template Development

<translate> This page contains many links to selected documentation concerning Template Development for and . A good place to start is with the Recommended Reading articles below as they provide a good introductory base of knowledge to build on. </translate>

What's a Joomla! Template?</translate>

A template is a type of Joomla! extension that changes the way your site looks. There are two types of templates used by the Joomla! CMS: Frontend Templates and Backend Templates. The Frontend Template controls the way your website is presented to the user viewing the website's content. The Backend Template controls the way your website's administrative tasks are presented for controlling management functions by a Joomla! Administrator. These include common tasks such as: user, menu, article, category, module, component, plugin and template management.
See also: Component, Module, Plugin

As a developer, you are probably are more interested in how to create a Frontend Template.

Template Development Articles

<translate> Our template development documentation contains many articles, FAQs and tutorials. A first step to developing a template is understanding how templates are executed. </translate> <translate>

Beginners

</translate> <translate>

• Changing the site favicon
• Using Firebug With Your Joomla Website
• Using Joomla's Default Icomoon Fonts

</translate> <translate>

Intermediate

</translate> <translate>

• jdoc statements
• How to cloak email addresses  
• Understanding Output Overrides  
• Layout Overrides in Joomla!  
• Creating clickable background images using CSS
• Using Class Suffixes

</translate>

<translate> List of all articles belonging to the categories "FAQ" AND "Template Development"</translate>

• <translate>

Extensions GPL notices</translate>

• <translate>

Extensions distribution</translate>

• <translate>

Extensions name</translate>

• <translate>

How do you change the favicon?</translate>

• <translate>

How do you change the images in your template?</translate>

• <translate>

How do you list your extension in the extensions site?</translate>

• <translate>

How to add a span element to menu entries</translate>

• <translate>

Template FAQ</translate>

More general template information? See Web Designers FAQs

<translate> Template Developer Tutorials</translate>

<translate>

• Add text to an article using template overrides
• Adding custom fields to core components using a plugin
• Adding JavaScript
• Adding stylesheets for other output devices
• Advanced topics
• Amending the templateDetails.xml file
• Changing the site favicon
• Collapsing columns
• Converting A Previous Joomla! Version Template
• Counting modules in a given module position
• Creating a basic index file
• Creating a basic Joomla! template
• Creating a basic templateDetails.xml file
• Creating a thumbnail preview image
• Creating clickable background images using CSS
• Custom error pages
• Customising the dynamic page title
• Customising the way modules are displayed
• Declaring module positions
• Discover your template css-styles and learn how to change them
• Distributing Joomla! templates

</translate>

<translate>

• Extension Installer
• File structure for packaging
• Getting Started with Templates
• Giving the Front Page a different style from other pages
• Hide column to avoid width issues
• Horizontal centering
• How do you change the images in your template?
• How to override the output from the Joomla! core
• Installing a template
• JDocumentHTML/countModules
• Making templates translatable
• Modifying a Joomla! Template
• More advanced Joomla! templates
• Sharing layouts across views or extensions with JLayout
• Switching templates
• Templates supplied with Joomla!
• Migrating a Template from Joomla 1.5 to 3.x
• Understanding Joomla! templates
• Upgrading a Joomla 1.5 template to Joomla 2.5
• Using Class Suffixes

</translate>