Revision as of 11:31, 2 May 2008

Suggested outline for the new template tutorials. This suggests a breakdown into numerous smaller tutorials.

Introduction to Joomla! templates

• What is the purpose of a template?
• What can you do with a template?
• Templates supplied with Joomla!
• How to switch templates
• How to install templates

Understanding Joomla! templates

• Where are templates located?
• What is the typical template directory structure?
• What is the purpose of the templateDetails.xml file?
• What is the purpose of the index.php file?

Upgrading a Joomla! 1.0.x template

• New features introduced in Joomla! 1.5 templates
• Legacy mode
• Upgrading your index.php file
• Upgrading your templateDetails.xml file
• Changes to CSS classes
• Replacing patTemplate

Customising the default Joomla! templates

• Pros and cons of table layout
• Understanding the Milkyway template
• Understanding the Beez template
• Customizing the Milkyway template
• Customizing the Beez template
• Troubleshooting modified templates
• What to avoid when modifying a template

Creating a basic Joomla! template

• Setting up a directory structure
• Verifying permissions
• How to edit the files
• Creating a basic templateDetails.xml file
• Creating a basic index.php file
• Testing the template

More advanced Joomla! templates

• Quirks mode and how to avoid it
• Which DocType header to use
• Setting up page width
• About CSS page layouts
• Source ordering
• Horizontal and vertical centering
• PHP essentials (eg. echo, if-then-else)
• Adding images
• Changing image paths of default system images
• Declaring module positions
• Finding module positions on any given page
• Changing the site favicon

Cascading Style Sheets (CSS)

• Where to put CSS files
• Using multiple CSS files
• List of Joomla! generated core CSS classes (with explanations)
• Suggested CSS methods to introduce new declarations or alter generated ones
• Page class suffixes
• Module class suffixes
• Supporting multiple browsers

More on Joomla! modules

• Counting modules in a given module position
• Counting modules in multiple module positions
• Collapsing columns
• Creating rounded corners
• What is module chrome?
• Applying custom module chrome
• Cascading module chrome styles

Web Standards

• What are web standards?
• Why follow web standards?
• Considering future browsers and new devices
• Considering backwards compatibility
• Web standards resources

Web content accessibility

• Introduction to web content accessibility
• Section 508 and other laws about disability access
• Accessibility standards
• Validating against accessibility standards
• Source ordering

Template parameters

• Defining a parameter in templateDetails.xml
• Parameter types supported
• Page for each parameter type
• Retrieving parameter data in a template file

Fonts and typography

• Font families
• Font metrics
• Text resizing

Template overrides

• How to override the output from the Joomla! core

Template translations

• Overview of translation
• Creating a language definition (INI) file
• Adding a language file to the templateDetails.xml file
• Embedding translatable strings in the template file

Distributing Joomla! templates

• How to choose a suitable license
• How does template installation work?
• File structure for packaging
• Creating a thumbnail preview image
• Packaging the template

Advanced topics

• How are templates executed?
• System error pages
• Custom error pages
• Adding JavaScript
• Mootools JavaScript library
• Adding stylesheets for other output devices
• Enhancing template performance
• Administrator (back-end) templates

Appendix

• What jdoc:include types are available?
• Standard module chrome styles
• Default CSS classes
• Configuration variables deprecated in Joomla! 1.5
• Where can you learn about HTML?
• Where can you learn about CSS?
• Where can you learn about Javascript?
• Where can you learn about Mootools
• Where can you learn about PHP
• Where can you learn about MySQL?
• Where can you learn about server configuration
• Where can you learn about Unix?
• Operators for use with the countModules function
• Objects methods and properties available from your template
• Security do's and don't's
• AJAX
• Where to find diagnostic tools
• Where to find design tools
• Glossary