joomla day uk 2009 basic templates
DESCRIPTION
Joomla basic template modifications presentation given at Joomla Day UK 2009 in Maidstone, Kent, UK.TRANSCRIPT
- 1. Joomla! Day UK 2009
2. Joomla! Day UK 2009 Basic Template Modifications Providing a flexible platform for digital publishing and collaboration. Chris Davenport Joomla! Core Team 3. Choosing a template Choose primarily for layout Ignore colour Ignore actual images, as long as image sizes are correct 4. Core templates Milky Way Beez JA Purity 5. Copying a core template
-
- Tip: Never modify a core template take a copy first, then modify the copy.
-
- Bad news: There is no Copy button.
6. How to copy a template 1 Each template lives in a separate directory in the [joomla-root]/templates directory Copy the template directory Then paste it under a new name 7. How to copy a template 2 Copy xx-XX.tpl_[old-template].ini to xx-XX.tpl_[new-template].ini Look for language files in: [joomla-root]/language/xx-XX and [joomla-root]/administrator/language/xx-XX where xx-XX is the language code eg. en-GB is British English
-
- Make copies of any language files needed.
8. How to copy a template 3 rhuk_milkyway 11/20/06Andy [email protected]://www.rockettheme.comGNU/GPL1.0.2TPL_RHUK_MILKYWAY Edit templateDetails.xml Change this to match the new directory name 9. How to copy a template 4
- Unfortunately, there are some places where the name of the template is hard-wired into the template code.
- Edit index.php and replace rhuk_milkyway or beez with the new name of your template.
10. Tools 11. Web developer toolbar http://addons.mozilla.org/firefox/60/ 12. Template parameters 13. Changing logos and images
- Find the image you want to change.
- Web Developer: Images -> View image information.
- Create a new image thesame sizeand thesame name .
- Copy your new image over the top of the old one.
- Refresh your browser.
14. Changing the favicon
- Create a 16 x 16 pixel image.
- Convert it to .ico format.
-
- http://converticon.com/
-
- http://www.favicongenerator.com/
-
- http://www.htmlkit.com/services/favicon/
-
- http://tools.dynamicdrive.com/favicon/
-
- http://www.favicon.cc/
- Place it in the Joomla root or the template root.
- It's cached so you must do a browser refresh.
15. Layout overrides 16. Core CSS classes
- Component layouts
- Component layout overrides
- Module layouts
- Module layout overrides
- Module chrome
- Pagination overrides
- Templates
17. Component CSS classes .componentheading .contentheading .small .createdate .modifydate .readon .contentheading With Beez overrides, this becomes .createdby 18. Use the tools 19. Finding module positions http://localhost/index.php ?tp=1 If there are already query parameters: http://localhost/index.php?option=com_content........&Itemid=27 &tp=1 Module position name Module chrome styles 20. Module chrome 21. Core chrome styles
22. Module chrome in action Module chrome: xhtml CSS class: moduletable Module chrome: xhtml Suffix: _text CSS class: moduletable_text Module chrome: rounded CSS class: module Module chrome: rounded Suffix: _menu CSS class: module_menu 23. Module Class Suffix