Tuesday, March 9, 2010

Joomla 1.5 template design

Joomla 1.5 template design





 Publisher:   Packt Publishing 
Number Of Pages:   284 
Publication Date:   2009-06-19 
ISBN-10 / ASIN:   1847197167 
ISBN-13 / EAN:   9781847197160
 

Table of Contents
Preface 1
 

Chapter 1: Getting Started as a Joomla! Template Designer 7
Joomla! 1.5 perks 8
Pick a template or design your own? 9
Drawbacks to using a pre-made template 9
This book's approach 10
Things you'll need to know 10
Joomla! 1.5 11
CSS 11
XHTML 12
PHP 12
Not necessary, but helpful 13
Tools of the trade 13
HTML editor 13
Graphic editor 14
Firefox 15
We'll be developing for Firefox first, then IE and other browsers 15
Summary 16
 

Chapter 2: Template Design and Approach 17
Things to consider 17
Types of sites 18
Modules, components, and plugins 20
Getting ready to design 22
We have a problem 22
It gets worse 23
The solution: Rapid design comping 23
Let's get started! 25
Think about it: Positions 25

Sketch it 27
Consider usability 29
Start with the structure 29
The DOCTYPE 30
The main body 31
Attach the basic stylesheet 32
Basic semantic XHTML structure 34
Adding text: Typography 36
Start with the text 36
A quick note about starting to style with CSS 38
Font choices 39
Get daring: Font stacks 41
sIFR 41
Cascading fonts 41
Font sizing 42
Paragraphs, blockquotes, and other text markup 44
Default links 44
Form elements 46
The layout 47
How wide to make your site? 47
CSS tables versus floating divs 51
Navigation 52
More navigation: Joomla! 1.5 specific styles 54
Color schemes 55
Two-minute color schemes 56
Color schemes with Gimp or Photoshop 56
Adding color to your CSS 58
Create the graphical elements 59
Graphic styles 60
Handling edits and changes 62
Relax and have fun designing! 63
Slice and export 65
Don't forget your favicon! 70
Make your favicon high resolution 72
Summary 72
Chapter 3: Coding It Up 73
Got Joomla? 73
Understanding the Joomla! 1.5 template 74
Basic, core template files 74
Advanced template files 75
Your Joomla! 1.5 work flow 76
Let's build our template! 78

Tabula rasa 78
Including Joomla! 1.5 content 82
Congratulations! 84
General Joomla! stylesheets 85
The content component 85
Module positions 86
Jdoc tag overview 87
Updating the templateDetails.xml file 90
Placing module positions in the index.php file 92
Assign modules to your positions 95
Hello? Content is wrapped in tables. Gross! 97
Everything is better with Beez 98
Using template overrides 98
Final CSS tweaks and fixes 101
Summary 108
Chapter 4: Debugging and Validation 109
Don't forget about those other browsers and platforms! 110
Introduction to debugging 110
Troubleshooting basics 112
Why validate? 113
Joomla jdoc tags and PHP 114
CSS quick fixes 115
Advanced troubleshooting 116
Fixing CSS across browsers 117
Box model issues 117
Everything is relative 118
To hack or not to hack 119
Out-of-the-box-model thinking 120
Style for IE separately with conditional comments 121
The road to validation 122
XHTML validation 123
CSS validation 125
Advanced validation 126
FireFox's JavaScript/Error Console 127
The Web Developer Toolbar 128
FireBug 129
Checking your work in Internet Explorer 130
Run multiple versions of IE 130
IE Developer Toolbar 131
Don't forget about the QorSMode bookmarklet 131
Extra credit: Optimizing for text and mobile browsers 131
What about the new Mobile Safari browser? 131
Summary 132

Chapter 5: Your Template in Action 133
A picture's worth a thousand words 133
Template packaging basics 135
The templateDetails.xml file 136
Quick XML syntax overview 136
From the top 136
Descriptive tags 138
Copyright and licensing? 140
File, position, and param tags 143
What about the html directory? 147
Param tags 147
ZIP it up! 148
No way to ZIP? 149
One last test 150
Troubleshooting installations 151
Summary 153
Chapter 6: Joomla! 1.5 Template Reference 155
Jdoc include tags 155
Site header information tag 156
Joomla! 1.0 to 1.5 conversion 156
The component include tag 156
Joomla! 1.0 to 1.5 conversion 156
Module position tags 156
Module position styles 157
Joomla! 1.0 to 1.5 159
Menu output options 159
Using overrides 161
Module overrides and chrome 161
How module chrome works 163
Component overrides 164
Pagination 166
Additional template information 166
Common Joomla! CSS 167
Joomla! 1.5 CSS ids 168
Joomla! 1.5 CSS classes 169
Joomla! 1.0 to 1.5 conversion 173
Template parameters 173
Define a parameter in the templateDetails.xml file 173
Retrieve a parameter in the template file 174
Useful standard parameter types 174
Summary 175

Chapter 7: Dynamic Layouts, Menus, and Interactive Elements 177
DIY or extensions? 178
Dynamic layouts 178
PHP syntax 180
PHP if/else conditional statements 180
Update your CSS 184
Dynamic menus 185
Drop-down menus 186
DIY Suckerfish menus in Joomla! 1.5 186
Applying the CSS to Joomla! 188
Applying the DOM Script to Joomla! 191
Flash-ize It 194
Flash in your template 194
Pass Flash a Joomla! variable 196
The ObjectSwap method for Flash 199
Flash in Joomla! content or modules 201
Summary 207
Chapter 8: AJAX/Dynamic Content and Interactive Forms 209
Preparing for dynamic content and interactive forms 210
Joomla! extensions 211
Deciding where AJAX is best used 212
Installing the Joomla! comment component 213
Installing the core design Ajax Pagebreak plugin 215
Installing the AJAX RSS Reader Version 3 with Draggable Divs module 216
AJAX: It's not just for your site's users 217
The AJAX factor 219
JavaScript component/plugin scripts 220
The problem 220
Enter jQuery lightBox 221
Summary 226
Chapter 9: Advanced Enhancements and Design Tips for
Joomla! 1.5 227
Giving users control 227
Editing a template override 232
Adding suffixes to modules and pages 234
Page suffixes 234
Module suffixes 236
The trick 236
Design tips and tricks 237
The cool factor essentials 238
Backgrounds 239

Lists 240
See it in action 240
Rounded corners 241
The classic: All four corners 241
The two image cheat 243
Text to image replacement 246
Extra credit: Use PHP to make graphic headers easy 249
More extra credit: Make unique fonts even easier with the sIFR technique 251
Learn all about your image editor and keep tabs on
current design trends 252
Good design isn't always visual: Looking at SEO 255
Search-engine-friendly URLs 256
Keywords and descriptions 258
Summary 259
Index 261





Download links are here :


For English readers :


http://ubookmark.blogspot.com/2010/02/do-you-know-joomla-also-joomla-learning.html


For Arabic readers :

http://ubookmark.blogspot.com/2010/02/blog-post_24.html

1 comment: