CREATIVE JOOMLA! Dinah Randall / Sydney Joomla!Day 2008

Inside Joomla Templates and Design How can I design a site in Joomla! 1.5?

How can I design a site in Joomla! 1.5?

Creative Joomla! Design constraints

Design constraints

Creative Joomla! Design constraints Find and customise or build a template

Design constraints

Find and customise or build a template

Creative Joomla! Design constraints Find and customise or build a template What’s new in Joomla! 1.5 templates

Design constraints

Find and customise or build a template

What’s new in Joomla! 1.5 templates

Creative Joomla! Design constraints Find and customise or build a template What’s new in Joomla! 1.5 templates Some interesting Joomla! designs

Design constraints

Find and customise or build a template

What’s new in Joomla! 1.5 templates

Some interesting Joomla! designs

Design Constraints What your designer needs to know

What your designer needs to know

Site Design

Anatomy of a template

Module Positions

Module Positions Detail

General Design Constraints Standards and accessibility W3C standards Usability Tableless HTML Accessibility Source Ordering SEO tagging

Standards and accessibility

W3C standards

Usability

Tableless HTML

Accessibility

Source Ordering

SEO tagging

Find a template Free templates http://www.bestofjoomla.com/index.php?x=25&y=8&TagsTo=36_43_44&option=com_bestoftemplate&task=viewcategory&fsort=&fcolor=&ffav=&fedit=&Itemid=46 - http://www.joomla.org/content/blogcategory/19/51 - http://joomlashack.com - http://www.siteground.com/joomla-hosting/joomla-templates.htm - http://www.joomla24.com/ Blank (unstyled) 1.5 template http://s.imp.ly/joomla/

Free templates

http://www.bestofjoomla.com/index.php?x=25&y=8&TagsTo=36_43_44&option=com_bestoftemplate&task=viewcategory&fsort=&fcolor=&ffav=&fedit=&Itemid=46 - http://www.joomla.org/content/blogcategory/19/51 - http://joomlashack.com - http://www.siteground.com/joomla-hosting/joomla-templates.htm - http://www.joomla24.com/

Blank (unstyled) 1.5 template

http://s.imp.ly/joomla/

Build your own template Using your own logo, styles & menus Template Tutorials + Tool How to build a template: http://www.compassdesigns.net/tutorials/joomla-tutorials/joomla-template-tutorial.html Template SEO enhancements: http://www.joomlashack.com/index.php?option=com_content&task=view&id=154&Itemid=9 Dreamweaver template builder tool: http://extensions.joomla.org/component/option,com_mtree/task,viewlink/link_id,2356/Itemid,35/ Building a Joomla! 1.5 template is not an entry level task

Using your own logo, styles & menus

Template Tutorials + Tool How to build a template: http://www.compassdesigns.net/tutorials/joomla-tutorials/joomla-template-tutorial.html Template SEO enhancements: http://www.joomlashack.com/index.php?option=com_content&task=view&id=154&Itemid=9 Dreamweaver template builder tool: http://extensions.joomla.org/component/option,com_mtree/task,viewlink/link_id,2356/Itemid,35/

Building a Joomla! 1.5 template is not an entry level task

What’s new in 1.5 templates Parameters Not strictly new, but used in 1.5 to select colour, font-size, width, layout and menu options Chrome Over-rides Content calls Template migration from 1.0 to 1.5

Parameters

Not strictly new, but used in 1.5 to select colour, font-size, width, layout and menu options

Chrome

Over-rides

Content calls

Template migration from 1.0 to 1.5

What’s new in 1.5 templates Parameters Chrome No more -1, -2, -3 Use raw, xhmtl, table, horz, rounded, none, outline Module positions defined in XML Over-rides Content calls Template migration from 1.0 to 1.5

Parameters

Chrome

No more -1, -2, -3 Use raw, xhmtl, table, horz, rounded, none, outline Module positions defined in XML

Over-rides

Content calls

Template migration from 1.0 to 1.5

What’s new in 1.5 templates Parameters Chrome Over-rides Over-ride HTML output for any component or module – model/view/controller Content calls Template migration from 1.0 to 1.5

Parameters

Chrome

Over-rides

Over-ride HTML output for any component or module – model/view/controller

Content calls

Template migration from 1.0 to 1.5

What’s new in 1.5 templates Parameters Chrome Over-rides Content calls New calls to Joomla methods and parameters from index.php - jdoc Template migration from 1.0 to 1.5

Parameters

Chrome

Over-rides

Content calls New calls to Joomla methods and parameters from index.php - jdoc

Template migration from 1.0 to 1.5

What’s new in 1.5 templates Parameters Chrome Over-rides Content calls Template migration from 1.0 to 1.5 http://docs.joomla.org/Tutorial:Upgrading_a_Joomla%21_1.0.x_template http://forum.joomla.org/index.php/topic,248595.0.html

Parameters

Chrome

Over-rides

Content calls

Template migration from 1.0 to 1.5

Some interesting Joomla! designs …

…

Joomla! Design http://www.habitsbaranddining.com.au Melbourne Joomla!Day 2008

Joomla! Design http://www.malarmarden.se Melbourne Joomla!Day 2008

Joomla! Design http://www.palgor-publicidade.com Melbourne Joomla!Day 2008

Joomla! Design http://www.spacemakerwardrobes.com.au Melbourne Joomla!Day 2008

Joomla! Design http://www.lonestar.com.au Melbourne Joomla!Day 2008

Joomla! Design http://www.childrenoftherevolution.com.au Melbourne Joomla!Day 2008

Joomla! Design http://www.cinemalecep.com Melbourne Joomla!Day 2008

Joomla! Design http://www.vallartaencountours.com Melbourne Joomla!Day 2008

Joomla! Design http://www.cultureelcafe.nl Melbourne Joomla!Day 2008

Joomla! Design http://www.detainee002.com Melbourne Joomla!Day 2008

Joomla! Design http://btl.bialystok.pl Melbourne Joomla!Day 2008

Joomla! Design http://www.firststepsforkids.com Melbourne Joomla!Day 2008

Joomla! Design http://www.waterandstone.com Melbourne Joomla!Day 2008

Joomla! Design http://www.55thinking.com Melbourne Joomla!Day 2008

CREATIVE JOOMLA! Dinah Randall / Sydney Joomla!Day 2008 Slides online at www.slideshare.net - search for ‘SJD08’