SKIP THE SHIPPING
Use code NOSHIP during checkout to save 40% on eligible eBooks, now through January 5. Shop now.
Register your product to gain access to bonus material or receive a coupon.
Master All Facets of Joomla! Site Customization with Templates
Now, for the first time, there’s a complete, authorized guide to template design, development, and customization with Joomla!. Packed with examples, this clear, concise, practical text covers everything from beginning-level skills to power techniques–even creating new HTML5-native mobile views, today’s most exciting new Joomla! capability.
Internationally renowned Joomla! expert Angie Radtke brings together essential knowledge about usability, CSS, information architecture, PHP, JavaScript, accessibility, HTML5, and more. Using concrete examples, Radtke guides you through applying these technologies and best practices to construct and deploy world-class site templates. You’ll walk through every key technical option, fully understanding the internal interactions that control Joomla! template behavior. Radtke concludes by walking you step-by-step through a complete workshop project: transforming a template created in Photoshop into a working Joomla! template.
Joomla!® Templates will be invaluable for every professional web designer and developer who uses Joomla!, for advanced nonprofessional users, and for less experienced users who want to customize their own sites instead of paying others to do it. This title’s concise, easy-to-use coverage includes
Link to author site: http://joomlatemplatebook.com
A link from Joomla! Templates can be found here: joomla.org.
Now for the Details: A First Look at Joomla! Templates
Download the sample pages (includes Chapter 8 and Index)
Introduction xvii
Acknowledgments xxi
About the Author xxiii
Chapter 1: The Basis: Designing the Content and Visual Concept 1
It All Starts with the Structure 1
Recognizing User Expectations 2
Page Layout–Visually Structuring Content 3
The Graphical Layout–Visual Appearance Matters 7
Fixed and Fluid Layouts 16
Chapter 2: Accessibility–What Is It? 19
The Legal Basis 20
Visual Impairment 21
Motor Disabilities 29
Deafness 31
Learning Disabilities 31
Seniors 33
Chapter 3: CSS and HTML–Getting the Basic Structure into Shape 35
A Few Words about the History 35
Which Version of HTML Should I Use? 36
The Basic HTML Structure 38
A Brief Introduction to CSS 38
Using Multiple Classes Together 44
Positioning and Box Model 47
CSS Hacks and Browser Problems 52
CSS Tuning 54
CSS3–A Brief Overview 55
Vendor Prefixes 55
Overview of the Three Most Useful CSS Statements 56
Chapter 4: Responsive Web Design 59
But How Does It Work? 59
CSS3 Media Queries 60
Adapting Graphics and Videos 61
Using HTML5 Apps 62
Chapter 5: PHP and Joomla! 63
Integrating PHP 63
Comments 65
echo 65
Conditions: if Statements 66
For Pros: Accessing Objects and Their Values 68
Chapter 6: MooTools 71
Why MooTools? 72
MooTools Quick Start–Dollar Functions and Events 73
The MooTools Core in Action 74
The Class System 76
The MooTools Principle 79
Related Links 81
Chapter 7: Tools 83
HTML Validator and CSS Validator 83
Web Developer Toolbar 84
Firebug 85
Helpful Tools for Accessibility 86
Accessibility Extensions for Internet Explorer and Mozilla Firefox 87
Chapter 8: Now for the Details: A First Look at Templates 91
Atomic 91
beez_20 and beez5 91
The Template Manager: Styles 92
The Template Manager: Templates 94
Installing Templates 99
Chapter 9: The Underlying Structure 101
The Heart of the Matter, the index.php 102
The css Folder 102
templateDetails.xml 103
The images Folder 103
The html Folder 103
The javascript Folder 103
The language Folder 103
component.php 103
error.php 104
template_thumbnail.png and template_preview.png 104
favicon.ico 104
The fonts Folder 105
The index.html 105
Chapter 10: The index.php: The Heart of the Matter 107
The Document Head 107
And Off We Go: The Body 114
Chapter 11: The XML File and the Template Parameters 117
templateDetails.xml: General Information 117
Template Parameters: config 124
Chapter 12: The Language Files 135
How Joomla! Translates Constants to Multiple Languages 135
Adding Your Own Languages 136
Joomla! Conventions for Using Language Strings 137
Language Files in index.php Using the Examples of Skip Links 137
Chapter 13: Modules–Dynamics within the Presentation 139
jdoc:include 139
Integrating the Module Flexibly into the Layout 149
The Module Class Suffix 151
The Menu Module 155
Chapter 14: Designing Default Output Individually 161
Inspecting the Default Output 161
The Page Class Suffix 162
Template Overrides 165
Model-View-Controller 166
Chapter 15: The System Template: Adapting and Modifying Output 173
System Notices 173
Replacing System Graphics 179
component.php and How to Do Magic with It 179
offline.php 183
Chapter 16: Advanced Template Customization Tricks 185
When the Reading Direction Changes: Right-to-Left Languages 185
PHP Browser Switch 187
PHP Tricks 189
Chapter 17: The Default Templates and Their Features 193
beez_20 and beez5 Templates 193
Atomic Template 207
Chapter 18: Practical Implementation 211
Concept of the Beez Templates 212
Chapter 19: Step by Step to a New Layout 217
Step 1: Positioning the Navigation 218
Step 2: Filling the Center Column with Content 218
Step 3: Adjusting the Number of Articles 223
Step 4: Visually Designing the Header 223
Step 5: Integrating the Module Position for the Header Picture 235
Step 6: Adapting the Footer 239
Step 7: Adapting the Minimum Height of Content 240
Step 8: The First Tests 241
Step 9: Customizing Typography 245
Step 10: Formatting Module Headings 246
Step 11: Assigning the Background Image to the Homepage Article 249
Step 12: Final Tests 253
Chapter 20: Integrating Custom Features 259
The Header Image–A Background Image? 259
Using HTML5 Effectively 265
Chapter 21: Final Tasks: Fine-Tuning and Creating an Installable Zip Archive 273
Fine-Tuning 273
Adapting the XML File 277
Creating a Zip Archive 278
Appendix 279
Useful Links 279
Helpful Functions 282
CSS Classes Used and Their Elements 283
Index 315