developing joomla 1.6 templates - joomla!day nyc december 2010

23
Developing Joomla 1.6 Templates Chad Windnagle Joomla!Lover Contact: [email protected]. org twitter.com/drmmr763

Upload: chad-windnagle

Post on 27-Jan-2015

111 views

Category:

Technology


2 download

DESCRIPTION

Presentation I gave to the joomla day nyc crowd in december 2010.

TRANSCRIPT

Page 1: Developing joomla 1.6 templates - Joomla!Day NYC December 2010

Developing Joomla 1.6 Templates

Chad WindnagleJoomla!Lover

Contact:[email protected]

twitter.com/drmmr763

Page 2: Developing joomla 1.6 templates - Joomla!Day NYC December 2010

The Big Question:

Do

Joomla! 1.5 Templates

==

Joomla! 1.6 Templates

???

Page 3: Developing joomla 1.6 templates - Joomla!Day NYC December 2010

The Big Answer:

No. But almost!

Page 4: Developing joomla 1.6 templates - Joomla!Day NYC December 2010

Few Differences:

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

Page 5: Developing joomla 1.6 templates - Joomla!Day NYC December 2010

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)

Page 6: Developing joomla 1.6 templates - Joomla!Day NYC December 2010

Few Differences:

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

values

Page 7: Developing joomla 1.6 templates - Joomla!Day NYC December 2010

Few Differences:

Page 8: Developing joomla 1.6 templates - Joomla!Day NYC December 2010

Editing Template Parameters

Page 9: Developing joomla 1.6 templates - Joomla!Day NYC December 2010

Editing Template Parameters

Page 10: Developing joomla 1.6 templates - Joomla!Day NYC December 2010

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

Page 11: Developing joomla 1.6 templates - Joomla!Day NYC December 2010

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)

Page 12: Developing joomla 1.6 templates - Joomla!Day NYC December 2010

Template Elements

PHP Code CSS Code Joomla API Code Images Additional Libraries (JS, JQuery, Ajax, etc.)

Page 13: Developing joomla 1.6 templates - Joomla!Day NYC December 2010

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

Page 14: Developing joomla 1.6 templates - Joomla!Day NYC December 2010

index.php – contents

DocType Header

Stylesheets Libraries Header Jdoc

Body HTML Module Jdoc Component Jdoc Message Jdoc PHP Code

Page 15: Developing joomla 1.6 templates - Joomla!Day NYC December 2010

index.php

Loads Stylesheets, APIs & Template Logic

Page 16: Developing joomla 1.6 templates - Joomla!Day NYC December 2010

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

Page 17: Developing joomla 1.6 templates - Joomla!Day NYC December 2010

templateDetails.xml

Page 18: Developing joomla 1.6 templates - Joomla!Day NYC December 2010

template.css - contents

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

Controls the layout, look and feel

Page 19: Developing joomla 1.6 templates - Joomla!Day NYC December 2010

template.css

Page 20: Developing joomla 1.6 templates - Joomla!Day NYC December 2010

Packaging

Page 21: Developing joomla 1.6 templates - Joomla!Day NYC December 2010

Installing

Page 22: Developing joomla 1.6 templates - Joomla!Day NYC December 2010

Installing

Page 23: Developing joomla 1.6 templates - Joomla!Day NYC December 2010

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