Template overrides austin

1,539 views

Published on

Published in: Technology
0 Comments
0 Likes
Statistics
Notes
  • Be the first to comment

  • Be the first to like this

No Downloads
Views
Total views
1,539
On SlideShare
0
From Embeds
0
Number of Embeds
7
Actions
Shares
0
Downloads
8
Comments
0
Likes
0
Embeds 0
No embeds

No notes for slide

Template overrides austin

  1. 1. Hacking Joomla The rightwayBy Chad Windnagle
  2. 2. Who Am I?• Lead Developer at s-go Consulting• Joomla Expert• Joomla Google Summer of Code Co- Admin• Motorcycle Enthusiast• College Student
  3. 3. Why You Care• Consistent Layout• HTML5• Mobile• Custom Tailored For You
  4. 4. Important concepts• The Rule• The reason• The exception• Language Overrides• Layout Overrides
  5. 5. The rule "Dont hack Joomla." (includes core extensions and non-core extensions!)
  6. 6. Why It kills puppies
  7. 7. Why and kittens
  8. 8. Everything is bigger in Texas?
  9. 9. Not if you break the rules
  10. 10. Seriously...its badHacking Core Code Causes:• Security Vulnerabilities• Update Nightmares• No longer Feature / Future Proof• Normal sized foods
  11. 11. The exception There are times when you can modify code without killing our four legged friends
  12. 12. Its not hardJoomla 1.5 and Joomla 2.5 made changing things correctly a very easy task.
  13. 13. Several "approved" methods:Two ways to hack Joomla, properly1. Language Override2. Template Override
  14. 14. Language Overrides: Really coolJoomla 2.5 FeatureJoomlas language manager allows you to search, find, and override language constants.
  15. 15. What are language constants?Language constants are text strings, a lot like variables, with a value assigned them. They areused in components, modules, and plugins, and their purpose isto make development and translation easier.
  16. 16. Changing a language constantbefore...
  17. 17. Changing a language constantafter...
  18. 18. One more time…before...
  19. 19. Changing a language constantafter...
  20. 20. Lets try it out... {Live Demo}
  21. 21. Important concepts• The Rule• The reason• The exception• Language Overrides• Layout Overrides
  22. 22. Template Layout OverrideTemplate overrides allow you to store copies of view files in your template directory, and change them as needed.
  23. 23. Template Layout OverrideJoomla will load any template views in priority over views in an extensions view directory.
  24. 24. Typical Component File System We can only override VIEW files
  25. 25. Understand the directory structureWe copy files from:<joomla>components/com_content/views/featured/tmpland put them in:<joomla>/templates/atomic/html/com_content/featured
  26. 26. Compare...
  27. 27. What happened?Joomla will check the loaded template for any installed components and views. If it finds a match, it will load the file in the template, and skip the component.
  28. 28. What happens...a visual Joomla! loads these files Joomla skips these files
  29. 29. ResultWe can now make changes to the filesin template that will load instead of the components included files.
  30. 30. Try it out {Live Demo}
  31. 31. Remember• Only views can be overridden• If the html directory doesn’t exist, you can create it.• Joomla will ‘know’• If it doesn’t work, you probably misspelled something
  32. 32. Important concepts• The Rule• The reason• The exception• Language Overrides• Layout Overrides
  33. 33. Bonus features• The Rule• The reason• The exception• Language Overrides• Layout Overrides• Module Chrome
  34. 34. In template html add modules.phpAdd this function:function modChrome_name($module, &$params, &$a ttribs) { echo $module->title; echo $module->content;}
  35. 35. In template index.phpCheck out jdoc for modules<jdoc:include type="modules" name="atomic- bottomleft" style="name" />
  36. 36. Match it upSee that modChrome_name and the moduleinclude uses the style name.
  37. 37. What does it mean?We can now add any HTML or PHP code to modules.php which can change how module content is presented in the template.
  38. 38. We will attempt this... {Live Demo}
  39. 39. Bonus features• The Rule• The reason• The exception• Language Overrides• Layout Overrides• Module Chrome
  40. 40. Basic non-Joomla concept CSS styles can be overwritten by using cascading order selection statements.
  41. 41. Cascading order in CSSCSS Code:p {color:black;font-size:100%} div.intro p {color:white;font-size:200%}HTML code: <p>A paragraph with black text</p> <div class="intro"> <p>paragraph witwhite text</p></div>
  42. 42. In Joomla...
  43. 43. Cascading order in CSSInstead of changing redshop.css, I can add to my template css a ordered selection to change (override) css styles.
  44. 44. Cascading order in CSSBy simply adding an ordered css statement, weoverride the components css file with our own.
  45. 45. Cascading order in CSS {Live Demo}
  46. 46. New rule Dont change core code. This includes CSS files!
  47. 47. Conclusion•Use the language manager tomake your site fit you.•Use template overrides tomake all your componentsconsistent and user friendly.
  48. 48. Conclusion•Use modules.php to add coolfeatures to all your modules.
  49. 49. Contact me Chad Windnagle s-go Consulting s-go.net chad@s-go.net @drmmr763

×