SlideShare a Scribd company logo

Joomla Creative Inside Joomla Templates And Design

Download as PPT, PDF
J
joomladex

This document discusses designing websites using Joomla templates. It provides information on finding and customizing templates for Joomla 1.5, including what's new in 1.5 templates like new parameters and content calls. It also discusses standards and accessibility considerations for templates. Examples are given of well designed Joomla websites and the slides are available online.

TechnologyDesign
1 of 37
Downloaded 719 times
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
CREATIVE JOOMLA! Dinah Randall / Melbourne Joomla!Day 2008
Inside Joomla Templates and Design How can I design a site in Joomla! 1.5?
Inside Joomla Templates and Design How can I design a site in Joomla! 1.5? Words from a template designer and coder
Creative Joomla! Design constraints
Creative Joomla! Design constraints Find and customise a template
Creative Joomla! Design constraints Find and customise a template What’s new in Joomla! 1.5 templates
Creative Joomla! Design constraints Find and customise a template What’s new in Joomla! 1.5 templates That’s a good look!
Design Constraints What your designer needs to know
Site Design
Anatomy of a template
Module Positions
Module Positions Detail
Design Constraints Standards and accessibility W3C standards Usability Tableless HTML Accessibility Source Ordering SEO tagging
Find a template Free templates http://www.bestofjoomla.com/component/option,com_bestoftemplate/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/ http://forum.joomla.org/index.php/board,479.0.html Blank (unstyled) 1.5 template http://s.imp.ly/joomla/index.php?option=com_content&view=article&id=45&Itemid=54&6414148bfaaea5bf75a0d701b35febbb=0322fd5f0fdf9596191344b8f91a1464
Customise a template Using your own logo, styles & menus Template Tutorials http://www.compassdesigns.net/tutorials/joomla-tutorials/joomla-1.5-template-tutorial.html http://forum.joomla.org/index.php?topic=248595.msg1144729#msg1144729 Customising a Joomla! 1.5 template is not an entry-level job!
What’s new in 1.5 Parameters Used in 1.5 to select colour, font-size, width, layout and menu options. Defined in the XML and params.ini files Chrome Over-rides Content calls Migration from 1.0 to 1.5
What’s new in 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 Migration from 1.0 to 1.5
What’s new in 1.5 Parameters Chrome Over-rides Over-ride HTML output for any component or module – model/view/controller. See ‘Beez’ Content calls Migration from 1.0 to 1.5
What’s new in 1.5 Parameters Chrome Over-rides Content calls New calls to Joomla methods and parameters from index.php - jdoc Migration from 1.0 to 1.5
Content Calls 1.0 old style $mainframe->getTemplate() $mosConfig_live_site <?php mosLoadModules ( 'right',-2 ); ?> <?php mosMainBody(); ?> 1.5 new style $this->template $this->url <jdoc:include type=&quot;modules&quot; name=&quot;right&quot; style=&quot;xhtml&quot; /> <jdoc:include type=&quot;component&quot; />
What’s new in 1.5 Parameters Chrome Over-rides Content calls Migration from 1.0 to 1.5 http://www.developer.joomla.org/wiki/Tutorial:Upgrading_a_Joomla%21_1.0.x_template http://forum.joomla.org/index.php/topic,248595.0.html
That’s a good look! 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 / Melbourne Joomla!Day 2008 Slides online at www.slideshare.net - search for ‘MJD08’

More Related Content

PPT
Joomla! Templates - Sydney
joomladex
 
PPTX
Joomla 1.7 development
Rafael Corral
 
ODP
Joomla Day UK 2009 Basic Templates
Chris Davenport
 
PPT
WordPress Development Confoo 2010
Brendan Sera-Shriar
 
PDF
Use atomic design ftw
GiantJohnPepper
 
PPTX
HTML 5 Web Design
Usman Shakir
 
PPTX
Introduction to HAML
Jon Dean
 
PDF
PHP Hoffman Framework (HMF) at Barcamp Bangkok 2
Ford AntiTrust
 
Joomla! Templates - Sydney
joomladex
 
Joomla 1.7 development
Rafael Corral
 
Joomla Day UK 2009 Basic Templates
Chris Davenport
 
WordPress Development Confoo 2010
Brendan Sera-Shriar
 
Use atomic design ftw
GiantJohnPepper
 
HTML 5 Web Design
Usman Shakir
 
Introduction to HAML
Jon Dean
 
PHP Hoffman Framework (HMF) at Barcamp Bangkok 2
Ford AntiTrust
 

What's hot (20)

ODP
Configuring Joomla JCE editor from usability point of view
Peter Martin
 
DOCX
Flaix responsive joomla template
EmilyPhan21291
 
PPTX
Rapid application development using Akeeba FOF and Joomla 3.2
Tim Plummer
 
PDF
Introduction to html 5
Nir Elbaz
 
PPTX
HTML and CSS workshop
Manchester Girl Geeks Geeks
 
ODP
Joomla! Day UK 2009 Template Design
Andy Wallace
 
ODP
Joomla Day UK 2009 Template Design Presentation
Chris Davenport
 
PDF
Atomic design, a problem of expectations
Francesco Improta
 
ODP
HTML5: 5 Quick Wins
Jeff Leombruno
 
PPTX
Joomla Day MN 2014 - Brad Markle
InMotion Hosting
 
PPT
Creating Yahoo Mobile Widgets
Ricardo Varela
 
PDF
WordPress Plugin - Chameleon
Fahad Mahmood
 
PDF
Trends and Insights for Interactive Email & Google AMP for Email
SparkPost
 
PPT
Making Your Site Look Great in IE7
goodfriday
 
PPTX
Building Chrome Extensions For Salesforce
Abhinav Gupta
 
KEY
A Beginner’s Guide to Wordpress - WordCamp Toronto 2011
Kathryn Presner
 
PDF
JD17NL Joomla! Overrides and alternate layouts
Hans Kuijpers
 
PDF
MIMA 2014 - Changing your Responsive Design Workflow
easelsolutions
 
PDF
The Users are Restless
Terry Ryan
 
PDF
Template changes for Joomla 1.6
Chris Davenport
 
Configuring Joomla JCE editor from usability point of view
Peter Martin
 
Flaix responsive joomla template
EmilyPhan21291
 
Rapid application development using Akeeba FOF and Joomla 3.2
Tim Plummer
 
Introduction to html 5
Nir Elbaz
 
HTML and CSS workshop
Manchester Girl Geeks Geeks
 
Joomla! Day UK 2009 Template Design
Andy Wallace
 
Joomla Day UK 2009 Template Design Presentation
Chris Davenport
 
Atomic design, a problem of expectations
Francesco Improta
 
HTML5: 5 Quick Wins
Jeff Leombruno
 
Joomla Day MN 2014 - Brad Markle
InMotion Hosting
 
Creating Yahoo Mobile Widgets
Ricardo Varela
 
WordPress Plugin - Chameleon
Fahad Mahmood
 
Trends and Insights for Interactive Email & Google AMP for Email
SparkPost
 
Making Your Site Look Great in IE7
goodfriday
 
Building Chrome Extensions For Salesforce
Abhinav Gupta
 
A Beginner’s Guide to Wordpress - WordCamp Toronto 2011
Kathryn Presner
 
JD17NL Joomla! Overrides and alternate layouts
Hans Kuijpers
 
MIMA 2014 - Changing your Responsive Design Workflow
easelsolutions
 
The Users are Restless
Terry Ryan
 
Template changes for Joomla 1.6
Chris Davenport
 
Ad

Similar to Joomla Creative Inside Joomla Templates And Design (20)

PDF
Joomla templates2011
Linda Coonen
 
PPTX
Template overrides austin
Chad Windnagle
 
PPT
Week 12 - Search Engine Optimization
henri_makembe
 
ODP
Joomla Day India 2009 Business Logic With The Mvc
Amit Kumar Singh
 
PPTX
Techgig Webinar: Joomla Introduction and Module Development June 2012
Vishwash Gaur
 
PPTX
Develop Basic joomla! MVC component for version 3
Gunjan Patel
 
PPTX
HTML5 and Joomla! 2.5 Template
Marvelic Engine Co., Ltd.
 
PDF
WWX 2013 Cocktail
Raphael Harmel
 
PDF
20150211 seo in drupal presentation
Dagmar Muth
 
KEY
Developing Joomla! 1.5 Extensions, Explained
Mitch Pirtle
 
PPT
Joomla! Templates and Comparison of Frameworks
Saurabh Shah
 
PPTX
Web Components
FITC
 
PPTX
Rapid application development using Akeeba FOF and Joomla 3.2
JoomlaDay Australia
 
PPT
Developing joomla 1.6 templates
Chad Windnagle
 
ODP
Joomla! Day UK 2009 Basic Templates
Andy Wallace
 
PDF
10 tips to improve the usability of Joomla - Joomla World Conference 2014
Sander Potjer
 
PDF
Intro to DooPHP
Leng Hong
 
PPTX
Seo for Engineers
Cort Tafoya
 
PDF
Getting Started with the Joomla! Framework
Michael Babker
 
PDF
Seo cheat sheet_2-2013
E-event
 
Joomla templates2011
Linda Coonen
 
Template overrides austin
Chad Windnagle
 
Week 12 - Search Engine Optimization
henri_makembe
 
Joomla Day India 2009 Business Logic With The Mvc
Amit Kumar Singh
 
Techgig Webinar: Joomla Introduction and Module Development June 2012
Vishwash Gaur
 
Develop Basic joomla! MVC component for version 3
Gunjan Patel
 
HTML5 and Joomla! 2.5 Template
Marvelic Engine Co., Ltd.
 
WWX 2013 Cocktail
Raphael Harmel
 
20150211 seo in drupal presentation
Dagmar Muth
 
Developing Joomla! 1.5 Extensions, Explained
Mitch Pirtle
 
Joomla! Templates and Comparison of Frameworks
Saurabh Shah
 
Web Components
FITC
 
Rapid application development using Akeeba FOF and Joomla 3.2
JoomlaDay Australia
 
Developing joomla 1.6 templates
Chad Windnagle
 
Joomla! Day UK 2009 Basic Templates
Andy Wallace
 
10 tips to improve the usability of Joomla - Joomla World Conference 2014
Sander Potjer
 
Intro to DooPHP
Leng Hong
 
Seo for Engineers
Cort Tafoya
 
Getting Started with the Joomla! Framework
Michael Babker
 
Seo cheat sheet_2-2013
E-event
 
Ad

Recently uploaded (20)

PPTX
Group 1 Presentation -Planning and Decision Making .pptx
MatthewLewis227954
 
PDF
Agricultural_Statistics_at_a_Glance_2022_0.pdf
SandeepSingh286037
 
PDF
Assigned Numbers - 2025 - Bluetooth® Document
Bloombase
 
PDF
A comparative analysis of optical character recognition models for extracting...
IAESIJAI
 
PPTX
KOM of Painting work and Equipment Insulation REV00 update 25-dec.pptx
muhammadmuneebnaeem7
 
PDF
Reach Out and Touch Someone: Haptics and Empathic Computing
Mark Billinghurst
 
PPTX
Digital-Transformation-Roadmap-for-Companies.pptx
David Malick Dieng
 
PDF
Spectral efficient network and resource selection model in 5G networks
IAESIJAI
 
PPTX
TechTalks-8-2019-Service-Management-ITIL-Refresh-ITIL-4-Framework-Supports-Ou...
bonakiduza1024
 
PPTX
Programs and apps: productivity, graphics, security and other tools
4mqw9zch22
 
PDF
Unlocking AI with Model Context Protocol (MCP)
Brian McKeiver
 
PDF
Architecting across the Boundaries of two Complex Domains - Healthcare & Tech...
Peter Tan
 
PDF
Machine learning based COVID-19 study performance prediction
IAESIJAI
 
PPTX
Spectroscopy.pptx food analysis technology
nawahassan45
 
PPTX
1. Introduction to Computer Programming.pptx
bonakiduza1024
 
PPTX
OMC Textile Division Presentation 2021.pptx
JahangirAlam816069
 
PDF
Approach and Philosophy of On baking technology
30anthuong17
 
PPTX
TLE Review Electricity (Electricity).pptx
JayPolicarpio2
 
PDF
Building Integrated photovoltaic BIPV_UPV.pdf
SandeepSingh286037
 
PDF
Accuracy of neural networks in brain wave diagnosis of schizophrenia
IAESIJAI
 
Group 1 Presentation -Planning and Decision Making .pptx
MatthewLewis227954
 
Agricultural_Statistics_at_a_Glance_2022_0.pdf
SandeepSingh286037
 
Assigned Numbers - 2025 - Bluetooth® Document
Bloombase
 
A comparative analysis of optical character recognition models for extracting...
IAESIJAI
 
KOM of Painting work and Equipment Insulation REV00 update 25-dec.pptx
muhammadmuneebnaeem7
 
Reach Out and Touch Someone: Haptics and Empathic Computing
Mark Billinghurst
 
Digital-Transformation-Roadmap-for-Companies.pptx
David Malick Dieng
 
Spectral efficient network and resource selection model in 5G networks
IAESIJAI
 
TechTalks-8-2019-Service-Management-ITIL-Refresh-ITIL-4-Framework-Supports-Ou...
bonakiduza1024
 
Programs and apps: productivity, graphics, security and other tools
4mqw9zch22
 
Unlocking AI with Model Context Protocol (MCP)
Brian McKeiver
 
Architecting across the Boundaries of two Complex Domains - Healthcare & Tech...
Peter Tan
 
Machine learning based COVID-19 study performance prediction
IAESIJAI
 
Spectroscopy.pptx food analysis technology
nawahassan45
 
1. Introduction to Computer Programming.pptx
bonakiduza1024
 
OMC Textile Division Presentation 2021.pptx
JahangirAlam816069
 
Approach and Philosophy of On baking technology
30anthuong17
 
TLE Review Electricity (Electricity).pptx
JayPolicarpio2
 
Building Integrated photovoltaic BIPV_UPV.pdf
SandeepSingh286037
 
Accuracy of neural networks in brain wave diagnosis of schizophrenia
IAESIJAI
 

Joomla Creative Inside Joomla Templates And Design

  • 1. CREATIVE JOOMLA! Dinah Randall / Melbourne Joomla!Day 2008
  • 2. Inside Joomla Templates and Design How can I design a site in Joomla! 1.5?
  • 3. Inside Joomla Templates and Design How can I design a site in Joomla! 1.5? Words from a template designer and coder
  • 5. Creative Joomla! Design constraints Find and customise a template
  • 6. Creative Joomla! Design constraints Find and customise a template What’s new in Joomla! 1.5 templates
  • 7. Creative Joomla! Design constraints Find and customise a template What’s new in Joomla! 1.5 templates That’s a good look!
  • 8. Design Constraints What your designer needs to know
  • 10. Anatomy of a template
  • 13. Design Constraints Standards and accessibility W3C standards Usability Tableless HTML Accessibility Source Ordering SEO tagging
  • 14. Find a template Free templates http://www.bestofjoomla.com/component/option,com_bestoftemplate/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/ http://forum.joomla.org/index.php/board,479.0.html Blank (unstyled) 1.5 template http://s.imp.ly/joomla/index.php?option=com_content&view=article&id=45&Itemid=54&6414148bfaaea5bf75a0d701b35febbb=0322fd5f0fdf9596191344b8f91a1464
  • 15. Customise a template Using your own logo, styles & menus Template Tutorials http://www.compassdesigns.net/tutorials/joomla-tutorials/joomla-1.5-template-tutorial.html http://forum.joomla.org/index.php?topic=248595.msg1144729#msg1144729 Customising a Joomla! 1.5 template is not an entry-level job!
  • 16. What’s new in 1.5 Parameters Used in 1.5 to select colour, font-size, width, layout and menu options. Defined in the XML and params.ini files Chrome Over-rides Content calls Migration from 1.0 to 1.5
  • 17. What’s new in 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 Migration from 1.0 to 1.5
  • 18. What’s new in 1.5 Parameters Chrome Over-rides Over-ride HTML output for any component or module – model/view/controller. See ‘Beez’ Content calls Migration from 1.0 to 1.5
  • 19. What’s new in 1.5 Parameters Chrome Over-rides Content calls New calls to Joomla methods and parameters from index.php - jdoc Migration from 1.0 to 1.5
  • 20. Content Calls 1.0 old style $mainframe->getTemplate() $mosConfig_live_site <?php mosLoadModules ( 'right',-2 ); ?> <?php mosMainBody(); ?> 1.5 new style $this->template $this->url <jdoc:include type=&quot;modules&quot; name=&quot;right&quot; style=&quot;xhtml&quot; /> <jdoc:include type=&quot;component&quot; />
  • 21. What’s new in 1.5 Parameters Chrome Over-rides Content calls Migration from 1.0 to 1.5 http://www.developer.joomla.org/wiki/Tutorial:Upgrading_a_Joomla%21_1.0.x_template http://forum.joomla.org/index.php/topic,248595.0.html
  • 22. That’s a good look! Joomla! designs…
  • 23. Joomla! Design http://www.habitsbaranddining.com.au Melbourne Joomla!Day 2008
  • 24. Joomla! Design http://www.malarmarden.se Melbourne Joomla!Day 2008
  • 25. Joomla! Design http://www.palgor-publicidade.com Melbourne Joomla!Day 2008
  • 26. Joomla! Design http://www.spacemakerwardrobes.com.au Melbourne Joomla!Day 2008
  • 27. Joomla! Design http://www.lonestar.com.au Melbourne Joomla!Day 2008
  • 28. Joomla! Design http://www.childrenoftherevolution.com.au Melbourne Joomla!Day 2008
  • 29. Joomla! Design http://www.cinemalecep.com Melbourne Joomla!Day 2008
  • 30. Joomla! Design http://www.vallartaencountours.com Melbourne Joomla!Day 2008
  • 31. Joomla! Design http://www.cultureelcafe.nl Melbourne Joomla!Day 2008
  • 32. Joomla! Design http://www.detainee002.com Melbourne Joomla!Day 2008
  • 33. Joomla! Design http://btl.bialystok.pl Melbourne Joomla!Day 2008
  • 34. Joomla! Design http://www.firststepsforkids.com Melbourne Joomla!Day 2008
  • 35. Joomla! Design http://www.waterandstone.com Melbourne Joomla!Day 2008
  • 36. Joomla! Design http://www.55thinking.com Melbourne Joomla!Day 2008
  • 37. CREATIVE JOOMLA! Dinah Randall / Melbourne Joomla!Day 2008 Slides online at www.slideshare.net - search for ‘MJD08’