Joomla! - Editions ENI

Transcription

Joomla!
Conception et personnalisation des templates
Chapitre 1 : La gestion des templates
A. L’objectif
13
B. Exploiter les templates
13
C. Le template par défaut
13
D. Gérer les templates
14
1. Installer un template
2. Lister les templates et les styles
3. Filtrer les templates et les styles
4. Désactiver un template
5. Désinstaller un template
6. Gérer les styles
14
16
17
20
21
22
E. L’aperçu des templates
22
1. Activer l’aperçu
2. Aperçu des autres templates
22
24
F. Les paramètres des templates
26
1. Les fichiers constitutifs
2. Les options de style des templates
3. L’affectation des menus
26
29
31
Chapitre 2 : La structure des templates
A. L’objectif
35
B. Le dossier du template
35
1. Les templates pour Joomla!
2. Les fichiers d’un template
www.editions-eni.fr
35
35
© Editions ENI
1/10
Joomla!
C. Le fichier de description
36
1. L’objectif
2. L’en-tête
3. Le concepteur
4. Les fichiers d’installation
5. La liste des positions
6. Les langues disponibles
7. Les options du template
36
37
37
37
38
39
39
D. Les inclusions JDOC
42
1. L’objectif
2. L’en-tête
3. Les composants
4. Les messages
5. Le débogage
6. Le chargement des modules
7. L’affichage des modules
42
42
42
43
43
43
45
E. La position des modules
45
F. Les classes CSS de Joomla!
47
1. Les classes par défaut
2. Connaître les classes par défaut
47
48
Chapitre 3 : Un template simple
A. L’objectif
53
B. La structure du template
54
1. Le dossier
2. Le fichier index.html
3. Les styles CSS
54
54
54
www.editions-eni.fr
© Editions ENI
2/10
Joomla!
4. Les images
5. Le fichier de description
6. Le fichier maître
7. Les vignettes
8. Le dossier du template
54
54
55
55
55
56
1. L’objectif
2. L’en-tête
3. La déclaration d’extension
4. Les informations du template et du concepteur
5. Les fichiers du template
6. Les positions
7. Les autres paramètres
8. Le code complet
56
56
56
56
58
58
60
60
D. Les conteneurs
61
E. Le début du fichier index.php
62
1. L’objectif
2. Restreindre l’accès direct
3. Les déclarations HTML
4. L’élément <head>
5. Les métadonnées
6. Les feuilles de style par défaut
7. Notre feuille de style
8. La fin de l’en-tête
9. Le code complet
62
62
62
63
63
64
65
65
65
F. Le corps du fichier index.php
66
1. Le corps de la page
2. Les conteneurs
66
66
G. La mise en forme CSS
www.editions-eni.fr
67
© Editions ENI
3/10
Joomla!
H. Le conteneur principal
68
I. L’en-tête de la page
68
1. Les boîtes d’affichage
2. L’image de fond de l’en-tête
3. Le logo
4. Le module de recherche
68
68
69
70
J. La barre des menus
71
1. La mise en forme
2. Insérer la barre des menus
71
71
K. La zone centrale
72
1. Les boîtes d’affichage
2. Les conditions d’affichage
3. La mise en page
4. Les règles CSS
72
72
74
76
L. Le pied de page
77
M. Le code complet
78
1. Pour le fichier index.php
2. Pour le fichier template.css
78
80
N. L’affichage du site
82
1. Le template
2. Les modules
3. L’affichage
82
82
87
Chapitre 4 : Un template complet
www.editions-eni.fr
© Editions ENI
4/10
Joomla!
A. L’objectif
93
B. La structure du template
94
1. Le dossier
2. Le fichier index.html
3. Les styles CSS
4. Les images
5. Le fichier de description
6. Le fichier maître
7. Les vignettes
8. Le dossier du template
94
94
94
94
95
95
95
95
96
1. L’objectif
2. L’en-tête
4. Les informations du template et du concepteur
5. Les fichiers du template
6. Les positions
7. Le code complet
96
96
96
96
97
97
99
D. Les conteneurs
101
E. Le début du fichier index.php
102
1. L’objectif
2. Le code
102
102
F. Le corps du fichier index.php
102
G. Les conteneurs
103
1. La mise en page
2. Les styles CSS des tableaux
www.editions-eni.fr
103
105
© Editions ENI
5/10
Joomla!
H. Le bandeau supérieur
105
1. L’affichage
2. Les styles CSS
3. Le contenu
4. Le code généré
105
106
107
107
I. La barre des menus
108
1. L’affichage
2. Les styles CSS
108
109
109
J. Les zones des nouvelles
110
1. L’affichage des nouvelles dans les positions
2. Les styles CSS et l’affichage
3. L’affichage conditionnel
4. Les styles CSS pour les nouvelles
5. L’affichage des nouvelles
6. Les styles CSS des modules inclus
K. La zone centrale
110
111
112
114
115
116
118
1. L’affichage dans les positions
3. Adapter les largeurs des colonnes
4. Les styles CSS pour les colonnes
5. L’affichage
6. Les styles CSS des modules inclus
L. Le fil d’Ariane
118
119
120
123
124
127
130
1. L’affichage
2. Les styles CSS
3. Les styles du module
130
131
131
M. La zone des informations
132
www.editions-eni.fr
© Editions ENI
6/10
Joomla!
3. Les styles CSS pour les informations
4. L’affichage
5. Les styles des modules
N. Le pied de page
132
132
134
135
137
137
3. Les styles CSS
4. L’affichage
137
138
138
138
138
O. Le code du template
139
1. Le code complet du fichier index.php
2. Le code complet du fichier template.css
P. Le site avec le template complet
139
142
145
1. Installer le template complet
2. Les modules du site Joomla!
3. L’en-tête du site
4. La zone centrale
5. La zone des informations
6. Le pied de page
7. L’affichage du site
145
145
145
145
145
145
146
Chapitre 5 : Les options et styles des templates
A. L’objectif
149
B. Le fichier de description
150
C. Les options de template
150
www.editions-eni.fr
© Editions ENI
7/10
Joomla!
1. La description XML
2. Les options disponibles
150
151
D. Un sélecteur de couleur
152
1. La création de l’option
2. L’affichage de l’option
3. Modifier les styles CSS
4. Utiliser l’option
152
153
154
154
E. Ajouter une image
156
3. Modifier le code
156
157
157
159
F. Un champ de saisie
161
3. Modifier le code
161
162
162
163
G. Insérer un choix unique
164
3. Modifier le code
164
165
165
166
H. Le code complet
168
1. Le fichier templateDetails.xml
2. Le fichier index.php
168
170
I. Les styles des templates
174
1. L’objectif
2. Renommer un style
174
175
www.editions-eni.fr
© Editions ENI
8/10
Joomla!
3. Créer un nouveau style
4. Utiliser le nouveau style
176
178
Chapitre 6 : Le template Protostar
A. L’objectif
183
B. La structure du dossier
184
C. Le fichier templateDetails.xml
188
1. L’en-tête
3. Les informations du template
4. La liste des fichiers
5. Les positions
6. Les fichiers de traduction
7. Les options du template
8. L’option de couleur globale
9. L’option de couleur d’arrière-plan
10. L’option de sélecteur de fichier
11. L’option pour le titre du site
12. L’option de description du site
13. L’option des fontes Google
14. L’option du choix de la fonte
15. L’option de l’affichage fluide
188
188
188
189
190
192
192
193
194
195
197
198
199
201
201
D. Le fichier index.php
205
1. Le commentaire initial
2. Les paramètres du template
3. L’édition des articles
4. Le chargement des librairies
5. Les paramètres utilisateur
6. L’ajustement de la largeur
7. L’affichage du logo ou du titre
www.editions-eni.fr
205
205
207
207
207
207
208
© Editions ENI
9/10
Joomla!
8. La fin du PHP
9. L’en-tête HTML
10. La taille des écrans
11. L’inclusion de l’en-tête
12. Les fontes Google
13. La couleur globale
14. La compatibilité Internet Explorer
15. La fermeture de l’en-tête
16. Le corps de la page
17. La structure des boîtes <div>
18. Les boîtes principales
19. La boîte de l’en-tête
20. La boîte de la navigation
21. La zone centrale
22. La boîte du pied de page
209
209
210
210
210
211
212
213
213
214
215
215
216
216
217
E. Les mises en page spécifiques
217
1. La mise en page fluide
2. La mise en forme de l’en-tête
3. La mise en forme du pied de page
Index
www.editions-eni.fr
217
218
218
221
© Editions ENI
10/10

Joomla! - Editions ENI

Transcription

Documents pareils

Créer ET ADMINISTRER un forum en php bb

Formez-vous à un métier qui recrute ! Formation

Créer son premier template pour Joomla!

Savoir créer un site web (Initiation)

studio - ti6 - Placeman Pascal

Module de formation Joomla Intégration

Maîtriser Joomla!

Manuel Personnalisation des templates pour LogiVert 6

Créer un modèle pour Joomla 1.5

Programme de formation CorelDraw Perfectionnement