Your SlideShare is downloading. ×
0
Joomla! Templates   &  A Comparison of Frameworks by Saurabh Shah Front-End Developer Joomla! Day Malaysia 2011
Joomla Popularity <ul><li>Joomla is popular open source content management system  which is used to built websites.  </li>...
Demo.joomla.org partnered with cloudaccess.net <ul><li>Demo.joomla.org has partnered with CloudAccess.net, since May 2010 ...
Demo.joomla.org partnered with cloudaccess.net(conti…) We allow users to maintain the integrity of their content, and cont...
Demo.joomla.org partnered with cloudaccess.net(conti…) We allow users to maintain the integrity of their content, and cont...
Demo.joomla.org partnered with cloudaccess.net(conti…) <ul><li>Demo   site  users have the option to continue to be hosted...
Table of Contents <ul><li>What is Template ? </li></ul><ul><li>Joomla! Templates  </li></ul><ul><li>Joomla! Template Frame...
What  is Template ? <ul><li>Legacy websites  </li></ul><ul><li>Initial stage of templating - static header , footer , left...
Joomla! Templates <ul><li>A template is the type of Joomla! extension that changes the way your site looks. There are two ...
Template in Joomla! (Cont…) <ul><li>Components  are the main functional units that display in your template, like the cont...
Template in Joomla! (Cont…) <ul><li>Modules  are lightweight and flexible extensions used for page rendering.  </li></ul><...
<ul><li>Plugins : provide routines which are associated with trigger events within Joomla. When a particular trigger event...
What is Framework ? All in one solution !  Framework can be defined as a set of tools , libraries,conventions and best pra...
Things that can be abstracted <ul><li>Browser Resets </li></ul><ul><li>Base Typography </li></ul><ul><li>Basic styles for ...
Advantages of using a framework <ul><li>Increase Productivity </li></ul><ul><li>Avoid common mistakes </li></ul><ul><li>Be...
Disadvantages of using a framework <ul><li>Need time to understand the framework </li></ul><ul><li>Limitation of the frame...
List of Frameworks Commercial Frameworks YjSimpleGrid Framework (You Grids) http://www.youjoomla.com/ Morph Framework (Mor...
List of Frameworks GPL Free Frameworks JA T3 Framework (Blank) http://www.joomlart.com/ Gantry Framework (Gantry) http://w...
Comparison between most popular frameworks T3 & Gantry Joomla! Day Malaysia 2011
Comparison between most popular frameworks T3 & Gantry T3  Gantry Joomla! Day Malaysia 2011 Taken From http://magazine.joo...
Advantages of Gantry <ul><li>960 Grid System (http://960.gs) for simple consistent layout. 12 and 16 column support </li><...
Disadvantages of Gantry <ul><li>There are so many options, it might be overwhelming to new people; </li></ul><ul><li>Addit...
Advantages of T3 <ul><li>Getting started : Excellent & extensive step-by-step documentation for creating a template from s...
Disadvantages of T3 <ul><li>Template Manager JavaScript:  Heavy JavaScript usage within the Joomla! Template Manager  </li...
Future Framework for Future Joomla! Versions <ul><li>Should support CSS3 for all browsers  </li></ul><ul><li>Should suppor...
6 MONTHS FREE HOSTING  & FREE DOMAIN Joomla! Day Malaysia 2011
Thank you Saurabh Shah www.CloudAccess.net Twitter : @saurabhshah Email : saurabh@cloudaccess.net [email_address] Joomla! ...
Upcoming SlideShare
Loading in...5
×

Joomla! Templates and Comparison of Frameworks

17,582

Published on

Joomla! Day Malaysia 2011

Published in: Technology, Business
1 Comment
8 Likes
Statistics
Notes
No Downloads
Views
Total Views
17,582
On Slideshare
0
From Embeds
0
Number of Embeds
5
Actions
Shares
0
Downloads
286
Comments
1
Likes
8
Embeds 0
No embeds

No notes for slide

Transcript of "Joomla! Templates and Comparison of Frameworks"

  1. 1. Joomla! Templates &  A Comparison of Frameworks by Saurabh Shah Front-End Developer Joomla! Day Malaysia 2011
  2. 2. Joomla Popularity <ul><li>Joomla is popular open source content management system which is used to built websites. </li></ul><ul><li>Reason behind its extensive popularity are : </li></ul><ul><li>Freely available and no individual is required to pay huge amounts for the purpose of licensing it. </li></ul><ul><li>Joomla is easy to use and having extremely flexible features which help in the creation of wide variety of websites, such as personal websites, educational websites, E-commerce applications and corporate websites and many more. </li></ul><ul><li>One of the benefits of using Joomla web design services is that, users can easily update and maintain web pages from time to time. </li></ul>Joomla! Day Malaysia 2011
  3. 3. Demo.joomla.org partnered with cloudaccess.net <ul><li>Demo.joomla.org has partnered with CloudAccess.net, since May 2010 </li></ul><ul><li>The demo.joomla.org , created in partnership with CloudAccess.net, has all the standard features of Joomla ! and gives each user a completely dedicated space to experience Joomla ! without having content lost or overwritten. They can install extensions, add users and experience the full power of the Joomla ! CMS. </li></ul>Joomla! Day Malaysia 2011
  4. 4. Demo.joomla.org partnered with cloudaccess.net(conti…) We allow users to maintain the integrity of their content, and continue to build and learn over an extended trial period. Each demo site user will get a free, complete, dedicated installation of the Joomla ! CMS. Users sign up , verify their email, and start building with complete customization capabilities. After 30 days, a user can easily migrate the site to another host or sign up with CloudAccess.net for an ongoing account. Joomla! Day Malaysia 2011
  5. 5. Demo.joomla.org partnered with cloudaccess.net(conti…) We allow users to maintain the integrity of their content, and continue to build and learn over an extended trial period. Each demo site user will get a free, complete, dedicated installation of the Joomla ! CMS. Users sign up , verify their email, and start building with complete customization capabilities. After 30 days, a user can easily migrate the site to another host or sign up with CloudAccess.net for an ongoing account. Joomla! Day Malaysia 2011
  6. 6. Demo.joomla.org partnered with cloudaccess.net(conti…) <ul><li>Demo site users have the option to continue to be hosted at CloudAccess.net at the end of the 30 day period </li></ul>Joomla! Day Malaysia 2011
  7. 7. Table of Contents <ul><li>What is Template ? </li></ul><ul><li>Joomla! Templates </li></ul><ul><li>Joomla! Template Framework </li></ul><ul><li>Advantages & Disadvantages of using a framework </li></ul><ul><li>List of frameworks available in the Market </li></ul><ul><li>Comparison between most popular frameworks T3 & Gantry </li></ul><ul><li>Future of the Framework for Future Joomla! Versions </li></ul>Joomla! Day Malaysia 2011
  8. 8. What is Template ? <ul><li>Legacy websites </li></ul><ul><li>Initial stage of templating - static header , footer , left , right , nav </li></ul><ul><li>& changing content </li></ul><ul><li>Example: Photo frame , where border outside the photo frame is </li></ul><ul><li>the same always but just photos are getting changed. So the </li></ul><ul><li>border of the photo frame is template. </li></ul>Joomla! Day Malaysia 2011
  9. 9. Joomla! Templates <ul><li>A template is the type of Joomla! extension that changes the way your site looks. There are two types of templates: Front-end Templates and Back-end Templates. </li></ul><ul><li>Joomla Template also allows users to override the view of how extensions look. </li></ul><ul><li>You can change the view of the extension by two ways </li></ul><ul><li>css override & template override </li></ul><ul><li>a) Components </li></ul><ul><li>b) Modules </li></ul><ul><li>c) Plugins </li></ul>Joomla! Day Malaysia 2011
  10. 10. Template in Joomla! (Cont…) <ul><li>Components are the main functional units that display in your template, like the content management system, contact forms, Web Links etc </li></ul><ul><li>They are usually displayed in the center of the main content area of a template (depending on the template structure). </li></ul>Joomla! Day Malaysia 2011 Component is under the red border
  11. 11. Template in Joomla! (Cont…) <ul><li>Modules are lightweight and flexible extensions used for page rendering. </li></ul><ul><li>These modules are mostly visible as the “boxes” that are arranged around a component on a typical page. </li></ul><ul><li>Example: the login module, Polls Module   etc . </li></ul>Joomla! Day Malaysia 2011 Module is under the green border
  12. 12. <ul><li>Plugins : provide routines which are associated with trigger events within Joomla. When a particular trigger event occurs all plugin routines of the type associated with the event are executed in sequence.   Joomla! Plugins enable you to execute code in response to certain events, either Joomla! core events or custom events that are triggered from your own code. This is a powerful way of extending the basic Joomla! Functionality Example : Comment system </li></ul>Template in Joomla! (Cont…) Joomla! Day Malaysia 2011
  13. 13. What is Framework ? All in one solution ! Framework can be defined as a set of tools , libraries,conventions and best practices that attempt to abstract routine task into generic modules that can be reused. Goal: &quot;The goal behind using the framework is to reduce time spent on repetitive task , allowing the designer or developer to focus on task that are unique to a given project rather than reinventing the wheel each time around&quot; Joomla! Day Malaysia 2011
  14. 14. Things that can be abstracted <ul><li>Browser Resets </li></ul><ul><li>Base Typography </li></ul><ul><li>Basic styles for Forms </li></ul><ul><li>Generic / reusable classes </li></ul><ul><li>Template overrides </li></ul><ul><li>Grids (Optional – can be abstracted) </li></ul>Joomla! Day Malaysia 2011
  15. 15. Advantages of using a framework <ul><li>Increase Productivity </li></ul><ul><li>Avoid common mistakes </li></ul><ul><li>Better team workflow </li></ul><ul><li>Optimal browser Compatibility </li></ul><ul><li>Optimal mobile compatibility </li></ul><ul><li>Various amount of prepared Template Features (optional) </li></ul><ul><li>Bigger community Help </li></ul>Joomla! Day Malaysia 2011
  16. 16. Disadvantages of using a framework <ul><li>Need time to understand the framework </li></ul><ul><li>Limitation of the framework to add new features </li></ul><ul><li>Could inherit someone else’s bug </li></ul>Joomla! Day Malaysia 2011
  17. 17. List of Frameworks Commercial Frameworks YjSimpleGrid Framework (You Grids) http://www.youjoomla.com/ Morph Framework (Morph) http://www.joomlajunkie.com/ Motif Framework (themeable) http://www.themeables.com/ JEZ Thema Framework (JEZ Thema) http://www.joomlaez.com/ Zen Grid Framework (Commercial) http://www.joomlabamboo.com/ Warp5.5 Framework (Commercial) http://www.yootheme.com/warp/ Joomla! Day Malaysia 2011
  18. 18. List of Frameworks GPL Free Frameworks JA T3 Framework (Blank) http://www.joomlart.com/ Gantry Framework (Gantry) http://www.rockettheme.com/ http://www.gantry-framework.org/ Rumi Framework (Rumiframework) http://rumi.vandenito.com/ Construct Framework http://joomlaengineering.com/ Gavern (Gavik Themes) http://wiki.gavick.com/joomla-templates/templates-for-joomla-1-6/gavern-framework/gavern-framework/ Joomla! Day Malaysia 2011
  19. 19. Comparison between most popular frameworks T3 & Gantry Joomla! Day Malaysia 2011
  20. 20. Comparison between most popular frameworks T3 & Gantry T3 Gantry Joomla! Day Malaysia 2011 Taken From http://magazine.joomla.org/issues/Issue-Jul-2010/item/81-Joomla-Template-Tools-Part-One http://magazine.joomla.org/issues/Issue-Aug-2010/item/114-Joomla-Template-Tools-Part-Two http://magazine.joomla.org/issues/Issue-Sept-2010/item/197-Joomla-Template-Tools-Part-Three
  21. 21. Advantages of Gantry <ul><li>960 Grid System (http://960.gs) for simple consistent layout. 12 and 16 column support </li></ul><ul><li>Per-menu control over all Gantry functionality </li></ul><ul><li>Ability to save/remove custom presets </li></ul><ul><li>Built-in AJAX Support </li></ul><ul><li>iPhone and iPod Touch mobile autotheme support </li></ul><ul><li>Built-in Gantry RokGZipper to compress and combine Gantry JS and CSS files </li></ul><ul><li>Cleaner more understandable index.php. All the complicated bits are handled for you in the Gantry core. </li></ul><ul><li>Flexibility to configure up to 6 modules in row position. </li></ul><ul><li>36 possible combinations for the layout of the mainbody/sidebars alone! </li></ul><ul><li>65 base module positions. Easily add more! </li></ul><ul><li>Flexibility to configure different grid-size layouts based on number of published modules. You are not forced to use the same grid layout for every page </li></ul><ul><li>12 built-in Gantry Features like Logo, font-sizer, to-top smooth slider. Easily create your own to add more functionality with little coding required. </li></ul><ul><li>Visit http://www.gantry-framework.org for more … </li></ul>Joomla! Day Malaysia 2011
  22. 22. Disadvantages of Gantry <ul><li>There are so many options, it might be overwhelming to new people; </li></ul><ul><li>Additional Gantry-specific Template commands (although these are well documented); </li></ul><ul><li>Can be complex to debug; </li></ul><ul><li>Easy to create Interfaces that are heavy on Javascript and slow if you are not careful. </li></ul>Joomla! Day Malaysia 2011
  23. 23. Advantages of T3 <ul><li>Getting started : Excellent & extensive step-by-step documentation for creating a template from scratch, defining blocks, module positions, creating and specifying module chrome, adding IE 6 alerts, RTL support, and so on, for use by novice users and serious template developers and site designers </li></ul><ul><li>Menus: several attractive menu options, including a Mega Menu that is tightly integrated with the Core Menu Items and allows the assignment of Modules, such as the Login Module, or embedded video within the Menu Item definition </li></ul><ul><li>Layouts: several popular layout options like newspaper layouts with column and row options, grid layouts for galleries or eCommerce applications, and a standard &quot;full&quot; layout, all with header and footers and ability to create new and adapt existing layouts </li></ul><ul><li>Styling: clearly marked class and id structures for layouts, typography options, </li></ul><ul><li>Handheld devices: support for iPhone and Handheld devices, and instructions for customization </li></ul><ul><li>Themes: ability to use, create, and store collections of configuration options into &quot;themes&quot; that can be assigned to Menu Items </li></ul><ul><li>Template Manager Enhancements: user friendly Ajax driven interface </li></ul><ul><li>Free and GPL </li></ul><ul><li>Visit http://wiki.joomlart.com/wiki/JA_T3_Framework_2/Overview for more ... </li></ul>Joomla! Day Malaysia 2011
  24. 24. Disadvantages of T3 <ul><li>Template Manager JavaScript: Heavy JavaScript usage within the Joomla! Template Manager </li></ul><ul><li>Additional Installation Elements: While it uses the normal Joomla! Installation process, the installation of a Component and two Plugins is also required </li></ul><ul><li>New users: The range and depth of options could be overwhelming for very new users </li></ul>Joomla! Day Malaysia 2011
  25. 25. Future Framework for Future Joomla! Versions <ul><li>Should support CSS3 for all browsers </li></ul><ul><li>Should support HTML5 or able to create HTML5 templates </li></ul><ul><li>May be automated drag and drop support which can create module positions </li></ul><ul><li>according to the boxes. </li></ul><ul><li>Equal heights for modules (optional) </li></ul><ul><li>May be all framework creator should be togather to create “awesome” single framework </li></ul><ul><li>Should support and only one template specific css file for all </li></ul><ul><li>Joomla! Versions </li></ul><ul><li>Personal working experience about framework </li></ul><ul><li>You can tell more / suggestions … </li></ul>Joomla! Day Malaysia 2011
  26. 26. 6 MONTHS FREE HOSTING & FREE DOMAIN Joomla! Day Malaysia 2011
  27. 27. Thank you Saurabh Shah www.CloudAccess.net Twitter : @saurabhshah Email : saurabh@cloudaccess.net [email_address] Joomla! Day Malaysia 2011
  1. A particular slide catching your eye?

    Clipping is a handy way to collect important slides you want to go back to later.

×