developing joomla 1.6 templates - joomla!day nyc december 2010

Developing Joomla 1.6 Templates

Chad WindnagleJoomla!Lover

Contact:chad.windnagle@resources.joomla.org

twitter.com/drmmr763

The Big Question:

Do

Joomla! 1.5 Templates

==

Joomla! 1.6 Templates

???

The Big Answer:

No. But almost!

Few Differences:

Minor Code Changes New 1.6 Feature: Template Styles Advanced Style ACL

Few Differences:

Minor Modifications to templateDetails.xml Add DocType Definition Update install version number to 1.6 Optional: 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 Hosting

Local: 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

Loads Stylesheets, APIs & Template Logic

templateDetails.xml - contents

DocType Install Parameters

Author Info Define Directory Structure (files and folders) Define all Module Positions Define all Config Elements

Tells Joomla Installer 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/Tempale_DevelopmentDocumentation on Joomla Templates

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

http://www.slideshare.net/ChadWindnagle