Developing Joomla 1.6 Templates

Chad Windnagletwitter.com/@drmmr763

chad@s-go.net

The Big Question:

Do

Joomla! 1.5 Templates

=

Joomla! 1.6 Templates

???

The Big Answer:

No. But almost!

Few Differences:

Minor Code ChangesNew 1.6 Feature: Template StylesAdvanced Style ACL

Few Differences:

Minor Modifications to templateDetails.xml

Add DocType DefinitionUpdate install version number to 1.6Optional: Template configuration

params (fieldsets - saved in params.ini)

Few Differences:

Minor Modifications to index.php• New head jdoc include available• Optional: Ability to directly use param.ini

values

Few Differences:

Editing Template Parameters

Editing Template Parameters

What is a template, anyway?

“The Joomla template is a series of files within the CMS that control the

presentation of the content.”

-Barrie North, CompassDesigns.net

What Tools Do I Need?• Localhost or Web HostingLocal: MAMP (Mac), WAMP / XAMMP (PC)

• HTML / CSS EditorDreamweaver, TextMate, Notepad++

• FTP ApplicationFileZilla (Mac/PC), Transmit (Mac)

• Image EditorPhotoshop, Fireworks, Gimp (all platforms)

Template Elements

• PHP Code• CSS Code• Joomla API Code• Images• Additional Libraries (JS, JQuery, Ajax,

etc.)

What, Where, & Why?

• index.php• index.html• params.ini• template_thumbnail.png• template_preview.png• templateDetails.xml

• css• template.css• index.html• css/*

• images• index.html• images/*

<JoomlaRoot>/templates/tmpl_sgo

index.php – contents

• DocType• Header

• Stylesheets • Libraries• Header Jdoc

• Body• HTML• Module Jdoc• Component Jdoc• Message Jdoc• PHP Code

index.php

templateDetails.xml - contents

• DocType• Install Parameters

oAuthor InfooDefine Directory Structure (files and folders)oDefine all Module PositionsoDefine all Config Elements

Tells Joomla What To Do

templateDetails.xml

template.css - contents

• Body CSS• HTML Div Class / ID CSS• Menu CSS

Controls the layout, look and feel

template.css

Packaging

Installing

Installing

Free Resources

• docs.joomla.org/Template_DevelopmentDocs on all things templating

• Compassdesigns.net/joomla-tutorialsComprehensive template tutorial for Joomla 1.6, includes sample template files.