Cyprien Roudet Framabook Atelier Drupal 7 CC-By

Atelier
Crer un site internet avec un CMS pas comme les autres

Troisime dition
Cyprien Roudet
Framasoft a t cr en novembre 2001 par Alexis Kauffmann. En janvier 2004 une association ponyme a vu le jour pour soutenir le dveloppement du rseau. Pour plus d'information sur Framasoft, consulter http://www.framasoft.net. Se dmarquant de l'dition classique, les Framabooks sont dits "livres libres" parce qu'ils sont placs sous une licence qui permet au lecteur de disposer des mmes liberts qu'un utilisateur de logiciels libres. Les Framabooks s'inscrivent dans cette culture des biens communs qui, l'instar de Wikipdia, favorise la cration, le partage, la diffusion et l'appropriation collective de la connaissance. Le projet Framabook est coordonn par Christophe Masutti. Voir: http://framabook.org
Auteur : Cyprien Roudet Ce livre est publi sous la licence libre Creative Commons-BY http://creativecommons.org/licenses/by/2.0/fr ISBN : 978-2-9539187-3-1 Prix : 29,00 euros Dpt lgal : Janvier 2012, Framasoft 5, Avenue Stephen PICHON | 75013 PARIS Pour les logos Framasoft et Framabook : LL de Mars, licence Art Libre Couverture. Cration : Flavie ROUDET, licence CC-By Remerciements : Flavie ROUDET, Christophe MASUTTI, Chlo GIRARD, Delphine HERVE
SOMMAIRE
Introduction . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .8 Chapitre I - Dmarrage rapide . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 11 1 Installation de Drupal . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .12
1.1 1.2 1.3 Installation rapide sous Windows . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 12 Tlchargement et accs linstallateur de Drupal . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 13 Installation rapide sous Linux . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 19 Le contenu. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . Les menus . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . Les blocs . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . Gestion des permissions . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . Les modules . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . Modification des thmes de Drupal . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 27 34 38 40 42 49
la dcouverte de Drupal . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .27

2.1 2.2 2.3 2.4 2.5 2.6
Chapitre II - Utiliser Drupal . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 55 1 Administrer Drupal par linterface . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .55

1.1 1.2 1.3 1.4 1.5 1.6 1.7 1.8 2.1 2.2 2.3 2.4 Toolbar : les menus de votre site . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . Page de configuration du site. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . Installation de modules (Captcha : vitez les robots malveillants) . . . . . . . . . . . . . . . . . Page de configuration des modules . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . Dsactivation et dsinstallation . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . Le tableau de bord . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . Thme dadministration / Overlay . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . Help : les pages daide . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 55 56 57 62 63 64 66 66 67 73 78 85
Organisation du site . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .67

Block : les blocs . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . Menu : les menus . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . User : gestion des utilisateurs . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . Path : url de vos pages . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .
Ajout de contenu . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .88

3.1 3.2 3.3 3.4 4.1 4.2 4.3 4.4 Les types de contenu . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 88 Filter : formatez vos textes . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 92 Video filter : affichez des vidos dans votre contenu . . . . . . . . . . . . . . . . . . . . . . . . . . . . 98 Wysiwyg : installer un diteur Wysiwyg . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 101 Dcouverte du type de contenu article . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . Cration dun nouveau type de contenu. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . Taxonomy : classer le contenu . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . Ajout de champs aux autres entits. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 106 117 129 135
Field UI : types de contenus personnaliss . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .106
Chapitre III - Administration systme de Drupal . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 145 1 Configuration de Apache PHP MySQL . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .146
1.1 1.2 1.3 1.4 1.5 2.1 2.2 2.3 2.4 2.5 3.1 3.2 3.3 4.1 4.2 4.3 Configuration de Apache . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . Configuration de PHP . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . Configuration de MySQL . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . Choisir un hbergeur . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . Configuration du serveur pour lenvoi de mail . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . Sauvegarde / Restauration de larborescence de fichiers . . . . . . . . . . . . . . . . . . . . . . . Sauvegarde / Restauration de la base de donnes . . . . . . . . . . . . . . . . . . . . . . . . . . . . Backup and Migrate : sauvegardez votre base de donnes . . . . . . . . . . . . . . . . . . . . . Features : transfrez la configuration de votre site . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . Sauvegarde / restauration dune vue . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 146 150 151 155 156 159 160 162 168 172
Sauvegarde / Restauration . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .158
Outils dadministration . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .173

Optimisation des performances . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 173 Update Status : mettre jour Drupal . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 174 Le Cron . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 178 Gestion des utilisateurs . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 178 Gestion des nodes . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 183 Gestion des champs. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 185
La base de donnes de Drupal . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .178
Chapitre IV - Description de modules utiles de Drupal . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 193 1 Views : organisez vos donnes . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .193
1.1 1.2 1.3 1.4 2.1 2.2 2.3 Installation et dcouverte du module . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . Cration dune vue liste des recettes . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . Gestion des affichages . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . Cration dun bloc dinfo supplmentaires sur la recette . . . . . . . . . . . . . . . . . . . . . . . 195 202 215 221
Site multilingue . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .229

Locale : traduire linterface de Drupal. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 230 Participer leffort de traduction . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 237 Content Translation : traduire le contenu . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 244 Dashboard : crez un tableau de bord pour ladministrateur . . . . . . . . . . . . . . . . . . . . Administration menu : une alternative Toolbar . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . Shortcuts : grez la barre de raccourcis . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . Module filter : administration de la liste des modules . . . . . . . . . . . . . . . . . . . . . . . . . . . . Token : des jetons pour les modules . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . Google Analytics : mesurez laudience de votre site . . . . . . . . . . . . . . . . . . . . . . . . . . . Rules : automatisation de tches . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . CKEditor : diteur Wysiwyg complet . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . IMCE : insrer des images dans un texte partir de CKEditor . . . . . . . . . . . . . . . . . . . . Pathauto : crez automatiquement des alias d'url . . . . . . . . . . . . . . . . . . . . . . . . . . . . . Search : un moteur de recherche simple . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . Image : crez des styles dimage personnaliss . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . Display suite : prsentez vos contenus en utilisant linterface de Drupal . . . . . . . . . . . 247 248 249 252 252 254 255 263 265 268 270 272 274
Administrer Drupal . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .247

3.1 3.2 3.3 3.4 3.5 3.6 3.7 4.1 4.2 4.3 4.4 4.5 4.6
Contenu . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .263
Site coopratif . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .285

5.1 5.2 5.3 5.4 5.5 5.6 Blog : donnez la possibilit vos utilisateurs de possder un blog . . . . . . . . . . . . . . . . . Forum : crez un lieu dchange pour vos utilisateurs . . . . . . . . . . . . . . . . . . . . . . . . . . . Advanced Forum . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . Contact . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . Webform : crez des formulaires . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . Fivestar : notez vos contenus . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 285 286 288 289 290 296
Blocs, menus . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .298

6.1 6.2 6.3 7.1 7.2 7.3 Taxonomy menu : affichez vos vocabulaires dans des menus . . . . . . . . . . . . . . . . . . . . 298 Menu Block : divisez, liez et organisez vos blocs . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 299 Nice Menus : rendez vos menus dynamiques . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 302 Dmarrage rapide . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 304 Les lments de Drupal Commerce . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 312 Quelques exemples de configuration . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 319
Commerce : crez une boutique . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .304
Chapitre V - Les thmes . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 329 1 Configurer les thmes par linterface . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .329
1.1 1.2 1.3 Paramtres globaux des thmes . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 329 Color : shma de couleur du thme Bartik . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 331 Paramtres du thme Marinelli . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 332 Les fichiers dun thme. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . Modification de Orange par CSS . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . Les templates de Orange . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . Theme developer : dcouverte des templates dun thme . . . . . . . . . . . . . . . . . . . . . Exercice : mettre un filet autour des blocs dune rgion . . . . . . . . . . . . . . . . . . . . . . . . . Exercice : modifiez le format de date des commentaires . . . . . . . . . . . . . . . . . . . . . . . Exercice : exploration dun template du module Poll . . . . . . . . . . . . . . . . . . . . . . . . . . . 336 338 342 344 350 351 352
Structure et modification dun thme . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .335

2.1 2.2 2.3 2.4 2.5 2.6 2.7 3.1 3.2
Crer un thme partir dun design HTML/CSS . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .355

Cration du thme . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 355 Les rgions . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 361 Crer un template spcifique pour un type de contenu . . . . . . . . . . . . . . . . . . . . . . . . 367 Le fichier template.php . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 377 Variables de html.tpl.php . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 381 Variables de page.tpl.php . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 382 Variables de node.tpl.php . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 384
Theming du contenu . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .366

4.1 4.2 5.1 5.2 5.3
Les variables disponibles dans les templates . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .381
Le theming des vues . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .384
Chapitre VI - Introduction la cration de modules . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 389 1 Environnement de dveloppement . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .389

1.1 1.2 2.1 2.2 2.3 2.4 2.5 3.1 3.2 3.3 3.4 Installation et configuration dEclipse . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 390 Architecture dun module . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 396 La page Summary . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . La page de configuration du module . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . Utilisation des paramtres pour la page Summary. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . Excuter des requtes SQL dans un module en rcuprer le rsultat . . . . . . . . . . . . . . Theming du contenu . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 405 410 417 420 424 430 433 434 435
Votre premier module Drupal . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .404
Les outils pour mieux dvelopper avec Drupal . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .430

Devel : simplifiez votre vie de dveloppeur. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . Le module Coder . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . Drupal for Firebug . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . Dbugger avec Eclipse . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .
Index . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 443
Introduction
Introduction
Initi par Dries Buytaert l'Universit d'Anvers, et plac sous licence libre GNU GPL, voil plus de dix ans que Drupal (prononcez l'anglaise ce mot issu du nrlandais Druppel - goutte) a vu le jour et n'a cess de gagner en renomme. Class depuis 2009 parmi les meilleurs CMS (Content Management System Systme de Gestion de Contenu), il permet de crer un site Web dynamique o plusieurs utilisateurs peuvent enrichir son contenu sans connaissance particulire. Aujourd'hui, il est considr comme un vritable couteau suisse qui se transforme rapidement en : un site de nouvelles ; des forums ; des articles contenant des images, des vidos, des liens vers dautres articles, etc. ; un site e-commerce ; etc. L'ouverture et la modularit d'un CMS sont souvent des lments dcisifs lors du choix de la structure d'un site web, qu'il s'agisse d'un site personnel ou institutionnel. Drupal a l'avantage d'tre la fois apparemment simple l'installation et particulirement robuste l'utilisation. C'est pourquoi nombre de sites gouvernementaux l'utilisent, dont celui de la Maison Blanche aux tats-Unis (whitehouse.gov). un tel niveau de flexibilit correspond un niveau de complexit qui rend toutefois la comprhension de Drupal un peu plus difficile que pour les autres CMS connus. C'est sans doute-l une raison qui justifie une autre appellation : Drupal peut aussi tre considr comme un CMF (Content management Framework Plate-forme de Gestionnaire de Contenu). En effet, c'est parce qu'il propose une interface hautement sophistique que des centaines de dveloppeurs participent aujourd'hui son volution en crant et partageant un grand nombre de modules, correspondant un grand nombre de besoins. Ce livre a pour objectif de vous guider dans l'administration de Drupal, depuis son installation lutilisation de modules incontournables, et mme jusqu' la cration de vos propres modules. Comment grer un thme ? Quelles mthode pour optimiser la base de donnes ? Que doit-on savoir pour administrer les menus, un site multilingue, des forums et des blogs ? Autant de question auxquelles ce livre tchera d'apporter des rponses claires suivant une mthode pas pas, la porte du plus grand nombre.
Structure du livre :
Si vous ne connaissez pas Drupal, si vous ne savez pas exactement quoi il sert ou si vous tes impatient de le voir fonctionner, le chapitre I de ce livre est conu spcialement pour vous : il vous permettra d'installer Drupal et de dcouvrir un grand nombre de fonctionnalits en quelques heures seulement. Le chapitre II dtaille les fonctionnalits importantes de Drupal et revient plus prcisment sur certain sujets abords prcdemment. Il vous permettra galement d'apprhender le puissant outil de cration de types de contenus.
Grce au chapitre III vous saurez sauvegarder votre site, configurer votre serveur et scuriser vos donnes, avant d'approfondir au chapitre IV l'utilisation de nombreux modules qui permettent d'ajouter des fonctionnalits Drupal. La personnalisation graphique d'un site (son thme) tant un sujet incontournable, sa matrise dpend nanmoins du niveau de comprhension de l'ensemble du systme, et devient un savoir-faire qui sera trait dans le chapitre V. Enfin, le chapitre VI vous permettra de dcouvrir en douceur comment programmer de nouveaux modules correspondant vos besoins et, pourquoi pas, les partager votre tour.
Notes propos de ce livre :

Ce livre est crit comme un tutoriel, et comporte de nombreux exemples pratiques. Il peut se lire devant un ordinateur en effectuant les actions dcrites, mais il est aussi possible de le lire sans ordinateur, grce aux illustrations montrant les actions proposes.
Conventions utilises dans ce livre

h
Puce montrant qu'une action est excuter par le lecteur Lien vers un module en rapport avec le sujet trait
Information complmentaire
Astuce
Versions alpha, beta et stables :

Lors de lcriture de ce livre, certains modules taient en cours de dveloppement pour Drupal 7 et ntaient pas publis en version stable. Il convient donc de bien vrifier avant la mise en production de votre site si la stabilit des modules utiliss ne le mettent pas en pril.
Site internet :
Vous pouvez tlchargez les fichiers illustrant les exemples traits dans ce livre sur le site internet ddi cet ouvrage : http://www.framabook.org. Pour installer ces fichiers reportez-vous au chap. III 2 Sauvegardes / Restauration.
10
Introduction
Copies d'crans et traductions en franais

Pour une meilleure comprhension, de nombreuses copies d'crans illustrent ce livre. Il se peut qu'elles soient lgrement diffrentes au moment ou vous installerez les modules prsents dans ce livre, parce que vous utilisez une nouvelle version du module. Si vous dsirez suivre exactement les copies d'cran, installez les modules dans les versions indiques dans le livre. l'installation, certains modules n'taient pas encore traduits. Des traductions ont put tre imports pour raliser les copies d'cran. Pour importer des traductions reportez-vous au chap. IV 2 Site multilingue.
11
Chapitre
I
Dmarrage rapide
e but de cette premire partie est de dcouvrir Drupal par lexemple. Elle vous explique comment installer Drupal et vous guide dans vos premiers pas. Ainsi, aprs avoir lu cette partie, vous saurez ce que Drupal peut faire et quoi il peut servir. Bien que Drupal puisse fonctionner sur diffrents serveurs web et bases de donnes, les explications de ce livre se limiteront au trs classique quatuor Apache (serveur Web) PHP (langage de programmation) MySQL (logiciel de base de donnes) PhpMyAdmin (logiciel facultatif, mais pratique, permettant de grer MySQL via une interface Web). Cette partie vous prsente deux manires classiques dinstaller Drupal sur Windows et sur Linux : le premier chapitre dcrit linstallation sur Windows (logiciel WampServer) ; le deuxime chapitre dcrit linstallation sur Linux (distribution Ubuntu). Le troisime chapitre de louvrage vous accompagne dans la dcouverte de Drupal et vous explique comment crer, grer et afficher vos premiers contenus de publication, en loccurrence quelques recettes de cuisine. Si les deux manires dinstaller Drupal dcrites ici ne vous conviennent pas, le tableau suivant rsume les principales variantes dinstallation pour vous aider choisir celle qui convient le mieux votre usage :
12
I - Dmarrage rapide
Mthode dinstallation
Systmes
Avantages - Assez facile installer
Inconvnients
Conclusion
Wamp + Drupal depuis les sources
Windows
- Deux systmes diffrents (Windows pour le site de test, Linux pour le serveur de production) - Possibilit de transfert vers un serveur de production - Mthode dcrite pas pas dans ce livre - Assez facile installer
Trs bonne solution pour dcouvrir Drupal et aller un peu plus loin. Vous ne serez pas dpays si vous avez dj utilis EasyPhp
LAMP + Drupal depuis les sources
Linux
- Mme systme pour le serveur de test et de production - Mthode dcrite pas pas dans ce livre
- Si vous ne connaissez pas Linux, il peut tre difficile de dbuter avec Drupal sur un nouveau systme - Un peu difficile mettre en uvre - Ressources ncessaires pour faire tourner deux systmes sur une machine - Un peu difficile mettre en uvre - Ressources ncessaires pour faire tourner deux systmes sur une machine
La meilleure des solutions si vous connaissez Linux et shabituer administrer un serveur ddi
Windows + virtuali- Windows + sation de Linux Linux
- Vous pouvez utiliser tous les outils de dveloppement web non disponibles sous Linux - Vous avez un serveur local sous Linux
Trs bonne solution pour les habitus de Windows qui veulent dcouvrir Linux
Linux + virtualisation Windows
Linux + Windows
- Vous pouvez utiliser tous les outils de dveloppement web ddis Windows - Vous avez un serveur local sous Linux
Bonne solution pour les utilisateurs dsirant passer Linux en douceur
Si vous possdez un serveur ddi et que vous navez pas dexprience dans son exploitation, je vous conseille dinstaller Drupal dabord localement pour viter de rencontrer les problmes lis aux spcificits de votre hbergeur.
1
1.1
Installation de Drupal
Installation rapide sous Windows
Si vous dsirez installer Drupal sous Linux, passez directement au chap. I 2 Installation rapide sous Linux.
La mthode dcrite dans ce livre pour linstallation de Drupal utilise le logiciel WampServer2 qui regroupe Apache, PHP, MySQL et phpMyAdmin. Si vous avez lhabitude dune autre solution WAMP (easyphp ou autre), ne la perdez pas ! Cela devrait galement fonctionner moyennant quelques modifications mineures.
1.1.1 Installation de WampServer

h h h
Sur le site web WampServer (http://www.wampserver.com/), allez dans la section Download Tlchargez et excutez le fichier .exe (version utilise pour ce livre : wampserver2.1c.exe) Il sera considr que Wampserver est install dans le rpertoire c:\wamp (rpertoire par dfaut)
Laissez-vous ensuite guider par linstallateur de Wampserver et choisissez les paramtres par dfaut en cas de doute.
1 - Installation de Drupal
13
h h
la fin de linstallation, une icne apparat dans la zone de notification ( cot de lheure) Passez WampServer en franais en faisant un clic droit sur licne Language french Sous Windows 7, vous pouvez faire en sorte que licne de WampServer saffiche en permanence en cliquant sur le lien Personnaliser de la zone de notification. Ensuite, choisissez loption Afficher licne et les notifications pour licne Aestan Tray Menu.
Lancez un navigateur internet et entrez ladresse locale : http://localhost . Vous devriez voir safficher la page daccueil WampServer
Wampserver fonctionne
1.2
Tlchargement et accs linstallateur de Drupal
Vous allez maintenant installer Drupal partir de ses fichiers sources. Il faut les tlcharger et les copier au bon endroit dans votre arborescence. h Rendez-vous la section Download & Extend (tlcharger) du site web Drupal (http://www.drupal.org/ download) et tlchargez la dernire version stable de Drupal (version utilise pour ce livre : Drupal 7.7)
Page de tlchargement de drupal.org
14
I - Dmarrage rapide
Si vous ne pouvez pas dcompresser votre archive .tar.gz, utilisez le logiciel libre 7zip : http://www.7-zip.org.
h
Dcompressez larchive Drupal dans le rpertoire www o vous avez install WampServer (par dfaut c:\wamp\www) Renommez le rpertoire cr en Drupal. Vous devriez obtenir larborescence suivante : c:\wamp\www\drupal Rendez-vous ladresse http://localhost/drupal. La page daccueil de linstallateur Drupal doit apparatre
Drupal est prt tre install !
Si vous avez des problmes de performances lors de linstallation ou de lutilisation de Drupal sous Windows, tentez lURL http://127.0.0.1/drupal au lieu de http://localhost/drupal
1.2.1 Installation de la langue franaise

La priorit est maintenant dinstaller Drupal en franais :
h h
Cliquez sur le bouton Save and continue pour passer la deuxime tape : Choose language Cliquez sur le lien Learn how to install Drupal in other languages "apprenez comment installer Drupal dans dautres langues"
Une page daide linstallation des traductions apparat alors. Elle dcrit 3 tapes : le tlchargement du fichier de traduction, le changement de nom du fichier et la copie du fichier.
h h
Cliquez sur le lien translation serveur de ltape 1 Cherchez la langue franaise et tlchargez le fichier qui correspond la version 7
15
Tlchargement de la langue franaise

h h
Enregistrez le fichier dans le rpertoire c:\wamp\www\drupal\profile\standard\translation Renommez le fichier en fr.po, vous devriez obtenir un fichier c:\wamp\www\drupal\profile\standard\translation\fr.po Cliquez sur le lien Reload the language selection page after adding translations "recharger la page de slection des langues aprs avoir ajout des traductions" de la page Choose language
Drupal est prt tre install... en francais !

h h
Choisissez loption French (Franais) Cliquez ensuite sur Save and continue pour passer ltape suivante
1.2.2 Installation de la base de donnes

Une base de donnes est un ensemble de donnes organises et ncessaires au fonctionnement dune application. Lorsque lapplication a besoin dexploiter sa base, elle interroge alors le gestionnaire de base de donnes (ici, vous utiliserez MySQL) qui lui-mme effectuera les actions utiles dans la base (ajout, modification, suppression de donnes, etc.). Ce programme est optimis pour manipuler efficacement de grandes quantits de donnes.
16
I - Dmarrage rapide
Vous allez utiliser phpMyAdmin pour crer et configurer la base de donnes de Drupal.
h
Lancez un autre navigateur internet (ou un nouvel onglet) et entrez ladresse locale : http://localhost/phpmyadmin (ou cliquez sur le raccourci depuis licne WampServer). Depuis licne WampServer, vous avez un accs rapide vers les adresses http://localhost et http://localhost/phpmyadmin.
Les raccourcis de WampServer
Vous devriez alors voir apparatre la page daccueil de phpMyAdmin que WampServer a install :
h
En dessous de la ligne Crer une base de donnes, entrez le nom de la base, par exemple drupal
Cration de la base de donnes MySQL pour Drupal grce phpMyAdmin
17
Cliquez ensuite sur le bouton Crer Votre base est vide, cest linstallateur Drupal qui va crer ses tables et les remplir avec ses donnes durant linstallation.
Il faut indiquer linstallateur Drupal le nom de la base que vous venez de crer et comment sy connecter. Par dfaut, WampServer ne protge pas MySQL et il est possible de sy connecter sans mot de passe avec lutilisateur root. Vous verrez comment protger une base de donnes au chap. III 1.3 Configuration de MySQL. Retournez sur linstallateur Drupal et compltez les champs suivants :
h h h
Nom de la base de donnes : drupal Nom dutilisateur : root Mot de passe : vide
Installation de la base de donnes par linstallateur Drupal

h
Cliquez sur le bouton Enregistrer et continuer. Drupal sinstalle avec tous ses modules par dfaut, ce processus tant assez long, le serveur web (Apache) peut linterrompre. Dans ce cas, rechargez la page (touche F5), le processus reprendra l o il sest arrt.
1.2.3 Configuration du site

Une fois le linstallation termine,il faut entrer les paramtres du site et de son administrateur.
18
I - Dmarrage rapide
Compltez les champs de la manire suivante :

h h h h h h
Nom du site : vos toques ! Adresse de courriel du site : contact@monadresse.com (entrez une adresse valide) Nom dutilisateur : admin Adresse de courriel : contact@monadresse.com (entrez une adresse valide) Mot de passe : Entrez ici votre mot de passe pour ce livre, le mot de passe utilis sera atelierdrupal. Pays par dfaut : France (ou votre pays)
Paramtres du site et de son administrateur

h h
Cliquez sur Enregistrer et continuer Cliquez sur le lien Visitez votre nouveau site
Linstallation de Drupal sous Windows est termine !
19
Le chapitre suivant explique comment installer Drupal sous Linux, si vous dsirez utiliser Drupal uniquement sous Windows, rendez-vous directement au chap. I 2 la dcouverte de Drupal.
1.3
Installation rapide sous Linux
Linstallation dune solution LAMP (Linux, Apache, MySQL, Php) sous Linux est toujours trs bien documente quelque soit la distribution utilise. Dans ce livre, la distribution grand public Ubuntu a t choisie car elle est la plus utilise ce jour.
1.3.1 Installation dune solution LAMP

Pour installer les quatre logiciels dont vous avez besoin, tapez la ligne de commande suivante dans un terminal (avec Ubuntu : Applications Accessoires Terminal) :
sudo apt-get install apache2 apache2-doc mysql-server php5 libapache2-modphp5 php5-mysql phpmyadmin php5-gd
Le package phpmyadmin ne fait pas partie de la solution LAMP mais il est install pour faciliter la gestion de la base de donnes
h
Il vous sera demand durant linstallation un mot de passe pour MySQL (atelierdrupal)
Configuration de MySQL
h h
Confirmez nouveau le mot de passe la question Serveur web reconfigurer automatiquement, choisissez apache2 en appuyant sur la barre despace
20
I - Dmarrage rapide
Configuration de phpMyAdmin
h h
Linstallateur pose quelques autres questions, rpondez avec les options par dfaut en cas de doute la fin de linstallation, pour vrifier si votre serveur web fonctionne, lancez un navigateur internet et entrez ladresse locale : http://localhost . Vous devriez voir apparatre la page daccueil apache Vrifiez si phpMyadmin fonctionne en entrant ladresse : http://localhost/phpmyadmin. Vous devriez voir apparatre la page daccueil phpMyAdmin
Votre solution LAMP est installe, phpMyAdmin fonctionne
21
1.3.2 Tlchargement et accs linstallateur de Drupal

Vous allez maintenant installer Drupal partir de ses fichiers source. Il faut donc les tlcharger et les copier au bon endroit dans votre arborescence de fichiers. Il est prfrable dinstaller Drupal dans votre rpertoire personnel (/home/utilisateur) pour faciliter ldition et lajout de fichiers. Toutefois, sachez quil est possible de linstaller dans un autre rpertoire (classiquement /var/www).
h
Rendez-vous la section Download & Extend (tlcharger) du site web Drupal (http://www.drupal.org/download) et tlchargez la dernire version stable de Drupal (version utilise pour ce livre : Drupal 7.7)
Page daccueil de drupal.org

h h
Dcompressez votre archive dans votre rpertoire personnel Renommez ce rpertoire en drupal
Vous devriez obtenir une arborescence du type /home/utilisateur/drupal. Crez maintenant un lien symbolique entre le rpertoire dApache et votre rpertoire drupal
cd /var/www sudo ln -s /home/utilisateur/drupal
22
I - Dmarrage rapide
La commande ln -s permet de crer un lien symbolique entre le rpertoire /var/www et le rpertoire drupal de votre rpertoire personnel. Cela est trs pratique car vous pourrez alors modifier facilement les fichiers de Drupal sans entrer le mot de passe super utilisateur. Toutefois, sachez que cela peut nuire aux performances de votre systme car il doit, chaque requte, rsoudre ce lien. Lancez un navigateur internet et entrez ladresse locale : http://localhost/drupal. Vous devriez voir apparatre la page daccueil de Drupal.
Drupal est prt tre install
1.3.3 Installation de la langue franaise

La priorit est maintenant dinstaller Drupal en franais :
h h
Cliquez sur le bouton Save and continue pour passer la deuxime tape : Choose language Cliquez sur le lien Learn how to install Drupal in other languages "Apprenez comment installer Drupal dans dautres langues"
Une page daide linstallation des traductions apparat alors. Elle dcrit 3 tapes, le tlchargement du fichier de traduction, le changement de nom du fichier et la copie du fichier.
h h
Cliquez sur le lien translation serveur de ltape 1 Allez jusqu la langue franaise et tlchargez le fichier qui correspond la version 7
Tlchargement de la langue franaise
23
h h
Enregistrez le fichier dans le rpertoire /home/utilisateur/drupal/profile/standard/translation Renommez le fichier en fr.po, vous devriez obtenir un fichier /home/utilisateur/drupal/profile/standard/translation/fr.po Cliquez sur le lien Reload the language selection page after adding translations "Recharger la page de selection des langues aprs avoir ajout des traductions" de la page Choose language
Drupal est prt tre install... en francais !

h h
Choisissez loption French (Franais) Cliquez ensuite sur Save and continue pour passer ltape suivante
1.3.4 Vrification des pr-requis

Un message apparat alors, signalant plusieurs erreurs.
Drupal demande des droits en criture
24
I - Dmarrage rapide
Le fichier /sites/default/settings.php nexiste pas et linstallateur Drupal doit avoir les droits en criture sur le rpertoire /home/utilisateur/sites/default. Commande pour la cration du fichier settings.php partir de default.settings.php :
cp /var/www/drupal/sites/default/default.settings.php /var/www/drupal/sites/ default/settings.php
Durant linstallation, Drupal doit avoir accs au rpertoire /sites/default, vous pourrez supprimer ce droit la fin de linstallation. Commande pour donner les droits daccs en criture sur le rpertoire /sites/default
sudo chmod -R a+w /var/www/drupal/sites/default
Vous pouvez utiliser linterface graphique du gestionnaire de fichier de Gnome (Nautilus) pour effectuer ces actions.
h
Cliquez sur le lien poursuivez linstallation pour faire disparatre le message
1.3.5 Installation de la base de donnes

Une base de donnes est un ensemble de donnes organises et ncessaires au fonctionnement dune application. Lorsque lapplication a besoin dexploiter sa base, elle interroge alors le gestionnaire de base de donnes (ici, vous utiliserez MySQL) qui lui-mme effectuera les actions utiles dans la base (ajout, modification, suppression de donnes, etc.). Ce programme est optimis pour utiliser efficacement de grandes quantits de donnes. Vous allez utiliser phpMyAdmin pour crer et configurer la base de donnes de Drupal.
h
Lancez un autre navigateur internet (ou un nouvel onglet) et entrez ladresse locale : http://localhost/phpmyadmin Connectez vous avec le login root / atelierdrupal (si vous avez suivi ce livre). Cest le mot de passe que vous avez entr linstallation de LAMP. En dessous de la ligne Crer une base de donnes, entrez le nom de la base, par exemple drupal
Vous devriez alors voir apparatre la page de connexion de phpMyAdmin :

h
Cration de la base de donnes MySQL pour Drupal grce phpMyAdmin
25
Cliquez ensuite sur le bouton Crer Votre base est vide, cest linstallateur Drupal qui va crer ses tables et les remplir avec ses donnes durant linstallation.
Il faut indiquer linstallateur Drupal le nom de la base que vous venez de crer et comment sy connecter. Retournez maintenant sur linstallateur Drupal et compltez les champs suivants :
h h h
Nom de la base de donnes : drupal Nom dutilisateur : root Mot de passe : atelierdrupal (si vous avez suivi ce livre)
Installation de la base de donnes par linstallateur Drupal

h
Cliquez sur le bouton Enregistrer et continuer Drupal sinstalle avec tous ses modules par dfaut, ce processus tant assez long, le serveur web (Apache) peut linterrompre. Dans ce cas, rechargez la page (touche F5), le processus reprendra l o il sest arrt.
la fin de linstallation un message saffiche en haut de la page :
Restaurer les accs aux fichiers
Commande pour supprimer les droits daccs en criture sur le repertoire ./sites/default/
sudo chmod -R a-w /var/www/drupal/sites/default/
Commande pour restaurer les droits daccs en criture sur le repertoire ./sites/default/files
sudo chmod -R a-w /var/www/drupal/sites/default/files
26
I - Dmarrage rapide
Vous pouvez recharger la page pour vrifier si le message a disparu.
Drupal doit avoir les droits daccs en criture sur /sites/default/files car cest ici quil stockera les fichiers relatifs aux contenus (images, fichiers PDF, etc.)
1.3.6 Configuration du site

Une fois le processus dinstallation termin, il faut entrer les paramtres du site et de son administrateur. Compltez les champs de la manire suivante :
h h h h h h
Nom du site : vos toques ! Adresse de courriel du site : contact@monadresse.com (entrez une adresse valide) Nom dutilisateur : admin Adresse de courriel : contact@monadresse.com (entrez une adresse valide) Mot de passe : Entrez ici votre mot de passe pour ce livre le mot de passe utilis sera atelierdrupal Pays par dfaut : France (ou votre pays)
Paramtres du site et de son administrateur
2 - la dcouverte de Drupal
27
h h
Cliquez sur Enregistrer et continuer Cliquez sur le lien Visitez votre nouveau site
Linstallation de Drupal sous Linux est termine !
la dcouverte de Drupal
Vous avez install un systme, un serveur web supportant php, un logiciel de base de donnes et Drupal. Vous pouvez donc partir la dcouverte du logiciel en y ajoutant du contenu, en modifiant son interface, en installant des modules qui ajoutent des fonctionnalits et bien dautres choses encore...
2.1
Le contenu
2.1.1 Ajout dun premier article

Drupal est un CMS : Content Management System "Systme de gestion de contenu". Vous allez donc commencer par y entrer du contenu. Drupal vous y encourage dailleurs fortement puisque sur cette premire page, pas moins de 3 raccourcis vous permettent de le faire.
h
Cliquez sur lun des liens permettant dAjouter du contenu
28
I - Dmarrage rapide
Ajout dun type de contenu
Lorsquun calque de ce type apparat, vous entrez dans la partie administration du systme. Par dfaut, les visiteurs anonymes de votre site ne devraient pas voir ce type de page. Vous avez le choix entre deux types de contenu, Article et Page.
h h
Cliquez sur le lien Article Vous arrivez alors sur le formulaire dajout de contenu de Drupal, entrez ici une recette de cuisine Claude-Olivier Fribourg, le propritaire et auteur du site http://1001recettes.blogspot.com/, en plus davoir le talent de bien cuisiner et de prendre de jolies photos, a eu la gentillesse de me permettre dillustrer ce livre en reprenant une partie de son blog.
Vous pouvez reprendre la recette Salade de penne au thon rouge disponible la section Plat principal (http://1001recettes.blogspot.com/2006/07/salade-de-penne.html)
Le site 1001 Recettes
29
h h
Titre : Salade de penne Tags : Plat principal, Ptes Les tags sont des mots cls qui caractrisent un article et sur lesquels il sera ensuite possible de faire des recherches.
h h
Corps : copiez le corps de la recette Image : enregistrez une image sur votre disque (clic droit sur limage puis Enregistrer sous) puis cliquez sur le bouton Parcourir pour pointer vers elle Vous pouvez agrandir les photos du site 1001 Recettes en cliquant sur limage.
Tlchargement dune image dans un article

h h
Cliquez ensuite sur le bouton Transfert de fichiers Enfin, cliquez sur le bouton Enregistrer tout en bas de la page
Drupal vous redirige alors vers votre article mis en forme.
30
I - Dmarrage rapide
Votre premier article mis en page par Drupal.
2.1.2 Le deuxime article avec rsum

Entrez donc une deuxime recette pour enrichir le contenu. Pour ce livre il a t choisi le Risotto la bire blanche et Stilton et tranches de melon poles (section Plat principal http://1001recettes.blogspot. com/2010/09/un-risotto-sucre-sale.html).
h h
Titre : Risotto la bire blanche et Stilton et tranches de melon poles Tags : Plat principal, Riz Remarquez lauto-compltion des tags lorsque vous entrez la lettre 'P', Drupal vous propose la liste des tags qui commencent par cette lettre (voir illustration suivante)
Cliquez sur le lien Modifier le rsum cot du corps
Le champ corps se spare alors en deux parties, vous dcouvrirez la fin de ce chapitre lintrt de crer un rsum.
h h
Rsum : copiez lintroduction de la recette dans le rsum Corps : copiez la recette elle-mme dans le corps
31
Ajout dun tag existant et dun rsum

h h
Image : ajouter une image comme pour le prcdent article Cliquez sur le bouton Enregistrer tout en bas de la page
Votre site contient maintenant deux articles.
2.1.3 Ajout de commentaires

Par dfaut, il est possible dajouter des commentaires aux articles, vous allez maintenant en ajouter deux pour la recette du Risotto. Descendez en bas de la page la section Ajouter un commentaire.
h h h
Sujet : Bonne ide Commentaire : De mouiller le riz avec la bire Cliquez sur Enregistrer
Formulaire dajout de commentaire
32
I - Dmarrage rapide
Notez que le sujet du commentaire nest pas obligatoire.

h
Ajoutez un deuxime commentaire la recette
Les commentaires de larticle mis en forme
2.1.4 Navigation entre les articles

h
Cliquez sur le titre du site ( vos toques) pour retourner sur sa page daccueil (http://localhost/drupal/)
Cette page a chang : elle contient maintenant la liste des articles en commenant par le plus rcent la manire dun blog.
La nouvelle page daccueil du site
33
Remarquez galement que : lorsquun rsum existe pour un article, seul ce rsum est affich (cas du Risotto) ; les images sont plus petites que dans les articles ; il existe un lien Read more permettant daccder larticle complet ; les tags sont affichs sous forme de lien.
h
Cliquez sur le tag Plat principal de la premire recette Cliquez sur le lien Riz
Saffiche alors la liste de tous les articles ayant dans sa liste de tags Plat principal .
h
Saffiche alors la liste de tous les articles ayant dans sa liste de tags Riz , les tags permettent donc de classer le contenu.
2.1.5 Modifier un article

Vous allez maintenant modifier le premier article pour y crer un rsum. Plusieurs mthodes permettent de modifier les articles : un menu contextuel est disponible en haut droite de chaque article sur les pages de listes (Accueil ou Tags), permettant de Modifier ou Supprimer larticle ;
Menu contextuel dans les listes.
sur la page de consultation dun article, un onglet Modifier permet daccder aux mmes fonctionnalits.
34
I - Dmarrage rapide
Onglet Modifier dun article

h h h
Modifiez larticle en utilisant lune ou lautre des mthodes Cliquez sur le lien Modifier le rsum Mettez un rsum la recette
Modification de larticle
h
Cliquez sur Enregistrer
2.2
Les menus
2.2.1 Ajout dun menu

Vos deux recettes sont accessibles depuis la page daccueil, vous allez crer des menus dans len-tte, cot de longlet Home, pour les rendre plus visibles.
h h
ditez nouveau la recette des Penne Placez-vous en bas de la page
35
Vrifiez que longlet horizontal Paramtres du menu est bien slectionn Lensemble de ces onglets horizontaux seront dtaills au chapitre chap. II 3.1.1. Options des nodes de ce livre
h h
Cochez la case Fournit un lien de menu Remplissez les champs comme dans lillustration suivante
Paramtres du menu dun article

h
Cliquez sur Enregistrer
Le nouvel onglet de menu avec sa description

h
De la mme manire, ajoutez un menu pour la recette de Risotto. Limitez le titre Risotto la bire blanche
36
I - Dmarrage rapide
Les deux menus ajouts
2.2.2 Organisation des menus

Voici les deux entres de menus crs. Imaginez maintenant que vous vouliez passer la Salade de penne devant le Risotto.
h h
En haut de la page, dans le menu dadministration, cliquez sur Structure
Puis sur le lien Menu Drupal cr par dfaut quatre menus, mais vous avez ajout les recettes au menu Menu principal.
h h
Cliquez sur le lien lister les liens du Menu principal Cliquez sur le symbole Risotto de la Salade de penne et remontez-le par glisser/dposer au-dessus du
Page dorganisation des menus

h
Cliquez sur Enregistrer la configuration et observez le rsultat : lordre des menus a chang. Vous pourrez retrouver une explication plus approfondie des menus au chap. II 2 Menu : les menus de ce livre.
37
2.2.3 Exercice : ajout dun contenu

Ajoutez une nouvelle recette (allez faire un tour dans la catgorie Vite fait bien fait Recette Croque Hawai du site 1001 recettes) et crez son menu Supprimez le premier menu Accueil du Menu Principal
La recette du croque Hawa, son menu et le menu Accueil supprim
Corrig
h h h h h h h h h
Menu Contenu Lien + Ajouter du contenu Lien Article Titre : Croque-Hawa et petite salade Tags : Entre Cliquez sur le lien Modifier le rsum cot du corps si vous voulez crer un rsum Rsum : copiez lintroduction de la recette dans le rsum Corps : copiez la recette elle-mme dans le corps Image : ajouter une image Cocher la case Fournit un lien de menu Titre du lien dans le menu : Croque-Hawa lment parent : <Menu principal> Cliquez sur le bouton Enregistrer tout en bas de la page Menu Structure lien Menu Lien lister les liens du menu Menu principal Lien supprimer du lien Accueil Placer le Croque-Hawai en troisime dans la liste Bouton Enregistrer la configuration
Pour le menu :
h h h h
Pour rorganiser le menu :

h h h h h
38
I - Dmarrage rapide
2.3
Les blocs
Les blocs sont des botes que vous pouvez cacher ou faire apparatre l o vous le dsirez sur votre page de Drupal. Peut-tre avez-vous dj remarqu le bloc de recherche dans la barre de gauche de Drupal.
2.3.1 Ajouter un bloc

Vous pouvez ajouter un bloc qui permet de lister les derniers commentaires ajouts votre site.
h h h
Cliquez sur le menu Structure Puis sur le lien Blocs Dans la section Dsactiv (en bas de la page), choisissez la rgion Premire barre latrale pour le bloc Commentaires rcents
Page dadministration des blocs

h
Cliquez sur Enregistrer les blocs
Vous voyez alors apparatre le bloc Commentaires rcents sur la partie gauche de la page.
Le bloc Commentaires rcents dans la rgion Sidebar First
Comme pour les menus, loutil une rgion donne.
vous permet de rorganiser les blocs dans lordre que vous dsirez sur
39
2.3.2 Les rgions

En plaant le bloc Commentaires rcents, vous pouviez choisir lemplacement du bloc dans une liste droulante. Cette liste est la liste de toutes les rgions du thme utilis pour la consultation du site (Bartik).
h h
Retournez sur la page dadministration des blocs, menu Structure lien Blocs En haut de la page, cliquez sur le lien Aperu des rgions des blocs (Bartik)
Une page type du thme utilis (Bartik) saffiche, ainsi que le nom de toutes ses rgions, sur fond jaune.
Les rgions du thme Bartik
Vous allez dplacer le bloc de recherche, actuellement dans la rgion Premire barre latrale, dans la rgion En-tte (Header).
h h
Cliquez sur le lien Exit block region demonstration la section Premire barre latrale, modifiez la rgion En-tte pour le bloc du Formulaire de recherche Cliquez sur Enregistrer les blocs
40
I - Dmarrage rapide
Le bloc de recherche positionn dans la rgion Header
2.3.3 Exercice
Supprimez le message Propuls par Drupal qui saffiche en bas de la page.
Message supprimer
Corrig :
h h h
Menu Structure lien Blocs Pour le bloc Propuls par Drupal de la rgion Pied de page, choisir Aucun Bouton Enregistrer les blocs
2.4
Gestion des permissions
Aprs une installation simple de Drupal, deux utilisateurs sont crs : lAdministrateur, qui a tous les droits et lutilisateur Anonyme, qui a des droits restreints. Vous pourrez constater quil est possible dautoriser ou dinterdire des actions des diffrents modules de Drupal selon le profil de lutilisateur. Dans cet exemple vous allez permettre aux utilisateurs anonymes de poster des commentaires.
h
Cliquez sur Se dconnecter en haut de page Rendez-vous sur la page du Risotto, au niveau des commentaires
En vous dconnectant, vous tes considr comme utilisateur anonyme par Drupal.
h
Vous pouvez lire les commentaires de larticle mais il nest pas possible den ajouter car le formulaire napparat pas : lutilisateur anonyme ne possde pas les droits pour accder cette fonctionnalit. Vous allez modifier les droits daccs pour que les utilisateurs anonymes puissent poster un commentaire.
h
Reconnectez vous en administrateur avec le login/mot de passe admin/atelierdrupal en utilisant le bloc Connexion utilisateur
41
Le bloc de connexion utilisateur

h h
Menu Personnes Onglet Droits Rendez-vous la section du module Comment Dans la colonne utilisateur anonyme, cochez Post comment qui autorise lenvoi de commentaires Cochez galement Skip comment approval qui permet aux commentaires dtre publis sans tre modrs par les administrateurs
Chaque module possde une section qui dfinit un certain nombre de droits.
h h h
La gestion des droits sur le module Comment

h h h
Cliquez sur Enregistrer les droits daccs Cliquez nouveau sur Se dconnecter dans le bloc admin Essayez de poster un nouveau commentaire
42
I - Dmarrage rapide
Il est maintenant possible de poster des commentaires en tant quanonyme.
Pour la suite de ce livre, reconnectez-vous en admin/atelierdrupal.
2.5
Les modules
2.5.1 Activer un module

Les modules sont des briques de programme qui permettent dtendre les fonctionnalits de Drupal. Vous allez en activer un qui permet de raliser des sondages. Vous crerez ensuite un sondage qui permettra vos visiteurs de voter pour leur recette favorite.
h h
Menu Modules Cochez la case activ du module Poll (Sondage)
Page dadministration des modules

h
Cliquez sur Enregistrer la configuration Cliquez sur Contenu Puis sur le lien + Ajouter un contenu
Il sagit maintenant de crer un sondage :

h h
43
En activant le module Poll, vous avez accs un nouveau type de contenu Sondage en plus des types Article et Page de base.
h
Cliquez sur le lien Sondage et crez un nouveau sondage comme sur lillustration suivante
Ajout dun Sondage

h
Ajoutez ce sondage une entre dans le menu principal, comme pour les articles, dans longlet Paramtres du menu Cliquez sur Enregistrer
Vous pouvez tester votre sondage !
Votre sondage fonctionne !!!
Un module peut tendre les fonctionnalits de Drupal de beaucoup de faons diffrentes. Ici, en activant le module Poll (Sondage), vous avez accs un nouveau type de contenu, et, si vous retournez sur la page dadministration des blocs, vous verrez quun nouveau bloc Sondage le plus rcent est disponible.
44
I - Dmarrage rapide
2.5.2 Installation dun module externe

Les modules les plus utiles sont installs par dfaut avec Drupal. Mais un trs grand nombre de modules sont tlchargeables sur le site officiel de Drupal (plus de 1000 pour la version 7.x). Une des grandes forces de Drupal rside dans le fait quil est facile, pour les personnes connaissant le Php, de dvelopper de nouveaux modules. Vous allez par exemple tlcharger et installer le module Weather qui vous permettra dafficher sous forme de bloc la mto en temps rel dun aroport donn partir de son METAR. Le module Weather na quun rapport lointain avec un site de recette. Mais il a lavantage de ne pas tre difficile installer et configurer. Ce module sera dsactiv la fin de ce chapitre.
Tlchargement et installation du module

Chaque module possde sa propre page sur le site Drupal.org. Il faut localiser cette page pour installer ensuite le module.
h h h
Rendez-vous sur le site http://www.drupal.org Dans la zone de recherche, entrez weather Slectionnez loption Modules
Recherche dun module par son nom sur drupal.org

h
Cliquez sur le bouton Search Choisissez le module Weather (http://www.drupal.org/project/weather) Descendez la section Downloads de la page Reprez la version qui convient Drupal 7 (7.x-1.0 au moment de la rdaction de ce livre), faites un clic droit sur le lien tar.gz et choisissez loption Copier ladresse du lien (avec le navigateur Firefox).
La liste de tous les modules contenant le mot Weather saffiche alors.

h h
Drupal peut installer un module automatiquement partir de lurl de son archive.

h
45
Copie de lurl de larchive du module

h h h
Menu Modules Lien + Installer un nouveau module Coller lurl prcdemment copie dans la zone Installer depuis une URL
Installation dun module depuis lURL de larchive

h
Cliquez sur le bouton Installer
Drupal soccupe alors de tlcharger larchive et de lextraire au bon endroit. Il vous reste activer le module. Si linstallation automatique ne fonctionne pas, des mthodes alternatives sont dcrites au chap. 1.3.3 Mthodes dinstallation dun module
h h
Lien Enable newly added modules "Activer les modules nouvellement installs" Allez tout en bas de la page jusquau module Weather, et cochez la case Activ Les modules sont tris par catgories. Vous pouvez donc replier la catgorie Coeur qui regroupe lensemble des modules installs par dfaut dans Drupal pour faciliter la recherche dans la page.
46
I - Dmarrage rapide
Le module Weather est maintenant prt tre utilis

h
Bouton Enregistrer la configuration
Configuration du module
Lorsque le module est activ, un lien Configurer apparat. Il permet daccder directement la page de configuration du module.
h
Cliquez sur le lien Configurer du module Weather
Le module Weather peut afficher deux types de bloc, un bloc mto li la localisation de lutilisateur du site ou un bloc mto li au site lui-mme. Pour simplifier la configuration de ce premier module, vous vous limiterez afficher uniquement le deuxime bloc.
h h h
Cliquez sur le lien + Units daffichage pour ajouter un affichage Les options par dfaut de cette page conviennent Bouton Enregistrer
Un nouvel affichage systme doit apparatre dans la liste

h h
Cliquez sur le lien Add location to this display "Ajouter un endroit pour cet affichage" Choisissez le pays et la ville
47
Slection dun aroport

h h
Bouton Enregistrer Bouton Enregistrer la configuration Menu Structure lien Blocs Pour le bloc Mto : Systme, choisir la rgion Premire barre latrale
Le bloc a t cr, il sagit maintenant de lafficher dans une rgion.

h h
Les blocs du module Weather

h h
Bouton Enregistrer les blocs Retournez sur la page daccueil
Le bloc Weather en action !
48
I - Dmarrage rapide
2.5.3 Exercice : Installation, configuration et utilisation de BMI

h
BMI est un module qui propose un bloc permettant de calculer son IMC (Indice de Masse Corporelle). Il sagit donc pour vous de trouver le module, de linstaller, de lactiver et dafficher le bloc en Premire barre latrale
Le bloc du module BMI

h
Ensuite, pour plus de clart pour la suite de ce livre, dsactivez les modules Weather et BMI
Corrig :
Recherche, installation et activation du module
h
La page de tlchargement du module est : http://drupal.org/project/bmi (version 7.x-1.0-rc1 au moment de la rdaction de ce livre) Copiez lurl (http://ftp.drupal.org/files/projects/bmi-7.x-1.0-rc1.tar.gz) Dans Drupal, menu Modules Lien + Installer un nouveau module Collez lurl prcdemment copie Bouton Installer Lien Enable newly added modules "Activer les modules nouvellement installs" Pour le module BMI, cochez la case ACTIVE. Bouton Enregistrer la configuration Menu Structure lien Blocs
h h h h h h h h
Configuration et utilisation
h
49
h h
Pour le bloc Body Mass Index, choisir la rgion Premire barre latrale Bouton Enregistrer les blocs
Le bloc Body Mass Index doit safficher sur la page daccueil. Dsactivation des modules
h h h
Menu Modules Pour les modules BMI et Weather, dcochez la case ACTIVE. Bouton Enregistrer la configuration
Les blocs ne devraient plus apparatre en page daccueil.
2.6
Modification des thmes de Drupal
Un thme dans Drupal est un ensemble de fichiers qui constitue lapparence graphique de votre site. Vous aurez peut-tre envie de personnaliser laspect de Drupal. Cela est tout fait possible, mais, suivant votre niveau dexigence, ce peut tre une tche trs simple raliser ou trs complique. La cration et la modification des thmes sont abords dans le Chap. V Modifier lapparence de votre site de ce livre. Ici, le but est davoir un aperu des possibilits de Drupal. Vous allez donc dabord personnaliser le thme par dfaut (Bartik) grce linterface de Drupal, puis, vous installerez, la manire dun module, un thme depuis internet.
2.6.1 Page de slection des thmes

Linterface dadministration de Drupal permet de modifier quelques paramtres du thme.
h
Menu Apparence
50
I - Dmarrage rapide
Page de configuration des thmes
deux thmes sont actifs, Bartik et Seven ; le thme par dfaut est Bartik, cest le thme qui sert afficher le contenu du site ; le thme Seven est utilis pour les actions dadministration ; il existe deux autres thmes installs (Garland et Stark) mais ils ne sont pas activs.
51
2.6.2 Installation dun thme externe

Comme pour les modules, un grand nombre de contributeurs proposent des thmes qui sont disponibles sur le site http://www.drupal.org.
h h h
Rendez-vous sur le site http://www.drupal.org Dans la zone de recherche, entrez Danland Slectionnez loption Themes
Recherche dun thme par son nom sur drupal.org

h h h
Cliquez sur le bouton Search Choisissez le thme danland (http://www.drupal.org/project/danland) Descendez la section Downloads de la page Reprez la version qui convient Drupal 7 (7.x-1.0-rc2 au moment de la rdaction de ce livre), faites un clic droit sur le lien tar.gz et choisissez loption Copier ladresse du lien Menu Apparence Lien + Installer un nouveau thme Coller lurl prcdemment dans la zone Installer depuis une URL Cliquez sur le bouton Installer
Les modules et les thmes sinstallent de la mme faon :

h
h h h h
Comme pour les modules, Drupal soccupe alors de tlcharger larchive et de lextraire lendroit o il faut. Il vous reste activer le thme.
h
Lien Enable newly added themes "Activer les thmes nouvellement installs"
Allez tout en bas la section des thmes dsactivs. Deux thmes ont t ajouts, Danland et Danblog.
52
I - Dmarrage rapide
Les deux thmes de Danland

h
Cliquez sur le lien Activer et choisir par dfaut du thme Danblog Le thme Danblog est une version simplifi du thme Danland, il ne contient pas le diaporama de page de garde. Ce diaporama tant configurable uniquement manuellement (en ditant des fichiers), vous utiliserez dans cette prise en main uniquement Danblog.
h h
Retournez sur la page daccueil Le thme qui affiche le contenu de votre site a chang
Dcouvrez le thme Danblog !
Activez le thme Bartik par dfaut pour la suite de ce livre.
53
1 - Administrer Drupal par linterface
55
Chapitre
II
Utiliser Drupal
ous avez dcouvert un grand nombre de fonctionnalits de Drupal dans le premier chapitre. Le but de celui-ci est dapprofondir ces dcouvertes. Tout dabord vous apprendrez comment surveiller votre installation et grer les modules en lisant le chap. II 1. Administrer Drupal par l'interface.
Utiliser Drupal
Au chap. II 2. Organiser son site, vous apprendrez organiser le contenu afin que votre site garde une cohrence lorsquil prendra de limportance. Vous dcouvrirez galement comment grer les utilisateurs Cest en installant des modules tiers au chap. II 3. Ajout de contenu que vous pourrez proposer une interface riche vos utilisateurs pour quils puissent ajouter facilement du contenu au site. Enfin, cest au chap. II 4. Field UI : types de contenus personnaliss que vous configurerez Drupal pour quil sadapte votre contenu.
1
1.1
Administrer Drupal par linterface

Toolbar : les menus de votre site
Toolbar est un module du coeur de Drupal qui affiche une barre en haut de chaque page Drupal pour administrer le site.
Le menu affich par Toolbar
56
II - Utiliser Drupal
Cette barre liste les lments de haut niveau pour ladministration du site et propose des raccourcis pour l'administration : Icne maison Tableau de bord Contenu Structure Apparence Personnes Modules Configuration Rapports Aide Bonjour admin Se dconnecter Raccourci vers la page daccueil du site. Lien vers une page daccueil personnalisable pour ladministrateur. Pages dadministration pour rechercher, crer, modifier et supprimer les contenus et les commentaires. Pages dadministration pour structurer les informations du site (blocs, menus, types de contenu). Pages permettant de grer les thmes. Pages permettant de grer les utilisateurs et leurs droits. Permet lajout, la modification ou la suppression de modules. Il peut-tre galement un bon endroit pour trouver la page de configuration dun module nouvellement install. Pages de configuration de lensemble des modules et du site lui-mme. Pages dinformations sur ltat de sant du site et de son activit. Pages daide des modules. Accder la page de lutilisateur connect. Dconnexion de lutilisateur en cours.
1.2
h h
Page de configuration du site
Rendez vous sur la page de configuration du site. Menu Configuration Section Systme lien Informations Vous pouvez changer ici les paramtres principaux du site : Nom du site Slogan Nom du site qui apparat dans len-tte. Saffiche cot du nom du site en fonction des paramtres du thme. Adresse mail de ladministrateur du site. Cette adresse est aussi celle qui sera utilise pour lenvoi des mails, Adresse de courriel par exemple lorsquun nouvel utilisateur est cr. Nombre de contributions Nombre de rsums afficher au maximum sur la page daccueil. Au del de cette limite, une pagination sera sur la page daccueil cre. Entrez ici le chemin de la page daccueil de votre site, soit avec une URL simplifie, soit avec une URL comPage de garde par dfaut plte. Pages derreur Permet de personnaliser les pages de redirection en cas daccs refus ou de page non trouve
Position du nom du site et du slogan sur Bartik
57
Noubliez pas que cette page existe. Malgr sa simplicit, elle rgle des paramtres que vous modifierez forcment un jour.
1.3 Installation de modules (Captcha : vitez les robots malveillants)

Les modules sont des petits programmes qui permettent dajouter des fonctionnalits Drupal. Dans le chap. I 2.5 Les modules, vous avez dcouvert comment Drupal fonctionnait avec des modules : vous avez activ le module Poll et install les modules complmentaires Weather et BMI. Dans ce chapitre, vous installerez le module Captcha et tudierez plus en profondeur son processus dinstallation.
1.3.1 Quest quun Captcha ?

Dans le chap. I 2.4 Gestion des permissions, vous avez autoris les anonymes poster des commentaires. Cela peut tre une mauvaise ide car des robots malveillants peuvent poster un grand nombre de commentaires pour mettre votre site en difficult. Pour cela, les sites affichent des Captcha que thoriquement seul les humains peuvent rsoudre. Le module Drupal Captcha permet dinstaller cette fonctionnalit.
Le formulaire Captcha pour les anonymes
58
1.3.2 Recherche sur drupal.org

Comme il existe une trs grande quantit de modules pour Drupal, il est parfois fastidieux de savoir lequel est le plus adapt son besoin. Le site officiel drupal.org est d'une grande aide sur ce point et rpertorie la majorit des modules Drupal. Vous avez utilis loutil de recherche de drupal.org dans la premire partie, mais il existe dautres pages utiles la recherche.
La page Download & Extend

h h h
Allez sur le site http://www.drupal.org Menu du haut : Download & Extend Onglet Modules
Page daccueil des tlchargements pour Drupal
Cette page propose de lister lensemble des modules selon plusieurs critres : Modules Categories Filter by compatibility Search modules Sort By
h h
Affiche les modules par catgories. Attention, il appartient aux auteurs dinscrire leur modules dans une catgorie et ils ne le font pas toujours. Captcha devrait apparatre dans la catgorie Security. Affiche les modules compatibles avec votre version. Recherche partir du nom ou de la description du module. Critre de tri pour les rsultats. Le critre Most installed trie les modules selon leur popularit.
Faites une recherche sur le module Captcha (vous pouvez vous inspirer de la capture prcdente) Allez sur la page du module (http://drupal.org/project/captcha)
59
Page dun module

Chaque module possde sa propre page sur drupal.org, voici les sections qui la composent : Description du module : un texte dcrit le module. Il est ventuellement accompagn dune copie dcran. Une liste de modules complmentaires est propose et ventuellement des liens vers de la documentation.
Informations et copie dcran du module
Downloads : En bas de page, la liste des versions disponibles est prsente. Ici, il existe des versions stables du module pour la version 6.x de Drupal et des versions de dveloppement pour les versions 6.x et 7.x. La dernire version disponible pour Drupal 7 est la 1.0-alpha2. Pour plus de renseignements sur les diffrentes versions du module, vous pouvez cliquer sur le lien View all releases. Safficheront alors les anciennes versions du module.
Les diffrentes versions du module
60
Zone droite de la page : dans cette zone, plusieurs blocs affichent des informations relatives aux modules. Maintainers for Captcha Issues for Captcha Recent issues Related projects Resources Development Liste des personnes ayant fait le plus de dveloppements pour le module. Les problmes rencontrs par le module. Utilisez ce formulaire pour savoir si le problme que vous avez ventuellement rencontr est dj signal ou corrig. Derniers problmes rencontrs avec le module. Autres modules en lien avec celui-ci. Liens vers les pages de documentation, les traductions et les ventuels sites de test. Section pour les dveloppeurs.
1.3.3 Mthodes dinstallation dun module

Il sagit maintenant dinstaller le module.
h h
Sur votre site Drupal, menu Modules Lien + Installer un nouveau module
Installation depuis une url

Cette mthode est la mme que celle utilise pour installer le module Weather.
Installation depuis une archive tlcharge

Ici, vous tlchargez dabord larchive du module puis, vous installez le fichier choisi. Cette mthode peut tre utilise si la prcdente ne fonctionne pas (problme au tlchargement).
Installation manuelle
Si aucune des mthodes prcdentes ne fonctionne, vous devez installer le module manuellement.
h
Tlchargez larchive du module Captcha sur votre disque dur (version utilise pour ce livre 7.x-1.0alpha2)
Vous avez alors le choix entre plusieurs rpertoires pour extraire le contenu de larchive : /sites/all/modules /sites/default/modules /sites/exemple.fr/modules Le module sera accessible depuis tous les sites prsents sous votre instance de Drupal. Le module ne sera disponible que sur le site par dfaut de Drupal. Le module ne sera disponible que sur le site exemple.fr.
61
Larborescence de Drupal : o dcompresser les sources des modules ?
Dans cette illustration : tous les sites ont accs aux modules captcha et weather (rpertoire all) ; seul le site par dfaut a accs au module bmi (rpertoire default) ; le site test.drupal.tld na pas accs au module bmi Ce nest pas parce quun module est accessible depuis tous les sites quil doit tre activ sur tous les sites.
Notez bien que chaque module possde son propre rpertoire. Najoutez jamais de module au rpertoire racine /modules de Drupal. Celui-ci nest utilis que pour les modules installs par dfaut dans Drupal. Cela pourrait poser problme lors de la mise jour de Drupal.
h
Extrayez le contenu de larchive Captcha dans le rpertoire /sites/all/modules
1.3.4 Activation et dpendances

Votre module est prsent copi au bon endroit dans larborescence de Drupal, il faut lactiver.
h h
Menu Modules Section SPAM CONTROL
62
Les deux modules de larchive Captcha
Une archive peut contenir plusieurs modules qui peuvent tre activs sparment selon les besoins. Certains modules peuvent ncessiter dautres modules pour fonctionner. Ces informations sur les dpendances des modules sont indiques sur cette page grce aux mentions Requiert et Requis par. Cest le cas de Image Captcha qui requiert Captcha.
h h
Cochez la case ACTIVE du module Captcha Bouton Enregistrer la configuration
1.4
h h
Page de configuration des modules
Aprs avoir activ un module, rechargez la page des modules pour savoir comment lutiliser. Menu Modules Section Spam control
Les liens vers les pages du module
Maintenant quil est activ, le module Captcha propose trois oprations sous forme de liens : Aide Droits daccs Configurer
h
Lien vers la page daide du module Lien vers la section permettant de grer les droits des utilisateurs sur le module Lien vers la page permettant de configurer le module
Cliquez sur le lien Configurer
63
Sur cette page, saffiche la liste des formulaires HTML (FORM_ID) prsents sur le site. Pour chaque formulaire, il est possible dassocier un Captcha de type Math grce une liste droulante. Par exemple, pour ajouter un Captcha sur le formulaire qui permet dajouter un commentaire un article :
h
Choisisssez le Captcha Math du formulaire comment_node_article_form
Choix d'un Captcha pour un formulaire

h
En bas de la page, bouton Enregistrer la configuration Lien Se dconnecter Choisissez un article
Voyez si le Captcha fonctionne :

h h
Le Captcha saffiche alors si vous tentez de rentrer un nouveau commentaire. Le formulaire de commentaire nest pas protg par un Captcha si vous tes connect en tant quadministrateur.
1.5
Dsactivation et dsinstallation
Pour dsactiver un module, il suffit de dcocher sa case ACTIVE sur la page de liste des modules. En faisant cela, vous dsactivez les fonctionnalits du module mais ses donnes resteront stockes dans la base de donnes.
h h
Menu Modules Dsactivez le module Captcha
Captcha cr deux tables lors de son activation. Lorsque vous le dsactivez, ces deux tables restent dans la base de donnes. Pour les supprimer automatiquement, une autre action est ncessaire :
h h
Onglet Dsinstaller Cochez CAPTCHA
64
Dsinstallation complte dun module

h
Bouton Dsinstaller
1.6
Le tableau de bord
Le tableau de bord vous informe sur ltat de sant et les performances de votre installation Drupal. Allez sur la page du tableau de bord :
h
Menu Rapports lien Tableau de bord dadministration
Une partie du tableau de bord o quelques problmes sont signals
65
Ce tableau dtaille la configuration de Drupal, signale les problmes et donne des recommandations : les mises jour disponibles du cur de Drupal ou des modules installs, les numros de versions des programmes Apache ou Php, les librairies, les droits daccs aux systmes de fichiers, etc. Dans lillustration prcdente : un problme critique est signal sur fond rouge , la bibliothque GD est ncessaire pour le fonctionnement de Drupal ; un problme qui mrite votre attention est signal sur fond jaune , ici des mises jour de modules sont conseilles ; une amlioration est signale sur fond bleu, ici il est possible dinstaller uploadprogress pour les tlversements (upload) de fichiers. Voici les sections principales du tableau de bord : Drupal Accs au fichier update.php Version de Drupal Normalement, ce fichier est protg. update.php est un script qui permet de mettre jour Drupal (chap. III 3.2 Update status : mettre jour de Drupal).
Effets de rotation et de dsaturation de la Numro de version de GD. GD est un ensemble de fonctionnalits qui permettent de manipubibliothque GD ler des images. Ce fichier (settings.php) doit tre protg car il contient des informations sensibles sur votre Fichier de configuration installation (mot de passe MySQL). Lorsque vous mettez jour Drupal ou des modules installs sur Drupal, il peut tre ncessaire Mise jour de la base de donnes de modifier la structure de votre base de donnes. Dans ce cas, un message apparatra ici (chap. III 3.2 Update status : mettre jour de Drupal). Notification des mises jour Indique si le module Update manager est activ ou non. PHP Version de PHP. Si vous cliquez sur le lien, la page phpinfo() saffiche. Plafond mmoire de PHP Mmoire alloue par le systme PHP (memory_limit : chap. III 1.2 Configuration de Php). Serveur web Nom et version du serveur web sur lequel Drupal est install. Statut de mise jour des modules et thmes Notifie si de nouvelles versions de vos modules et thmes externes existent. Systme de base de donnes Type de base de donnes et numro de version. Version du systme de base de donnes Systme de fichiers Indique si votre rpertoire sites/default/files est accessible en criture. Tches de maintenance cron Date de la dernire excution de Cron (chap. III 3.3 Le cron). Lors de lactivation de nouveaux modules, de nouvelles sections peuvent apparatre
Section du module Captcha du tableau de bord
66
1.7
Thme dadministration / Overlay
Comme vous lavez vu la fin de la partie prcdente, deux thmes sont activs par dfaut dans Drupal, le thme Bartik qui est le thme du visiteur et le thme Seven qui est le thme dadministration. Bien souvent, les pages dadministration saffichent sur un calque (Overlay)
Thme Seven en calque et thme Bartik en arrire plan
Parfois le systme de calque peut poser des problmes, vous pouvez supprimer celui-ci en dsactivant le module Overlay. Le thme qui saffiche dans lOverlay est le thme dadministration, il peut tre modifi via le menu Apparence (en bas de la page, section Thme de ladministration).
1.8
Help : les pages daide
Le module Help permet aux modules de Drupal de proposer des pages daide. Celles-ci sont centralises dans le menu Aide. Lorsque vous installez un nouveau module, il y a de grandes chances quil ajoute une page ici.
2 - Organisation du site
67
Liste des pages daide du site
partir de la liste des modules (menu Modules), un lien direct vers la page est propos si elle existe.
Lien Aide de chaque module
2
2.1
Organisation du site
Block : les blocs
Le chap. I 2.3 Les blocs prsentait la page qui permet de configurer les blocs dans Drupal. Voici les autres fonctionnalits proposes autour des blocs.
2.1.1 Positionnement et rgions des thmes

Un bloc est une bote qui permet dafficher tous types dinformations et qui peut se positionner dans une rgion de la page.
h
Menu Structure lien Blocs
Cette page possde autant donglets en haut droite quil y a de thmes activs.
68
Bartik, Danblog et Seven sont les trois thmes activs du site
Vous pouvez activer et positionner les blocs diffremment selon le thme. Un lien Aperu des rgions des blocs permet de visualiser quelles sont les rgions de chaque thme.
Les deux rgions du thme dadministration Seven
69
Les quinze rgions du thme Bartik
Une liste droulante propose de choisir parmi les rgions du thme slectionn o va se positionner le bloc.
Liste des rgions disponibles pour le contenu rcent du thme Bartik
70
2.1.2 Les types de bloc

Voici la liste des blocs disponibles pour les modules activs par dfaut : Aide du systme Contenu de la page principale Contenu rcent Connexion utilisateur Commentaires rcents Management Menu principal Navigation Nouveaux membres Propuls par Drupal Syndication Slecteur de langue User menu Utilisateurs en ligne Affiche un paragraphe daide li la page en cours. Cela est souvent le cas pour les pages dadministration. Affiche le contenu de la page. Si cest une page article, il affichera larticle, son image, ses tags, etc. Si cest une page dadministration, il affichera le formulaire. Affiche les 10 derniers contenus ajouts au site. Permet aux utilisateurs de se connecter sils ne le sont pas. Ce bloc ne saffiche pas si lutilisateur est dj connect. Affiche les 10 derniers commentaires du site. Bloc li au menu Management qui contient les liens des tches administratives Bloc li au menu Menu principal (onglets au dessus du contenu dans Bartik). Bloc li au menu Navigation qui contient les liens destins aux visiteurs du site. Affiche les derniers utilisateurs inscrits. Affiche un lien vers http://drupal.org (par dfaut dans le pied de page) Affiche un lien vers les flux RSS de la page. Permet de slectionner la langue du site. Liens vers le compte de lutilisateur connect et lien pour se dconnecter du site. Ce bloc affiche le nombre dutilisateurs connects et leur nom.
Cette liste peut senrichir lors de lactivation de nouveaux modules (exemple : sondage le plus rcent pour le module Poll).
2.1.3 Les options des blocs

Chaque bloc possde une page de configuration.
h h
Cliquer sur le lien Configurer en face du bloc Contenus rcents Modifiez les paramtres du bloc comme sur lillustration suivante
71
Les options du bloc contenu rcent
Titre du bloc Nombre dlments de contenu rcent afficher Paramtres de la rgion
Modifier le titre du bloc lorsquil saffiche (et non dans linterface dadministration). Paramtre spcifique au bloc. Affichage du bloc pour chacun des thmes activs.
En partie basse de la page de configuration, quatre onglets horizontaux permettent de grer la visibilit des blocs selon les modes daffichages. Afficher ou ne pas afficher le bloc selon lURL de la page. Attention, le chemin node/* inclut les chemins contenant quelque chose aprs node (node/2 est inclu mais node seul nest pas inclu) Types de contenu Afficher le bloc uniquement pour certains types de contenu. Rles Afficher le bloc uniquement pour les utilisateurs possdant un certain rle. Utilisateurs Permettre aux utilisateurs de choisir si ils veulent ou non afficher ce bloc dans leurs prfrences. Pages Vous pouvez accder la page dadministration dun bloc lorsquil est affich sur une page grce un menu contextuel.
Menu contextuel des blocs
72
2.1.4 Ajouter un bloc personnalis

Vous allez maintenant ajouter un bloc personnalis qui affichera un message de bienvenue.
h h
Menu Structure lien Blocs Lien + Ajouter un bloc Description du bloc : Bienvenue Titre du bloc : Bienvenue sur notre site Corps du bloc : Bonjour, nhsitez pas crer un compte pour dposer de nouvelles recettes. Bartik : choisir Premire barre latrale
partir de cette page, vous pouvez crer un nouveau bloc et y ajouter le contenu que vous dsirez.
h h h h
Page de cration dun bloc

h h
Cliquez sur Enregistrer le bloc, vous avez alors un nouveau bloc Bienvenue disponible Allez en page daccueil
Le bloc de Bienvenue nouvellement cr
73
2.2
Menu : les menus
2.2.1 Menus installs par dfaut

Les menus sont des listes de liens qui peuvent tre personnalises et ensuite affichs dans des blocs.
h
Menu Structure lien Menus
Liste des menus du site
Par dfaut, il y a quatre menus dans Drupal : Management Menu principal Navigation User menu Liste les pages dadministration disponibles pour ladministration du site. Par dfaut affich dans la barre de menu en haut de page (Tableau de bord, Contenu, etc.) Onglets affichs par dfaut au dessus du contenu dans Bartik (Home, Salade de penne, etc.) Liste des pages dadministration disponibles en fonction des droits de lutilisateur connect Menu destin tre affich dans le bloc utilisateur, qui permet de se dconnecter et daccder son compte
Les quatre menus de Drupal
74
2.2.2 Crer un menu en ajoutant du contenu

Vous pouvez ajouter des lments des menus directement lors de la cration dun contenu grce longlet Paramtres du menu comme vous lavez fait au chap. I 2.2 Les menus.
Longlet Paramtres du menu disponible lors de la cration dun contenu
2.2.3 Cration dun nouveau menu

Vous allez crer un nouveau menu dans lequel vous ajouterez quelques liens.
h h h h h
Menu Structure lien Menus Lien + Ajouter un menu Titre : Liens Divers Description : Liste de liens divers Bouton Enregistrer Lien + Ajouter un lien Titre du lien dans le menu : Drupal en Franais Chemin : http://www.drupalfr.org Description : Le site web des Drupaliens francophones
Votre menu est alors cr, il faut maintenant lui ajouter quelques liens
h h h h
75
La description est lattribut title du lien et saffiche au survol de la souris.
Le title des liens

h
Le Lien parent permet de choisir quel menu appartient le lien. Ici, le menu <Liens Divers> est choisi automatiquement.
Ajout dun item un menu

h
Bouton Enregistrer Chemin http://www.drupalfr.org http://www.drupal.org taxonomy/term/1 node/2 node/1 Description Le site web des drupaliens francophones Site officiel Drupal Liste des plats principaux du site
De la mme manire, ajoutez ces autres liens : Titre Drupal en franais Drupal Plats principaux Risotto Salade de penne
76
Le chemin des trois derniers liens internes peuvent tre diffrents sur votre site. Vrifiez leur URL en allant sur les pages concernes.
Les 5 liens du menu Liens divers
2.2.4 Affichage du menu dans un bloc

Pour chaque menu cr correspond un bloc du mme nom que vous allez afficher gauche du contenu (rgion Premire barre latrale).
h h h
Menu Structure lien Blocs la section Dsactiv, mettre le bloc Liens divers en Premire barre latrale Allez en page daccueil pour voir le bloc Les menus contextuel dun bloc li un menu contiennent des raccourcis pour lister les liens et configurer le menu.
Menu contextuel dun bloc de menu
2.2.5 Hirarchiser un menu

h
Retournez sur la liste des liens du menu (menu contextuel Lister les liens)
Vous pouvez changer lordre des menus mais galement les hirarchiser. Par exemple, vous pouvez indiquer que les liens Risotto et Salade de penne sont les enfants du lien Plats principaux.
h
Dplacer les liens Risotto et Salade de penne vers la droite
77
Hirarchisation des liens du menu

h
Liste des plats principaux replis

h
Cliquez sur Plats principaux, le menu affiche alors les liens enfants Retournez sur la page Lister les liens du menu Cliquez sur le lien modifier du lien Plats principaux Cochez loption Afficher dpli
Vous pouvez afficher ce menu dpli par dfaut pour quil affiche ses liens enfants.
h h h
Options des menus

h
Bouton Enregistrer
Menu hirarchis dpli
Loption Activ permet de ne pas afficher un lien tout en le gardant dans le menu.
78
2.3
User : gestion des utilisateurs
Drupal est un outil qui permet de crer des sites communautaires dont le contenu est enrichi par diffrents utilisateurs. Drupal dispose donc de fonctionnalits avances qui permettent au webmaster de grer les utilisateurs de son site. Dans ce chapitre, vous dcouvrirez les diffrentes mthodes qui vous sont offertes pour crer de nouveaux comptes utilisateurs. Ensuite, vous apprendrez grer les droits daccs : vous attribuerez chacun de vos utilisateurs des rles qui leur permettront davoir accs seulement certaines fonctionnalits.
2.3.1 Ajout dutilisateurs

Il existe par dfaut deux utilisateurs : ladministrateur du site, qui a tous les droits, et lutilisateur anonyme, ou utilisateur non authentifi, qui a des droits limits par dfaut.
h
Menu Personnes
Vous pouvez consulter sur cette page la liste des utilisateurs du site. Lutilisateur Anonyme napparat pas dans cette liste car il nest pas possible de le modifier.
h
Vous pouvez ajouter un nouvel utilisateur en tant quadministrateur en cliquant sur le lien + Ajouter un utilisateur Nom dutilisateur : Utilisateur1 Adresse e-mail : utilisateur1@monadresse.com Mot de passe : atelierdrupal, par exemple Laissez le Statut Actif Loption Notifier lutilisateur la cration de son nouveau compte envoie un mail ladresse Adresse de courriel
Remplissez alors le formulaire :

h h h h
Ajout dun utilisateur manuellement
79
Bouton Crer un nouveau compte
Retournez dans la liste (menu Personnes), Utilisateur1 devrait apparatre.
Liste des utilisateurs
2.3.2 Configuration de linscription des utilisateurs

Comme cest souvent le cas pour les sites communautaires, les visiteurs peuvent se crer un compte automatiquement.
h
Menu Configuration lien Paramtres de compte
Cette page sert configurer le processus de cration des comptes et les messages envoys cette occasion.
Inscription
Les diffrentes faons de crer un compte avec Drupal
80
Seulement les administrateurs Visiteurs Les visiteurs, mais lapprobation dun administrateur est requise
Si vous choisissez cette option, la ligne Crer un nouveau compte du bloc Connexion utilisateur napparatra plus. Seul les ajouts manuels seront autoriss (comme vous lavez fait pour lutilisateur1). Un visiteur anonyme peut se crer un compte et lutiliser immdiatement. Un utilisateur anonyme pourra crer un compte mais il sera inactif par dfaut. Seul ladministrateur du site pourra lactiver.
Lorsque les visiteurs crent eux-mmes leur compte, vous pouvez cocher loption Exiger la vrification de ladresse de courriel. Le nouvel utilisateur devra alors utiliser un lien temporaire contenu dans le mail pour activer le compte. Vous pouvez proposer vos utilisateurs dajouter leur profil un portrait ou une signature la section Personnalisation. Cependant, je vous conseille plutt dutiliser les champs personnaliss qui proposent un systme plus souple et plus personnalisable (chap. II 4 Field UI : Types de contenus personnaliss).
Courriels
En bas de page, diffrents onglets horizontaux permettent de personnaliser le contenu des mails envoys. Bienvenue (nouvel utilisateur cr par un Mail envoy lorsque ladministrateur cr un compte manuellement (option de cration : administrateur) Seulement les administrateurs) Mail envoy lorsque lutilisateur a cr un compte mais quil est encore inactif. (Option de Bienvenue (en attente dapprobation) cration : Visiteurs avec approbation) Bienvenue (aucune approbation requise) Mail envoy lorsque lutilisateur a cr un compte (option de cration : Visiteurs) Activation du compte Mail envoy lorsque ladministrateur active le compte (option de cration : Visiteurs) Compte bloqu Mail envoy lorsque ladministrateur coche loption Bloqu dun compte Confirmation de lannulation du compte Mail envoy pour demander la confirmation de lannulation dun compte Compte annul Mail envoy lorsque le compte est effectivement annul Mail envoy lorsque lutilisateur clique sur le lien Demander un nouveau mot de Rcupration de mot de passe passe du bloc Connexion utilisateur Cette page permet la modification du nom de lutilisateur anonyme et du rle de ladministrateur (vous dcouvrirez les rles plus loin dans ce chapitre). Vous pouvez placer des variables (ou jetons) de type [user:name] dans le corps de vos mails qui seront remplacs par une valeur selon le contexte (nom de lutilisateur pour user:name).
2.3.3 Les rles des utilisateurs

Chaque utilisateur de Drupal peut tre affect un ou plusieurs rles. Les rles donnent ensuite des droits daccs permettant dexcuter des actions.
81
Un utilisateur est affect un rle qui possde des droits
Cration dun rle

h h
Menu Personnes onglet Droits Bouton en haut droite Rles
Ici saffiche la liste de rles. Par dfaut, il existe trois rles spciaux : utilisateur anonyme (pour tous les visiteurs du site non authentifis), utilisateur identifi (pour tous les utilisateurs ayant un compte) et administrator qui est le rle de lutilisateur cr durant linstallation de Drupal.
h
Ajoutez en un nouveau : Rdacteur de recettes
Liste des rles

h
Bouton Ajouter un rle
82
Attribution dun rle un utilisateur

Vous allez maintenant attribuer le rle Rdacteur de recettes utilisateur1.
h h h h
Menu Personnes Choisissez le lien modifier de la ligne Utilisateur1 Cochez la case Rdacteur de recettes de la section Rles Cliquez sur le bouton Enregistrer Il est possible, sur la page Personnes de slectionner une liste dutilisateurs et dajouter ou de supprimer des rles. Cela vite ladministrateur dentrer le mot de passe de lutilisateur.
Attribution dun rle un ensemble dutilisateurs
2.3.4 Droits daccs en fonction des rles

h
Menu Personnes onglet Droits
Cette page permet de configurer les droits daccs de chaque rle. Il y a une colonne par rle. Chaque module dfini ses propres droits. Vous allez permettre aux utilisateurs Rdacteur de recettes de crer de nouveaux articles pour pouvoir ajouter des recettes. Cest le module Node qui gre ces permissions :
h
la section Node, dans la colonne Rdacteur de recettes, cochez les lignes Article : Crer un nouveau contenu, Article : Editer son contenu et Article : Supprimer son contenu
Droits daccs selon les rles
83
Bouton Enregistrer les droits daccs Dconnectez-vous en cliquant sur le bouton Se dconnecter dans le menu Nom dutilisateur : utilisateur1 Mot de passe : atelierdrupal Cliquez sur Se connecter Vrifiez que, dans le bloc Navigation (Sidebar First), vous avez accs Ajouter du contenu Article
Vrifiez que lutilisateur1 peut bien crer un article :

h
Connectez-vous avec lutilisateur utilisateur1 :

h h h h
Lutilisateur a les droits pour crer un article
Chaque module possde ses propres droits daccs, noubliez pas quil existe un lien Droits daccs sur la page des modules qui vous positionnera la bonne section de la page des droits daccs
Lien droits daccs de Captcha
Droits daccs dfinis par le module Captcha
84
Vous pouvez vous connecter avec deux utilisateurs en mme temps sur un mme ordinateur en utilisant deux navigateurs diffrents (Firefox et Internet Explorer par exemple).
2.3.5 Exercice : cration dun bloc pour un rle spcifique

Crez un utilisateur utilisateur2 qui na pas de rle spcifique Crez un bloc personnalis qui ne saffichera que pour le rle utilisateurs identifis
Le bloc crer
Le bloc saffiche t-il pour utilisateur1 ? Pourquoi ?
Corrig
Cration de utilisateur2
h h
Menu Personnes Lien + Ajouter un utilisateur Nom dutilisateur : Utilisateur2 Adresse e-mail : utilisateur2@monadresse.com Mot de passe : atelierdrupal, par exemple Bouton Crer un nouveau compte Menu Structure lien Blocs Lien + Ajouter un bloc Description du bloc : Bloc utilisateur identifi Titre du bloc : Bienvenue, utilisateur identifi Corps du bloc : Merci de vous tre connect ce site avec votre compte ! Bartik : choisir Premire barre latrale la section Paramtres de visibilit, dans longlet Rles, cochez la case utilisateur identifi
Remplissez alors le formulaire :

h h h h
Cration du bloc
h h h h h h h
85
Paramtre de visibilit du bloc

h h
Bouton Enregistrer le bloc Connectez vous avec utilisateur2, le bloc doit apparatre Le bloc saffiche pour utilisateur1 car il possde le rle Rdacteur de recettes ET utilisateur identifi. Pour la mme raison, il saffiche galement pour utilisateur2.
2.4
Path : url de vos pages
Les URL de Drupal tels que ?q=node/2 (lien vers la node n2) ou ?q=taxonomy/term/1 (lien vers le tag n1) ne sont pas trs explicites. Grce au module Path, vous pouvez crer des Alias dURL qui permettent par exemple de faire correspondre ?q=node/2 ?q=risotto pour amliorer la navigation et le rfrencement.
2.4.1 Installation
h
Le module est install par dfaut et activ dans Drupal
2.4.2 Utilisation
h h h
ditez larticle du Risotto En bas de la page, slectionnez longlet horizontal Paramtres du chemin dURL Dans la zone Alias dURL, entrez risotto
86
Cration dun alias dURL pour un contenu

h
Bouton Enregistrer
LURL de votre contenu devient alors ?q=risotto. Il est possible de supprimer le ?q= en utilisant les URL simplifies (xxx : Activez les URL simplifis)
2.4.3 Administration
Une page permet dadministrer lensemble des alias et den ajouter de nouveaux :
h
Menu Configuration lien Alias durl (ou lien Configurer du module Path)
Ici est list lensemble des alias du site. Reprez lURL de la page de listes des recettes contenant le tag Riz (de type ?q=taxonomy/term/3). Vous allez lui crer un alias ?q=riz.
h h h
Cliquez sur + Ajouter un alias Dans la zone Chemin systme existant, entrez taxonomy/term/3 Dans la zone Alias de chemin, entrez riz
87
Ajout dun alias

h h
Bouton Enregistrer Affichez la page du Risotto et cliquez sur le Tag Riz
Le nouvel alias cr
Chap IV 4.3 Pathauto : Automatisez la cration de vos Alias
88
Ajout de contenu
Dans ce chapitre vous verrez comment les diffrents utilisateurs de votre site vont pouvoir y ajouter du texte et comment ils peuvent le mettre en forme facilement et lagrmenter (ajout dimages ou de vidos).
3.1
h h
Les types de contenu
Rendez vous sur la page dajout de contenus : Menu Contenu Lien + Ajouter du contenu
Il existe par dfaut dans Drupal deux types de contenu : Article et Page de base qui possdent quelques diffrences : vous pouvez ajouter une illustration et des Tags un article ; le rsum dune page ne saffichera pas par dfaut en page daccueil ; une page naccepte pas de commentaires. Par exemple, pour un site de nouvelles, on crera un contenu de type Page pour prsenter le site. Par contre, pour les nouvelles proprement dites, on choisira un contenu de type Article qui permettra aux lecteurs de laisser des commentaires, dafficher les nouveaux articles sur la page daccueil, etc. En activant des modules, de nouveaux types de contenu peuvent sajouter la liste comme cela sest pass pour le module Poll (ajout du type de contenu Sondage).
Quest ce quune node ?

Vous rencontrerez (ou avez dj rencontr) rgulirement le mot Node en utilisant Drupal, alors quest-ce quune node ? Une node dans Drupal est un contenu de nimporte quel type article ; page ; sondage ; etc. Cela ne veut pas dire que tout est une node dans Drupal : un commentaire nest pas une node mais est attach une node ; une page dadministration nest pas une node. Le chap. II 4 Field UI : Types de contenus personnaliss, montre comment crer vos propres types de contenu en utilisant linterface de Drupal.
3 - Ajout de contenu
89
3.1.1 Options des nodes

h h
ditez un contenu de type article (par exemple Salade de penne) Placez vous tout en bas de la page Permet de lier un menu au contenu. Les rvisions sont des versions de larticle. Vous pouvez modifier larticle tout en conservant son ancienne version et y revenir ensuite grce longlet rvision de la node.
Ici des onglets horizontaux permettent de rgler les paramtres de larticle. Paramtres du menu
Informations sur les rvisions
Lors de laffichage de la node, longlet Rvisions permet de revenir une ancienne rvision.
Ajout dune rvision
Liste des rvisions dune node
Paramtres du chemin Permet de modifier lURL de larticle (chap II - 2.4 Path : Url de vos pages). dURL Paramtres des commen- Gre les commentaires. Vous pouvez par exemple interdire les commentaires sur cet article bien que le type taires de contenu les autorise. Permet de modifier le nom de lauteur de larticle ainsi que sa date de rdaction.
Information de rdaction
Changement dauteur pour larticle
Options de publication
Permet de publier ou non larticle, de le mettre en page daccueil ou de lpingler en haut de la page daccueil.
90
Si vous tes en cours de rdaction dun article, il peut tre utile de ne pas le publier pour que vos visiteurs ne puissent pas le consulter.
Les onglets horizontaux dun type de contenu
Les onglets horizontaux dans Drupal possdent un court rsum des paramtres dfinis.
Les options de publications sont Publi et Promu en page daccueil
3.1.2 Options des types de contenus

h
Menu Structure lien Type de contenu
Saffiche la liste des contenus disponibles pour votre site. Vous pouvez rgler les options par dfaut de chaque type de contenu. Les nouvelles nodes de ce type sont alors cres avec ces paramtres.
h
Cliquez sur le lien modifier du type de contenu Article.
Il est possible de changer le Nom et la Description de larticle.
91
Nom et description de larticle
Affichage du nom et de la description lors de lajout de contenu
En bas de page, des onglets horizontaux permettent de modifier le comportement par dfaut des nouveaux articles du site.
Paramtres du type de contenu article
Paramtres du formulaire Permet de modifier le libell du titre et de rgler les paramtres de laperu avant soumission. de contribution Paramtres des Options de publications (Publi, Promu en page daccueil, Epingl en haut des listes) par dfaut des nouvelles nodes de ce type de contenu. Vous pouvez galement forcer la cration de nouvelles Options de publication rvisions chaque modification en cochant Crer une nouvelle rvision. Permet galement de rgler la gestion multilingue. Paramtres daffichage Indique si le nom de lauteur et la date doivent tre affichs lors de la consultation de ce type de contenu. Paramtres des commenCest ici que se configure le module Comments de Drupal qui gre les commentaires. taires Paramtres du menu Permet de dfinir un menu par dfaut et de rduire le nombre de menus disponibles pour le contributeur.
92
Cette page contient donc des paramtres trs importants pour la gestion des types de contenus. Noubliez pas quelle existe !
3.2
Filter : formatez vos textes
3.2.1 Utilisation des formats de texte

Lors de la cration de vos recettes, vous navez pas mis en forme le texte du Corps de votre article. Voici comment mettre en gras et souligner certains textes dune recette.
h
Rendez vous sur la page de la Salade de penne, ditez l en cliquant sur longlet Modifier
Des balises html peuvent tre utilises pour la prsentation de votre recette : Les balises HTML sont des commandes interprtes par les navigateurs internet. Elles sont saisies entre les signes < et >. En gnral, les balises de dbut (exemple : <strong>) ont une balise de fin (</strong>)
h
Mettez la ligne du vin conseill en gras grce la balise <strong>
Une balise HTML dans le corps du texte

h
Cliquez sur le bouton Enregistrer et voyez le rsultat
Mise en gras dune ligne
93
h h
ditez de nouveau la page Dans la liste Format de texte, en dessous du corps, choisissez Plain text en remplacement de Filtered HTML
Modification du format de texte

h
Bouton Enregistrer
La mise en gras ne fonctionne plus
Les formats dentres permettent donc dautoriser linterprtation de certaines balises ou motifs dans votre contenu. Il existe par dfaut 3 formats dentres : Filtered HTML, Full HTML et Plain Text. Full HTML interprte lensemble de balises HTML, Filtered HTML est moins permissif et donc plus scuris, Plain text autorise le minimum de balises HTML. Cliquez sur le lien Plus dinformations sur les formats de texte en dessous dune zone de texte pour connatre les balises acceptes par les formats disponibles.
Extrait de la page daide du format Filtered HTML
94
3.2.2 Exercice : ajoutez du code php dans vos nodes

Le module PHP filter ajoute un format de texte PHP code qui donne la possibilit dexcuter du code PHP dans le contenu. activez le module PHP Filter (module prsent par dfaut dans Drupal) ; crez un article qui affiche dans son contenu la date et lheure courante.
Affichage de la date et de lheure courante dans une node grce PHP
La fonction PHP date (http://php.net/manual/fr/function.date.php) permet de retourner la date et lheure courante : Pour afficher le jour, le mois et lanne :
<?php echo date('d-m-Y') ?>
Pour afficher lheure et les minutes

<?php echo date('H:i') ?>
Corrig
Activation du module
h h h
Menu Modules Cochez la case PHP filter Bouton Enregistrer la configuration Menu Contenu lien + Ajouter du contenu Choisir Article Titre : Affichage de la date et lheure Corps :
Bonjour ! Nous sommes le <?php echo date('d-m-Y') ?> et il est ?> <?php echo date('H:i')
Cration de larticle
h h h h
Format de texte : PHP Code
95
Du code PHP dans le corps de larticle

h
Bouton Enregistrer
3.2.3 Ajouter un filtre un format de texte

Si le format Full HTML est utilis pour larticle prcdemment cr, voici le rsultat obtenu :
Full HTML
Aprs la premire ligne, le retour la ligne fonctionne, par contre, cest sans surprise que les balises <?php ?> ne sont pas values. Un format de texte est compos de filtres qui valuent ou nvaluent pas des balises. Voici de quels filtres est compos le format FullHTML :
h
Menu Configuration lien Format de textes
Liste des formats de texte disponibles
96
Lien configurer du format Full HTML
Cette page permet de configurer le format de texte. La section Filtres activs, liste lensemble des filtres installs.
Les filtres de Full HTML
Limiter les balises HTML autorises Affiche les fichiers HTML au format texte Convertir les sauts de ligne en HTML
Autorise seulement quelques balises. Ce filtre est utilis pour le format Filtered HTML Aucune balise HTML autorise. Ce filtre est utilis pour le format Plain text
Le filtre dtecte les sauts de ligne dans la zone de texte et les remplacent par des balises HTML (<br> pour retour la ligne et <p> pour cration de paragraphe) Transforme les chaines de type http://www.atelierdrupal.net en <a href="http://www.atelierdrupal. Convertir les URL en liens net">http://www.atelierdrupal.net</a> (dtecte galement les adresses mail) Corriger le HTML dfecLorsquune balise nest pas reconnue, elle est supprime tueux ou coup
h
Cochez le filtre interprteur PHP qui a t ajout lors de lactivation du module PHP Filter
Vous pouvez ensuite modifier lOrdre de traitement des filtres. Par exemple, le filtre Corriger le HTML dfectueux ou coup va modifier la balise <?php ?> et interprteur PHP ne pourra lvaluer, provoquant ainsi une erreur. Donc si interprteur PHP est situ en dernier, le code php ne sera pas valu.
h h
Bouton Enregistrer la configuration Rechargez la page Affichage de la date et lheure
97
Full HTML interprte les balises PHP
3.2.4 Droits daccs aux formats de texte

Une mauvaise configuration des formats de texte constitue un risque de scurit. Certaines balises permettent dinclure des liens ou des scripts malicieux, il est donc fortement conseill de limiter laccs aux formats de texte permissifs aux utilisateurs de confiance. Vous pouvez grer les droits sur la page de configuration des formats de texte
h
Menu Configuration lien Format de textes Le lien Configurer du module Filter permet daccder directement cette page.
Accs la page de configuration de Filter

h
Lien configurer du format Full HTML
En haut de cette page, vous pouvez choisir les rles qui pourront utiliser le format de texte.
Rles pouvant utiliser Full HTML
La section Filter de la page des droits daccs prsente une vision plus globale des permissions.
h
Menu Personnes Onglet Droits daccs
98
Liste des droits daccs des formats de texte
Pour la suite de ce livre, le format de texte PHP Filter sera dsactiv
3.3
Video filter : affichez des vidos dans votre contenu
Le module Video filter permet dinsrer un lien vers les vidos des sites de partage de type Youtube, DailyMotion, Vimeo, etc.
h
Tlchargez et activez le module Video filter (http://drupal.org/project/video_filter Version utilise pour ce livre 7.x-3.0-beta2)
Video Filter ajoute votre installation un nouveau filtre Video Filter que vous allez ajouter au format dentre Full HTML.
h
Menu Configuration lien Formats de texte Lien configurer du format Full HTML Dans la liste Filtres activs, cochez Video Filter Dans la liste Filtrer lordre de traitement, placez Video Filter au-dessus de Convertir les URL en liens
Saffiche alors la liste des formats de texte prsents sur le site.

h h h
99
Page de configuration dun format de texte
Lordre de traitement des filtres est important. Ici, si Convertir les URL en liens traite le lien Vido avant Vido Filter, il modifie sa syntaxe et la vido ne saffiche pas. Remarquez en bas de page les onglets horizontaux qui permettent de modifier les paramtres de certains filtres activs (taille des vidos par exemple).
Paramtres des filtres

h
Bouton Enregistrer la configuration Allez sur la page dune vido Copiez son URL Modifiez larticle Salade de Penne la fin du corps ajoutez [video:url de votre vido]
Vous allez maintenant ajouter une vido dans le Corps de votre article.
h h h h
100
Ici, le filtre nest donc plus une balise HTML.

h
Choisissez le format de texte Full HTML
Ajout dun lien vers une vido
Le texte daide en dessous du format de texte est celui des diffrents filtres qui lui sont associs. Vrifiez bien quaprs avoir choisi Full HTML, le texte You may insert videos with [video:URL] apparat bien en tte de liste.
h
Bouton Enregistrer
Le contenu intgre une vido !
101
3.4
Wysiwyg : installer un diteur Wysiwyg
Installer un diteur Wysiwyg (What You See Is What You Get Ce que vous voyez est ce que vous avez) permettra aux utilisateurs qui ne connaissent pas la syntaxe HTML de mettre en forme facilement leur texte.
Exemple dditeur Wysiwyg
3.4.1 Configuration de Wysiwyg

Contrairement ce que son nom peut laisser penser, le module Wysiwyg ne contient pas dditeur Wysiwyg. Il permet seulement dinstaller facilement lun des nombreux diteurs existants.
h
Tlchargez et activez le module Wysiwyg (http://drupal.org/project/wysiwyg Version utilise pour ce livre 7.x-2.0) Lien Configurer du module ou menu Configuration lien Profils wysiwyg
Saffiche alors la liste de tous les diteurs supports par le module, aucun nest install pour le moment. Cependant, Wysiwyg indique o les tlcharger et leurs chemins dinstallation.
3.4.2 Installation de lditeur openWYSIWYG

openWYSIWYG est un diteur lger et open source. Voici les directives du module Wysiwyg pour installer cet diteur :
Les directives dinstallation de openWysiwyg
102
Wysiwyg affiche un lien direct vers la page de tlchargement (Tlcharger) et indique dans quel rpertoire il faut lextraire. Les diteurs Wysiwyg sont des programmes Javascript, voila pourquoi Wysiwyg va chercher localiser un fichier .js (wysiwyg.js)
h
Crez le rpertoire /sites/all/libraries dans votre rpertoire Drupal. Chaque diteur y possdera un sous-rpertoire Cliquez sur le lien Tlcharger Tlchagez le fichier zip sur le site de lditeur (version utilise pour ce livre openwysiwyg_ v1.4.7.zip) Extrayez le rpertoire dans /sites/all/libraries Renommez le en openwysiwyg (sans numro de version). Rechargez la page de configuration de Wysiwyg (lien Configuration Menu Profils wysiwyg)
h h
h h h
Wysiwyg a trouv lditeur
Le module Wysiwyg a dtect quun diteur est disponible, il permet alors dassocier chaque format avec cet diteur. Si cela ne fonctionne pas, cest sans doute que le chemin daccs est faux. Vrifiez que vous navez pas un rpertoire librairies au lieu de libraries et que le fichier .js est bien lendroit indiqu par Wysiwyg.
3.4.3 Cration dun nouveau format de texte pour lditeur

Wysiwyg permet donc maintenant dassocier un format de texte avec un diteur. Comme il est prfrable de conserver les formats existants, vous allez crer un nouveau format openWysiwyg qui sera associ avec lditeur.
103
h h h h
Menu Configuration lien Formats de texte Lien + Ajouter un format de texte Nom : openWysiwyg Ne cochez aucun filtre pour que openWysiwyg puisse utiliser toutes les balises HTML
Le nouveau format dentre

h
Bouton Enregistrer la configuration Menu Configuration lien Profils wysiwyg Choisissez lditeur openWysiwyg pour le Format de texte openWysiwyg Bouton Enregistrer
Il faut maintenant associer lditeur au Format de texte openWysiwyg.

h h h
Vous pouvez configurer le comportement de votre diteur pour ce format dentre.
Configuration de lditeur pour le format dentre

h
Lien Modifier
104
Une page contenant cinq sections saffiche alors : Paramtrage de base Boutons et plugins Apparence de lditeur Nettoyage et sortie CSS
h h
Permet de modifier la langue (si la traduction est disponible) et de configurer lactivation de lditeur Permet dajouter ou de supprimer des boutons dans la barre doutils Permet de modifier laspect de la barre doutils Directives de traitement du code HTML Ajouter du code CSS spcifique pour lditeur
Par dfaut, aucun bouton nest activ, la barre doutils de lditeur sera donc vide : Dpliez la section Boutons et plugins Cochez lensemble des cases
Boutons disponibles de openWysiwyg

h
Bouton Enregistrer en bas de page. ditez le contenu de la Salade de penne Choisissez le format dentre openWysiwyg Mettez en forme la recette
Il est maintenant temps de voir le rsultat de votre travail :

h h
Une barre doutils doit apparatre en haut de la zone de texte.

h
105
La zone de texte et openWysiwyg

h
Bouton Enregistrer
Le texte mis en forme
Noubliez pas que le format de texte cr est trs permissif, autorisez seulement des utilisateurs de confiance lutiliser
106
Field UI : types de contenus personnaliss

tags (taxonomie) ; corps (texte) ; image (fichier).
Le type de contenu qui permet dajouter un article est compos de champs (fields) de diffrents types. Dans ce chapitre, vous allez dcouvrir comment paramtrer chacun de ces trois champs :
Ensuite, dans la deuxime partie, vous crerez votre propre type de contenu Recette, compos de ses champs spcifiques. Aprs avoir cr ce type de contenu, Drupal proposera alors une interface de saisie conviviale pour les nouvelles recettes et permettra de configurer laffichage des champs. Enfin, vous verrez comment paramtrer efficacement la Taxonomie et comment ajouter des champs dautres entits (termes de taxonomie, utilisateurs et commentaires).
4.1
Dcouverte du type de contenu article
Avant de crer votre propre type de contenu, vous allez dcouvrir ce qui compose le type article que vous avez dj utilis.
4.1.1 Modifier limage lie larticle

Il est possible dajouter chaque article une image. Grce au module Field, ce champ peut entirement se configurer.
h
Menu Structure lien Types de contenu
Les diffrentes oprations possibles sur un type de contenu
4 - Field UI : types de contenus personnaliss
107
Deux lments peuvent tre modifies graphiquement par ladministrateur Drupal : Laspect final des champs pour le visiteur du site (taille des images, longueur du rsum sur la page daccueil, affichage dune description pour les tags, etc), ceci se fait par le lien grer laffichage. Le formulaire de saisie des champs que le rdacteur de contenu utilisera (formulaire pour ajouter une zone de texte, une image, des tags, etc.), ceci se fait par le lien grer les champs. Le lien modifier, qui permet de grer les options dun type de contenu, a t tudi au chapitre chap. II 3.1.1 Options des nodes
h
Lien Grer les champs du type Article
Page de gestion des champs de larticle
La liste des champs de larticle saffiche. Voici une description de chaque colonne du tableau : Etiquette Nom Champ Widget Oprations Cest le nom du champ tel quil sera affich lcran pour le visiteur et le rdacteur. La croix prcdent ces tiquettes permet de dordonner les champs. Nom du champ machine pour Drupal (nom sans espace et sans majuscule) Type du champ Type dlment utilis pour le formulaire (liste droulante, case cocher, zone de texte, etc.) Le lien modifier permet daccder la page de configuration du champ
108
Modification de laffichage de limage dans la node

Voici comment saffiche limage dun article par dfaut :
Image du Croque-Hawa sur la page de la recette
Image du Croque-Hawa sur la page daccueil
Limage apparat en grande taille sur la page de larticle et en taille moyenne sur la page daccueil. Vous allez modifier cet affichage pour que la photo soit en taille moyenne sur la page de larticle et napparaisse plus sur la page daccueil.
h h
Menu Structure lien Types de contenu Lien Grer laffichage du type Article
109
Saffiche alors la liste des champs du type de contenu (sauf le titre qui est un champ part). Voici une description de chaque colonne du tableau.
Gestion de laffichage des champs dun article
Champ Etiquette Format

h
Cest le nom du champ tel quil sera affich lcran pour le visiteur et le rdacteur. La croix prcdent cette tiquette permet de rordonner laffichage des champs. Indique si nom du champ doit tre affich et sil doit tre sur la mme ligne ou au-dessus Affiche sous quelle forme le champ doit safficher. Pour une date, on pourra choisir lordre des jours-mois-anne, pour un numrique, le nombre de chiffres aprs la virgule, pour une image sa taille, etc.
Pour modifier le format de limage, cliquez sur le bouton engrenage (configuration) droite de la ligne Photo de la recette Dans la liste Style dimage, choisissez medium Chap. IV 4.5 Image : crez des styles dimage personnaliss
Dans la liste Lier limage , choisissez Fichier La liste Lier limage indique le comportement que Drupal doit avoir lorsque limage est clique. Rien : limage nest pas cliquable ; Contenu : limage renvoie vers la node complte ; Fichier : limage est affiche seule, dans sa taille originale.
Changement du format de limage
110
h h
Bouton Mettre jour Bouton Enregistrer en bas de la page
Allez sur votre page du Croque Hawa et vous pourrez constater que limage saffiche maintenant en medium et quun clic affiche limage dans sa taille originale.
Les modes daffichage

Lorsque vous affichez la page daccueil, les nodes saffichent sous forme de rsum. Le but est ici de ne plus faire apparatre les images dans les rsums.
h h
Menu Structure lien Types de contenu Lien Grer laffichage du type Article
Les contextes daffichage dun article

h h
Cliquez sur le mode daffichage Rsum Dans la colonne Format, choisissez -Cach- pour le champ Photo de la recette
Photo de la recette est maintenant cach
Le champ Photo de la recette se positionne maintenant dans la section Cach.

h
Bouton Enregistrer
Allez sur votre page daccueil et vous pourrez constater que les images des articles ne saffichent plus dans les rsums.
111
Vous avez utilis les modes daffichages Par dfaut et Rsum, mais de nouveaux modes peuvent tre ajouts lors de lactivation de nouveaux modules. Ces modes peuvent tre activs en bas de page.
Liste des modes daffichage dun article
Le mode daffichage Par dfaut est utilis lorsque le module qui affiche la node ne trouve pas dautres modes activs. Cest pourquoi en modifiant ce mode, limage sest affiche en style Medium en affichage de contenu intgral. Si vous activez le mode Contenu intgral et que vous affichez la node des Croque Hawa, le style large sera nouveau utilis.
Modification du formulaire dajout dimage

Vous allez maintenant changer quelques paramtres du formulaire qui permet au rdacteur dajouter une image un article.
Formulaire par dfaut pour tlcharger une image dans un article

h h h
Menu Structure lien Types de contenu Lien Grer les champs du type Article Cliquez sur le lien modifier du champ Image
Saffiche alors la longue page de configuration du champ image :
112
Section commune tous les champs
Modifiez les paramtres comme ceci :

h h h
Etiquette : photo de la recette Champ requis : si coch, le champ est obligatoire Texte daide : tlchargez une image pour linclure dans cette recette.
Paramtres du fichier image

h h
Extensions de fichier autorises : png, gif, jpg, jpeg, bmp Rpertoire du fichier : indiquez ici un sous-rpertoire de votre installation o les images seront transfres. Pour field/image, les images seront transfres dans drupal/sites/default/files/field/images.
113
Paramtre de limage
h h h
Rsolution maximale de limage : 1280 x 960 Rsolution minimale de limage : 320 x 200 Taille maximale du transfert : Peut tre limite par la configuration du serveur La balise HTML <img> se prsente sous cette forme :
<img src="mecontent.gif" alt="Tte mcontente" title="Je suis mcontent"/>
Lattribut src est le chemin vers le fichier, alt est le texte afficher si limage nest pas trouve, title est un texte qui saffiche au survol de limage par la souris.
h h h
Activer le champ Alt : coche (propose un champ Alt quand on upload une image) Activer le champ Titre : coche (propose un champ Alt quand on upload une image) Aperu du style dimage : Medium (taille de laperu dans le formulaire de contribution) La section Paramtres du champ Photo de la recette sera tudie plus tard dans ce chapitre.
114
h h
Cliquez sur Enregistrer les paramtres Crez un nouvel article pour constater les changements
Nouvelles directives du formulaire de contribution
Les champs Alt et Titre et lapercu en taille medium
4.1.2 Exercice : modification du champs Corps

laffichage dun article, faites en sorte que la longueur du rsum soit limite 100 caractres.
Rsum dune recette coupe 100 caractres
115
Modifiez le formulaire qui permet de saisir le Corps du texte ainsi : Libell : description de la recette Valeur par dfaut : entrez ici le contenu de votre recette
Rsultat attendu
Corrig :
Faites en sorte que la longueur du rsum soit limite 100 caractres
h h h h h
Menu Structure lien Types de contenu Lien grer laffichage du type Article Bouton Rsum (mode daffichage) Pour le champ Body, cliquez sur le bouton de configuration en bout de ligne Modifiez la Longueur de coupe 100
Modification de la longueur du rsum

h h
Bouton Mettre jour Bouton Enregistrer
Vous pouvez vrifier sur la page daccueil que les rsums contiennent bien 100 caractres.
116
Modifier le formulaire
h h h h h
Menu Structure lien Types de contenu Lien grer les champs du type Article Lien modifier du champ Body Etiquette : description de la recette Valeur par dfaut : entrez ici le contenu de votre recette
Cration dune valeur par dfaut pour le champ Body

h
Bouton Enregistrer les paramtres
4.1.3 Les widgets du champ Tags

Les widgets sont des lments visuels de linterface graphique (bouton, liste droulante, zone de texte, etc.). Il est possible modifier ce widget en fonction du besoin. Voici par exemple les types de widgets disponibles pour le champ Tags du type de contenu article :
Widget dauto compltion
Liste de slection
Cases cocher
117
Voici comment choisir le widget utiliser :

h h h
Menu Structure lien Types de contenu Lien Grer laffichage du type Article Dans la colonne Widget, cliquez sur le lien Widget dauto-compltion de terme (tiquetage) de la ligne Tags
Changement de widget pour un champ
Vous pouvez alors choisir le widget utiliser pour ce type de contenu.
Choix dun widget pour le Tag
Vous avez modifi le comportement et laffichage des champs du type contenu Article. Vous tes maintenant prt crer votre propre type de contenu personnalis.
4.2
Cration dun nouveau type de contenu
Pour ajouter des recettes votre site, vous avez jusqu maintenant utilis le type de contenu article. Vous allez maintenant crer un nouveau type de contenu sur mesure contenant ces champs : prsentation de la recette (texte) ; temps de prparation (numrique) ; ingrdients (texte) ; prix (numrique) ; tapes de la recette (texte) ; photo (image) ; email du rdacteur (e-mail).
118
Pourquoi crer un type de contenu spcifique pour ajouter des recettes alors quil est possible dajouter le prix, les ingrdients, etc. dans le corps de larticle ? pour simplifier la tche du rdacteur afin quil se concentre uniquement sur la rdaction de sa recette ; pour uniformiser la prsentation et pouvoir la modifier sans avoir diter toutes les nodes ; pour pouvoir effectuer des tris (exemple : tris par prix) et des filtres (exemple : lister les recettes contenant une photo).
4.2.1 Cration du type de contenu recette

Avant dajouter des champs, il faut commencer par crer le nouveau type de contenu :
h h
Menu Structure lien Types de contenu Lien + Ajouter un type de contenu Le formulaire qui permet de grer les options dun type de contenu a t dtaill au Chap. IV - 3.1.1 Options des nodes.
h h h
Nom : Recette Description : Ajouter une recette ce site Libell du champ titre : Titre de la recette
Paramtres du type de contenu
119
Bouton Enregistrer le type de contenu Cliquez sur le lien grer les champs du type de contenu Recette
Le nouveau type de contenu Recette est cr et ajout dans la liste des types de contenu.
h
Un type de contenu comporte par dfaut deux champs, le Titre et le Corps. Le corps (Body) servira de texte de prsentation de la recette. Il faut donc modifier le champ en consquence :
h h h
Lien modifier du champ Body Etiquette : prsentation de la recette Texte daide : texte dintroduction la recette Si un paramtre du champ Body ne vous convient pas, il est possible de le supprimer de la liste des champs. Le champ Titre lui, est obligatoire.
4.2.2 Ajout dun champ numrique (temps de prparation)

Les rdacteurs de recettes pourront indiquer le temps quil faut (en minutes) pour la confectionner grce ce champ. Dans longlet Grer les champs du type Recette :
h h h h
Etiquette : Temps de prparation Nom du champ : temps_preparation (en miniscule, sans espace) Type de donnes stocker : Entier lment du formulaire pour ldition des donnes : Champ texte
Ajout dun nouveau champ un type de contenu

h h
Bouton Enregistrer Bouton Enregistrer les paramtres du champ
120
La page de configuration du champ numrique saffiche alors.

h h h h
Texte daide : Temps estim pour la confection de la recette Minimum : 0 Suffixe : minutes Bouton Enregistrer
Le champ est ajout la liste. Concernant laffichage, il est prfrable que ltiquette soit sur la mme ligne :
Etiquette Au-dessus
Etiquette sur la mme ligne

h h h
Onglet Grer laffichage Colonne tiquette : Sur la mme ligne
Bouton Enregistrer Il sagit maintenant de tester ce nouveau type de contenu en ajoutant une recette. La recette de 1001recettes choisie pour illustrer les copies dcrans suivantes est celle des Gnocchis la courge, sauce mandarine et parmesan (http://1001recettes.blogspot.com/2011/02/cest-pas-de-la-chiclette-cette-recette.html)
h h h
Menu Contenu lien + Ajouter du contenu Type Recette Ajoutez une recette comme sur la copie dcran suivante :
Formulaire dajout dun contenu de type recette
121
Bouton Enregistrer
Affichage dune recette sur le site
Dans longlet Grer les champs vous pouvez ordonner les champs par simple glisser/dposer. Il serait par exemple judicieux de mettre le champ Temps de prparation juste aprs le titre.
Modification de lordre des champs
4.2.3 Ajout dun champ texte multiple (ingrdients)

Le rdacteur devra saisir un ingrdient par ligne. Comme une recette possde plusieurs ingrdients, ce champ sera de type texte multiple : Le rdacteur pourra ajouter autant de lignes que ncessaire grce un bouton.
h h h h h
Menu Structure lien Types de contenu Lien grer les champs du type Recette Etiquette : Ingrdients Nom du champ : ingredients Type de donnes stocker : Texte
122
h h h h
lment du formulaire pour ldition des donnes : Champ texte Bouton Enregistrer Taille maximale : 255 (Nombre de caractre maximum du champ) Bouton Enregistrer les paramtres du champ
La page de configuration dun champ texte saffiche alors.

h h h h
Taille du champ texte : 90 (taille de llment zone de texte) Texte daide : Entrez un lment par ligne Nombre de valeurs : Illimit Bouton Enregistrer les paramtres
Modifiez la recette des gnocchis et ajoutez les ingrdients.
Zone de texte avec nombre de valeurs illimit
Vous pourrez ensuite, dans votre gabarit de thme, mettre cette liste en forme.
4.2.4 Exercice : ajout dun champ numrique (prix)

Ajoutez un champ permettant aux rdacteurs de saisir le prix par personne de leur recette ; ce champ doit apparatre dans le rsum ; il devra avoir le rendu suivant et devra tre positionn juste aprs le temps de prparation.
123
Affichage du champ prix par personne
Corrig :
Ajouter un champ permettant aux rdacteurs de saisir le prix par personne de leur recette
h h h h h h h h
Menu Structure lien Types de contenu Lien grer les champs du type Recette Etiquette : Prix Nom du champ : prix Type de donnes stocker : Rel (Float) lment du formulaire pour ldition des donnes : Champ texte Bouton Enregistrer Bouton Enregistrer les paramtres du champ tiquette : Prix par personne Texte daide : Entrez le prix estim par personne Suffixe : Bouton Enregistrer les paramtres Onglet Grer laffichage, bouton Accroche Etiquette : Sur la mme ligne Format : Par dfaut Bouton Enregistrer
La page de configuration dun champ numrique saffiche alors.

h h h h
Ce champ doit apparatre dans le rsum

h h h h
124
Il devra avoir le rendu suivant et devra tre positionn juste aprs le temps de prparation Pour rorganiser les champs :
h h h
Onglet Grer les champs Dplacer le champ Prix par personne en dessous du Temps de prparation Bouton Enregistrer Onglet Grer laffichage Etiquette : Sur la mme ligne Format : Par dfaut
Pour modifier le rendu :

h h h
Affichage du rsum
h
Bouton Enregistrer
4.2.5 Exercice : ajout dun champ zone de texte multiple (tapes)

Ajouter un champ permettant aux rdacteurs de saisir les diffrentes tapes de la recette comme sur les copies dcran suivantes :
125
Formulaire dajout des tapes
Les diffrentes tapes dans la node
Corrig :
h h h h h h h h
Menu Structure lien Types de contenu Lien grer les champs du type Recette Etiquette : Etapes Nom du champ : etapes Type de donnes stocker : Texte long lment du formulaire pour ldition des donnes : Zone de texte (plusieurs lignes) Bouton Enregistrer Bouton Enregistrer les paramtres du champ
126

h h h h h h
Champ requis : coch Ranges : 3 (Nombre de lignes dans le formulaire) Texte daide : Entrez chaque tape de votre recette Traitement du texte : Texte filtr Nombre de valeurs : Illimit Bouton Enregistrer les paramtes Lien modifier du champ Etapes la section Valeur par dfaut, choisir Filtered HTML
Pour pouvoir changer le format de texte par dfaut, il faut r-diter le champ.
h h
Modification du format dentre par dfaut dune zone de texte

h
Laffichage de ce champ propos par dfaut convient, il ne faut pas le modifier.
4.2.6 Ajout du champ photo de larticle

Vous pouvez utiliser un mme champ pour diffrents types de contenu. Pour illustrer le type de contenu recettes, vous allez ajouter le champ photo des articles.
h h
Menu Structure lien Types de contenu Lien grer les champs du type Recette Dans la liste Champ partager, slectionnez le champ Image : field_image (Photo de la recette) Etiquette : Photo de la recette
la section Ajouter un champ existant :

h
Ce champ sappelle Photo de la recette car vous avez modifi son tiquette.
h
127
Ajout dun champ existant
Lintitul du champ field_image (Photo de la recette) a t modifi au chap. II 4.1.1 Modifier limage lie larticle.
h h
Bouton Enregistrer Enregistrer les paramtres Les paramtres daffichage dun champ peuvent tre diffrents dun type de contenu un autre.
4.2.7 Email Field : ajout dun champ Mail

Certains modules de Drupal permettent dajouter de nouveaux types de champs. Cest le cas du module Email Field qui permet dajouter un champ de type Email qui propose diffrents formats daffichage.
h
Tlchargez et activez le module Email Field (http://drupal.org/project/email) Version utilise pour ce livre 7.x-1.0-beta1. Menu Structure lien Types de contenu Lien grer les champs du type Recette Etiquette : Email Nom du champ : email Type de donnes stocker : Email
Ajoutez un champ qui permettra au rdacteur de proposer un lien qui pointe vers son adresse de courriel :
h h h h h
Le nouveau type de donnes Email
128
h h h
lment du formulaire pour ldition des donnes : Champ texte Bouton Enregistrer Bouton Enregistrer les paramtres du champ Texte daide : Entrez votre email si vous souhaitez tre contact par vos lecteurs Bouton Enregistrer les paramtres Onglet Grer laffichage

h h
Le lien de courriel peut safficher de plusieurs faons diffrentes :

h
Les diffrents formats daffichage dun champ Email Field
Lien courriel e-mail par dfaut
Formulaire de contact e-mail
E-mail plain text

h
Choisissez ici Lien e-mail par dfaut
129
4.3
Taxonomy : classer le contenu
La taxonomie est la science qui tudie le classement, lorganisation. Cest galement le nom du module qui permet de classer le contenu dans Drupal. Le champ Tags du type de contenu article est gnr par ce module. Dans ce chapitre, vous allez ajouter trois champs au type de contenu recette : tags : reprise du champ Tags existant dans le type Article ; difficult : liste droulante permettant de choisir le niveau de difficult de la recette ; provenance : liste droulante hirarchise permettant de choisir la rgion ou le pays dorigine de la recette.
4.3.1 Le vocabulaire Tags

Le champ Tags permet dajouter des mots cls lors de lajout darticles. Ce champ est gr par le module Taxonomie.
Dcouverte du vocabulaire Tags

Rendez vous sur la page des Tags :
h h
Menu Structure lien Taxonomie Cliquez sur le lien lister les termes du vocabulaire Etiquettes (Tags)
La liste de tous les tags que vous avez entr lors de la rdaction des articles saffiche alors. Il est possible ici de les rordonner, dajouter de nouveaux tags, de les modifier et de les supprimer.
Liste des termes du vocabulaire Tags
Un champ de Taxonomie est appel Vocabulaire. Un vocabulaire est compos dune liste de termes. Ici, le vocabulaire Tags contient les termes Dessert, Entre, Ptes, Plat principal, Riz.
130
Association dun vocabulaire un type de contenu

Vous allez maintenant ajouter le champ Tags au type de contenu recette :
h h
Menu Structure lien Types de contenu Lien grer les champs du type Recette
Ce champ existe dj pour le type article, vous allez le rutiliser pour vos recettes grce la section Ajouter un champ existant :
h h h
Etiquette : Tags Champ partager : rfrence un terme : field_tags (Etiquettes) Elment du formulaire pour ldition des donnes : Widget dauto-compltion de terme Les autres Widget (lments de formulaires) sont dcris au chapitre chap. II 4.1.3 Les widgets du champ Tags
Ajout dun champ existant

h h
Bouton Enregistrer Bouton Enregistrer les paramtres
Si vous modifiez un contenu de type recette, apparatra alors llment de formulaire Tags.
Saisie de tags pour les recettes
131
Comme pour les champs classiques, un vocabulaire peut tre utilis pour plusieurs types de contenu.
4.3.2 Cration dun vocabulaire de taxonomie (champ Difficult)

Le vocabulaire Difficult permettra aux rdacteurs dindiquer si une recette est Trs facile, Facile, Moyen, Difficile ou Trs difficile raliser.
Choix de la difficult pour une recette

h h h h h
Menu Structure lien Taxonomie Lien + Ajouter un vocabulaire Nom : Difficult Description : Indique la difficult de ralisation de la recette Bouton Enregistrer Lien ajouter des termes du vocabulaire Difficult Nom : Trs facile Bouton Enregistrer Allez sur longlet Lister Rorganisez les termes dans lordre Trs facile, Facile, Moyen, Difficile ou Trs difficile
Le vocabulaire est cr, il faut maintenant lui ajouter les 5 termes :

h h h
Ajoutez ainsi les 4 autres termes Facile, Moyen, Difficile et Trs difficile.
h h
132
Organisation des termes du vocabulaire difficult

h
Bouton Enregistrer Menu Structure lien Types de contenu Lien grer les champs du type Recette Etiquette : Difficult Nom du champ : difficulte Type de donnes stocker : Rfrence un terme Elment du formulaire pour ldition des donnes : Liste de slection Bouton Enregistrer
Ajoutez ce vocabulaire au type de contenu Recette :

h h h h h h h
Choix du vocabulaire pour lister les termes

h h h
Vocabulaire : Difficult Bouton Enregistrer les paramtres du champ Bouton Enregistrer les paramtres
Si vous modifiez un contenu de type recette, vous pourrez choisir sa difficult.
133
4.3.3 Cration dun vocabulaire hirarchis (Provenance)

Le vocabulaire provenance permettra aux rdacteurs dindiquer lorigine gographique de la recette. Elle sera hirarchise (Asie, Europe France, Italie, Chine, Vietnam Bretagne, Auvergne, Sicile, Pkin). Commencez par crer le vocabulaire de la mme faon que pour les ingrdients :
h h h h h
Menu Structure lien Taxonomie Lien + Ajouter un vocabulaire Nom : Provenance Description : Provenance gographique de la recette Bouton Enregistrer Lien ajouter des termes du vocabulaire Provenance Nom : Asie Bouton Enregistrer Aller sur longlet Lister pour rorganiser les termes
Le vocabulaire est cr, il faut maintenant lui ajouter des termes :

h h h
Ajoutez ainsi les autres termes Europe, France, Italie, Chine, Vietnam, Bretagne, Auvergne, Sicile et Pkin.
h
Rorganisez les termes en les dplacant de haut en bas pour les rordonner et de gauche droite pour les hirarchiser :
Organisation des termes de Provenance

h
Bouton Enregistrer
134
Vous pouvez galement utiliser la section RELATIONS pour modifier lordre et la hirarchie dun terme.
Choix du terme parent dun terme
De la mme faon que pour le vocabulaire Difficult, il faut ajouter ce vocabulaire au type de contenu Recette.
h h h h h h h h h h
Menu Structure lien Types de contenu Lien grer les champs du type Recette Etiquette : Provenance Nom du champ : provenance Type de donnes stocker : Rfrence un terme Elment du formulaire pour ldition des donnes : Liste de slection Bouton Enregistrer Vocabulaire : Provenance Bouton Enregistrer les paramtres du champ Bouton Enregistrer les paramtres
Modifiez un contenu de type Recette, vous pourrez choisir sa provenance.
Choix de la provenance de la recette
135
4.4
Ajout de champs aux autres entits
Vous savez maintenant comment ajouter des champs des entits nodes (de type article, recette, etc.). Mais il est possible dajouter des champs de nimporte quel type dautres entits comme les utilisateurs, les commentaires ou bien les termes de Taxonomie. Voici, par exemple, ce que vous raliserez dans ce chapitre : ajout d'un champ Sexe (bouton radio) pour les utilisateurs ; ajout dun champ Type de commentaire (terme de taxonomie) pour les commentaires ; ajout dun champ (Image) pour les termes de Taxonomie du vocabulaire difficult.
4.4.1 Ajout dun champ pour les utilisateurs

Lorsque vous avez ajout un utilisateur au chap. II 2.3 User : Gestion des utilisateurs, il vous tait demand sur la page de cration de comptes les champs suivants : Nom dutilisateur ; Adresse e-mail ; Mot de passe. Vous allez ajouter un nouveau champ qui demandera si lutilisateur est un homme ou une femme.
Rendu du champ dans le profil de lutilisateur

h
Menu Configuration lien Paramtres de comptes Vous pouvez galement atteindre cette page via le lien Configurer du module User.
h h h
Onglet Grer les champs Etiquette : Sexe Nom du champ : sexe
136
Le type de donnes est de type boolen : Homme (0) ou Femme (1). Cest donc un entier qui sera stock dans la base.
h h
Type de donnes stocker : Liste (entier) lment du formulaire pour ldition des donnes : Cases cocher/boutons radio
Ajout dun champ boutons radios

h
Bouton Enregistrer
Il faut ensuite indiquer la liste des valeurs que peut prendre le champ. Ici, la valeur pourra tre Homme ou Femme :
Liste des valeurs possibles

h
Bouton Enregistrer les paramtres du champ

h h
Cochez la case Champ Requis Choisissez Femme comme Valeur par dfaut
137
Paramtres du champ
Remarquez galement que Drupal associe automatiquement chaque ligne un entier qui sera sauvegard dans la base de donnes.
Association dun entier par ligne

h
Vous pouvez maintenant aller dans le profil de ladministrateur et y indiquer si vous tes un Homme ou une Femme :
h h h
Lien Bonjour Admin (en haut de la page) Onglet Modifier En bas, section Sexe
138
Nouveau champ du profil
Loption Femme sera choisie par dfaut uniquement lors de la cration de nouveaux profils.
h h
Bouton Enregistrer Onglet Voir
Un profil utilisateur et son nouveau champ.
4.4.2 Ajout dun champ un terme de Taxonomie

Il est possible dajouter des champs aux vocabulaires de taxonomie. Il est par exemple possible dillustrer le Vocabulaire difficult avec des toques (1 toque => Trs facile, 2 toques => Facile, etc.).
Page dun terme avec image
139
h h h h h h
Menu Structure lien Taxonomie Lien modifier le vocabulaire du vocabulaire Difficult Onglet Grer les champs Etiquette : Illustration Nom du champ : illustration Type de donnes stocker : Image
Ajout dun champ un Vocabulaire

h h h h
Bouton Enregistrer Bouton Enregistrer les paramtres du champ Bouton Enregistrer les paramtres Retournez ensuite sur longlet Lister et ditez les un un en ajoutant les illustrations toque1.png, toque2.png, etc.
Ajout de lillustration au terme Facile
Les rdacteurs devront toujours choisir le terme dans la liste par contre, lorsque la node sera affiche, seule limage du terme sera elle aussi affiche. Il faut donc modifier laffichage des termes de taxonomie.
140
Notez quil existe un mode daffichage Page dun terme de taxonomie pour grer laffichage dun vocabulaire sur les pages de Taxonomie. Pour afficher les images de taxonomie dans les pages de contenu, il faut utiliser des vues ou des fonctions de thme.
4.4.3 Exercice : ajout dun champ de taxonomie aux commentaires

Crez un champ qui permet aux visiteurs dindiquer le type de commentaire quils postent.
Choix dun type de commentaire
Crer un vocabulaire de Taxonomie Type de commentaire contenant les termes Question, Rponse une question, Suggestion pour la recette, Autres ; ajouter un champ aux commentaires du type de contenu Recette (et uniquement celui-l) en les mettant en lien avec un terme du vocabulaire Type de commentaire ; crer deux commentaires en utilisant ces champs.
Corrig
Crer un vocabulaire
h h h h
Menu Structure lien Taxonomie Lien + Ajouter un vocabulaire Nom : Type de commentaire Ajouter les termes : Autres, Question, Rponse une question, Suggestion pour la recette
141
Les termes du vocabulaire Type de commentaire
Ajouter le champ Taxonomie aux commentaires La difficult ici consiste trouver lendroit o ajouter un champ un commentaire. Les commentaires sont configurs selon le type de contenu auquel ils sont associs. Cest donc sur la page de configuration du type de contenu Recette quil faut se rendre
h h
Menu Structure lien type de contenu Lien modifier du type Recette
Gestion des champs des commentaires lis une recette

h h h h h
Onglet Comment Fields tiquette : Type de commentaire Nom du champ : type_commentaire Type de donnes stocker : Rfrence un terme lment du formulaire pour ldition des donnes : Liste de slection
142
Ajout du champ au commentaire

h h h h h
Bouton Enregistrer Vocabulaire Type de commentaire Bouton Enregistrer les paramtres du champ Cocher Champ requis Bouton Enregistrer les paramtres Afficher une recette (par exemple celle des Gnocchis) Crer un commentaire en choisissant son type
Crer deux commentaires en utilisant ces champs

h h
Ajout dun commentaire et choix du type
4.4.4 Page de Rapport des champs dun site

Tout au long de ce chapitre, vous avez ajout un grand nombre de champs se rapportant diffrentes entits (node, type de nodes, Commentaire, Terme de taxonomie, Utilisateur). Une page listant lensemble de ces champs et leur utilisation permet de mieux savoir comment est organis votre site.
143
Menu Rapports lien Liste de champs
Page de liste des champs
Pouvoir ajouter des champs aux diffrentes entits est une fonctionnalit centrale de Drupal. Ceux-ci peuvent ensuite tre utiliss avec les modules views ou Display Suite ou encore dans les thmes.
145
Chapitre
III
Administration systme de Drupal
D
III Administration systme de Drupal
ans cette partie, vous allez configurer les diffrentes applications qui permettent de faire fonctionner Drupal : le serveur web Apache, le langage Php et la base de donnes MySQL. Il nest bien sr pas question de traiter en profondeur ces sujets, mais de configurer les fonctionnalits qui auront une incidence sur le fonctionnement de Drupal. Vous apprendrez galement sauvegarder, restaurer et mettre jour un site web Drupal. Ensuite, vous dcouvrirez les outils qui peuvent vous faciliter ladministration de Drupal. Pour finir, vous verrez comment sont organises les donnes de Drupal. Peut-tre ntes vous pas trs intress par la configuration de Drupal, dans ce cas, vous pouvez trs bien vous affranchir de la lecture dune bonne partie de ce chapitre. Cependant, avant de passer la partie suivante, il est conseill au moins dactiver les URLs simplifis comme indiqu au chap. III 1.1 Configuration de Apache.
146
III - Administration systme de Drupal
1
1.1
Configuration de Apache PHP MySQL

Configuration de Apache
Drupal peut sexcuter sur de nombreux serveurs HTTP, mais ici, seule la configuration dApache, qui est le serveur le plus populaire, sera tudie.
1.1.1 Les URLs Simplifies

Par dfaut la forme des URLs de Drupal est :
http://localhost/drupal/?q=node/2
Dans cet exemple, node/2 sont les arguments qui sont envoys Drupal. Si les URLs simplifies sont actives, elles prennent la forme suivante :
http://localhost/drupal/node/2
On enlve ainsi le ?q=. Cela peut paratre tre un dtail, mais il est recommand dactiver les URLs simplifis pour plusieurs raisons : certains modules ne fonctionnent pas sans les URLs simplifis ; cela facilite la lecture pour les utilisateurs ; certains moteurs de recherche indexent mieux les sites avec URLs simplifis.
Activer le mod_rewrite dApache

Pour pouvoir activer les URLs simplifis, il faut que le module mod_rewrite dApache soit aussi activ.
h
Sous Windows avec WampServer faites un clic gauche sur licne de notification puis aller dans Apache Modules Apache rewrite_module
Activer le mod_rewrite avec WampServer
1 - Configuration de Apache PHP MySQL
147
h h h
Sous Linux Ubuntu, activez le mod_rewrite grce la ligne de commande

sudo a2enmod rewrite
Puis modifiez le fichier de configuration dApache situ dans le rpertoire de Drupal :

sudo gedit /etc/apache2/apache2.conf
Ajoutez la fin de ce fichier les lignes suivantes :

<Directory /var/www/drupal> AllowOverride all </Directory>
Redmarrez apache
sudo /etc/init.d/apache2 restart
Activer les URLs simplifies dans Drupal

h
Ensuite, dans Drupal, menu Configuration lien URL simplifies (section Recherche et Metadonnes)
Si vous ne pouvez pas choisir Activ, cest que le test na pas russi et quil y a un problme dans votre configuration.
h
Cliquez sur Activ Si le module mod_rewrite est activ lors de linstallation de Drupal, les URLs simplifies sont actives par dfaut.
Les URLs simplifis peuvent tre actives

h
Cliquez sur le bouton Enregistrer la configuration. Si un moment vous rencontrez un problme avec une URL, vous pouvez accder la page de dsactivation grce ladresse : http://localhost/drupal/?q=admin/config/search/clean-urls
Chap. II 2.4 Path : LAlias dURLs
Chap. IV 4.3 Pathauto : Automatisez la cration de vos Alias
148
1.1.2 Les htes virtuels

Crer un hte virtuel sur votre serveur apache vous permettra daccder Drupal directement en entrant ladresse http://drupal.tld plutt que http://localhost/drupal. Ainsi votre site sera plus facile configurer et copier vers le serveur de votre hbergeur. Cela permet galement dhberger plusieurs sites Web sur un mme serveur facilement.
Configuration du fichier hosts

Sous Windows ditez le fichier %windir%\System32\Drivers\etc\hosts (typiquement : C:\Windows\System32\drivers\etc) et ajoutez la ligne :
127.0.0.1 drupal.tld
Attention, ce fichier peut tre en lecture seule pour des raisons de scurit, changez ses droits (clic droit Proprits) en criture avant de lditer et protgez le nouveau aprs modification. Sous Linux
sudo gedit /etc/hosts
et ajoutez la ligne :
127.0.0.1 drupal.tld
Configuration de Apache
Sous Windows
h h h h
Avec WampServer, faites un clic gauche sur licne de notification puis choisir Apache httpd.conf Recherchez la ligne :
#Include conf/extra/httpd-vhosts.conf
Dcommentez-la (enlevez le # devant) Sauvegardez le fichier Ajoutez les lignes suivantes au fichier C:\wamp\bin\apache\apache2.2.17\conf\extra\httpd-vhosts.conf
<VirtualHost *:80> DocumentRoot c:/wamp/www ServerName localhost </VirtualHost> <VirtualHost *:80> DocumentRoot c:/wamp/www/drupal ServerName drupal.tld </VirtualHost>
Apache cherchera dans le fichier httpd-vhosts.conf les vhosts installs

h
Le premier VirtualHost permettra ladresse http://localhost de fonctionner (pour accder phpMyAdmin par exemple). Le second permettra ladresse http://drupal.tld de pointer directement vers votre site Drupal.
h
Noubliez pas de redmarrer Apache (clic gauche sur licne de notification et Redmarrer les services)
149
Sous Linux
h h
Crez un nouveau fichier avec la commande :

sudo gedit /etc/apache2/sites-enabled/drupal.conf
Insrez-y les lignes suivantes :

<VirtualHost *:80> DocumentRoot /var/www/drupal ServerName drupal.tld </VirtualHost>
Redmarrez apache :
Vrification du bon fonctionnement

Allez ladresse http://drupal.tld, vous devriez voir apparatre votre page daccueil Drupal. Vrifiez galement que ladresse http://localhost, affiche la page daccueil de WampServer.
Le virtualhost drupal.tld fonctionne
Vous navez ici configur que le minimum de paramtres des VirtualHosts pour quils fonctionnent avec Drupal. Apache tant trs complet, il comprend un grand nombre de paramtres supplmentaires. Voyez la documentation Apache pour plus dinformations. Vous pouvez lancer une commande Apache pour connatre la configuration de vos virtual hosts (pratique si cela ne fonctionne pas du premier coup) : Sous Windows : Dans une Invite de commandes Sous Linux :
c:\wamp\bin\apache\apache2.2.17\bin\httpd.exe -S apache2 -S
150
1.2
Configuration de PHP
PHP est le langage de script avec lequel Drupal est dvelopp. PHP est correctement configur par dfaut avec Wampserver ou Linux Ubuntu pour le bon fonctionnement de Drupal. Toutefois, voici les quelques variables que vous pourriez avoir besoin dajuster dans le fichier php.ini. Sous Windows :
h
Cliquez avec le bouton gauche sur licne de notification de WampServer puis aller dans Php php. ini pour diter php.ini.
Raccourci WampServer vers php.ini
Sous Linux : Pour diter php.ini :

sudo gedit /etc/php5/apache2/php.ini
Les paramtres utiles pour Drupal

memory_limit : votre besoin pour Drupal dpend des modules chargs. 128 Mo est recommand. 64 Mo est un minimum. Aujourdhui les machines ont de plus en plus de RAM, nhsitez pas augmenter cette valeur si vous constatez une baisse de performance de Drupal ou des erreurs frquentes lors du chargement des pages. post_max_size : cest la limite de taille denvoi dun seul fichier par la mthode POST. 2M est une bonne valeur si vous limitez les fichiers envoyer des images. Cela peut devenir insuffisant si vous permettez denvoyer des vidos. Si vous augmentez post_max_size, pensez aussi augmenter upload_max_size.
post_max_size et upload_max_size 32M
151
Pour avoir plus dinformations sur la version de Php installe et des modules activs, rendezvous sur menu Rapports lien Tableau de bord et cliquez sur le lien en face de la vrification PHP : la page phpinfo.php saffichera (chap. II 1.6 Tableau de bord)
1.3
Configuration de MySQL
Comme pour le serveur web Apache, Drupal peut fonctionner avec diffrents serveurs de base de donnes grce lutilisation dune couche logicielle dabstraction. Cependant, les explications de ce livre se limiteront MySQL qui est actuellement le serveur le plus utilis avec Drupal.
1.3.1 Configuration de la base de donnes utilise par Drupal

la quatrime tape du processus dinstallation de Drupal, vous avez entr les informations relatives la base de donnes.
Installation de la base de donnes
Ces informations sont stockes dans le fichier settings.php, il est possible de modifier ces informations : Sous Windows :
h
ditez le fichier C:\wamp\www\drupal\sites\default\settings.php Sous Windows, si vous ne percevez pas les retours la ligne dans votre diteur (par exemple Notepad), utilisez un diteur plus avanc (Notepad++ http://notepad-plus-plus.org/).
Sous Linux :
h
sudo gedit /var/www/drupal/sites/default/settings.php
Dans le fichier settings.php, cherchez la ligne $databases, voici quoi doit ressembler cette variable pour votre installation
152
$databases = array ( 'default' => array ( 'default' => array ( 'database' => 'drupal', 'username' => 'root', 'password' => '', 'host' => 'localhost', 'port' => '', 'driver' => 'mysql', 'prefix' => '', ), ), );
Il est possible de dfinir des configurations de base de donnes extrmement complexes avec Drupal. Vous pouvez par exemple avoir deux sites Drupal qui partagent leurs utilisateurs mais qui ont leurs donnes propres. Voici les paramtres principaux permettant de configurer la variable $databases : 'database' 'username' 'password' 'host' 'port' 'driver' 'prefix' Nom de la base de donnes utiliser Nom dutilisateur de la base de donnes Mot de passe de lutilisateur Adresse du serveur de base de donnes, le serveur de base de donnes peut-tre diffrent du serveur hbergeant Drupal Port utilis par le serveur de base de donnes (3306 par dfaut pour MySQL) Type de serveur de base de donnes utilis (mysql, pgsql, sqlite, etc.) Il est possible dutiliser un prfixe pour chaque table Lors de linstallations un onglet Options avances permet de rgler certains des paramtres ci-dessus
Options avances de linstallateur
153
1.3.2 Cration dun utilisateur MySQL pour la base Drupal

Lors du processus dinstallation de Drupal, lutilisateur root tait utilis pour crer la base SQL de Drupal. Cela peut poser des problmes de scurit surtout quavec Wampserver, lutilisateur root est sans mot de passe par dfaut ! Il est donc conseill de crer un utilisateur spcifique pour la base de donnes utilise par Drupal. Pour cela, comme pour toutes les manipulations que vous allez faire sur la base de donnes, vous utiliserez loutil phpMyAdmin qui permet de grer facilement des bases de donnes MySQL et qui est trs souvent propos par les hbergeurs.
h h
Rendez-vous ladresse http://localhost/phpmyadmin Connectez-vous avec lutilisateur root/atelierdrupal (si vous avez suivi lexemple chap. I Dmarrage rapide) Onglet Privilges (sur la page daccueil de phpMyAdmin, sans avoir slectionn de base au pralable) Lien Ajouter un utilisateur Entrez un Nom dutilisateur : drupal, par exemple Choisissez Local pour le Serveur : mme si vous accdez Drupal depuis une autre machine, Drupal utilisera la base de donnes en local. Bien-sr, il est possible dinstaller votre base de donnes Drupal sur un autre serveur que votre serveur web. Ce cas ne sera pas trait ici. Choisissez un Mot de passe, atelierdrupal par exemple Ne touchez rien dautre et cliquez sur le bouton Excuter tout en bas de la page
h h h h
h h
Cration dun utilisateur avec PhpMyAdmin
La page se recharge alors.

h
la section Privilges spcifiques une base de donnes choisissez la base de donnes drupal
Modification des privilges pour lutilisateur de la base
154
La page se recharge une nouvelle fois et affiche les privilges donner pour votre seule base drupal.
h
Lien Tout cocher
Ajout des permissions dun utilisateur pour une base de donnes

h
Bouton Excuter Lors de votre prochaine installation de Drupal, vous pouvez ajouter directement un nouvel utilisateur et cocher loption Crer une base portant son nom et donner cet utilisateur tous les privilges sur cette base.
Il faut maintenant modifier les paramtres du fichier de configuration de Drupal pour changer le nom dutilisateur qui accdera la base.
h h h
ditez le fichier sites/default/settings.php Recherchez la ligne dfinissant la variable $databases Modifiez la comme dans le code suivant
$databases = array ( 'default' => array ( 'default' => array ( 'database' => 'drupal', 'username' => 'drupal', 'password' => 'atelierdrupal', 'host' => 'localhost', 'port' => '', 'driver' => 'mysql', 'prefix' => '', ), ), );
155
Le fichier settings.php est en lecture seule. Il faut donc changer ses droits daccs. Noubliez pas de le remettre en lecture seule lorsque vous aurez appliqu les changements. Il y a par dfaut deux autres bases de donnes existantes en plus de celle de Drupal. Ce sont les bases qui permettent de faire fonctionner le gestionnaire MySQL, il ne faut donc jamais les effacer.
Liste des bases de MySQL
1.4
Choisir un hbergeur
Il est possible dhberger son site sur une machine relie Internet. Cependant, la majorit des administrateurs prfrent faire appel un hbergeur pour y louer un serveur ou une partie dun serveur. Vous aurez alors le choix entre trois solutions dhbergement : un serveur ddi, du cloud computing (infrastructure en nuages) ou un serveur mutualis. Bien souvent, les hbergeurs proposant des solutions mutualises offrent une interface dadministration qui permet dinstaller et de configurer votre serveur simplement. Avec un serveur mutualis, vous naurez pas configurer et scuriser votre systme de A Z comme avec un serveur ddi. Gnralement la solution du serveur mutualis est moins coteuse, mais aussi moins performante (vous partagez les ressources du serveur avec dautres sites), il faut donc faire particulirement attention au systme minimum requis par Drupal car il est impossible de le faire voluer par vous mme. Le cloud computing est une solution intermdiaire qui se comporte, au niveau logiciel, comme un serveur ddi.
156
1.4.1 Serveur Web

La plupart des utilisateurs de Drupal utilisent le serveur WEB Apache. Pourtant, Drupal peut aussi fonctionner sur IIS, LightHTTP ou autre puisquil a t programm pour tre indpendant du serveur WEB. Sachez cependant que la solution Drupal + Apache est la plus prouve. Pour pouvoir activer les URLs simplifis, il faut que le module mod_rewrite soit ou puisse tre activ sur Apache. Drupal 7 fonctionnera avec Apache 1.3 minimum.
1.4.2 PHP
Lutilisation de PHP 5.3 ou suprieur est recommand par Drupal. En thorie, PHP 5.2.5 suffit. La mmoire minimum allouer PHP est de 32MB, mais, selon les modules activs et lactivit de votre site, il sera ncessaire daugmenter cette valeur. Les bibliothque PHP suivantes doivent tre actives : GD (Gif Draw Dessiner des GIF) pour la gestion des images ; PDO pour PHP pour la gestion des bases de donnes.
1.4.3 Base de donnes

Drupal peut utiliser les logiciels de base de donnes MySQL 5.0.15 ou suprieur, ou PostgreSQL 8.3 ou suprieur. Bien que PostgreSQL soit reconnu comme tant un trs bon logiciel, MySQL, comme Apache reste prfr par la plupart des utilisateurs de Drupal.
1.5
Configuration du serveur pour lenvoi de mail
Drupal doit pouvoir envoyer des courriels pour effectuer certaines tches : validation du courriel dun nouvel utilisateur, rcupration dun mot de passe, alerter ladministrateur du systme dvnements particuliers, envoi dune newsletters, etc. Lenvoi de courriels se fait grce un serveur SMTP (Simple Mail Transfer Protocol ou Protocole simple de transfert de courrier ). Si vous travaillez en local sur votre machine, vous pouvez utiliser le SMTP de votre fournisseur daccs (exemples : smtp.free.fr, smtp.orange.fr, etc.). Si vous travaillez sur un serveur ddi ou mutualis, utilisez le smtp de votre fournisseur de mail (smtp.laposte.net, smtp.mondomaine.com, etc.).
1.5.1 Configuration de Windows avec WampServer

Sous Windows, il suffit de modifier un paramtre dans le fichier php.ini pour indiquer Drupal quel serveur SMTP utiliser:
h h h
Cliquez avec le bouton gauche de la souris sur licne de WampServer Choisissez dans le menu PHP php.ini Recherchez le paramtre SMTP dans la section [mail function]
157
Modification du SMTP dans le fichier

h h h h
Entrez le nom de votre serveur SMTP Modifiez galement le paramtre sendmail_from (qui sera ladresse de des mails envoys). Sauvegardez le fichier Redmarrez WampServer en cliquant sur licne avec le bouton gauche Redmarrer les services
Testez votre installation comme indiqu (chap. III 1.5.4 Test de linstallation).
1.5.2 Configuration de Linux avec SSMTP

SSMTP est trs simple configurer pour permettre au systme denvoyer des mails :
h h h
Installation de SSMTP
sudo apt-get install ssmtp
Editez le fichier de configuration de SSMTP :

sudo gedit /etc/ssmtp/ssmtp.conf
Modifiez les champs ainsi

root=contact@atelierdrupal.net #Votre adresse email mailhub=smtp.free.fr #SMTP utilis rewriteDomain=free.fr #Domaine utilis hostname=cyp-drupal #Nom de votre machine FromLineOverride=YES #Pour que la ligne from contienne l'adresse mail de l'administrateur de Drupal
Sauvegardez le fichier
Testez votre installation comme indiqu la fin de ce chapitre.
1.5.3 Configuration de Linux avec Postfix

Vous pouvez galement utiliser Postfix qui peut en faire plus que SSMTP, mais avec qui il ne peut pas cohabiter
h
Installez Postfix.
sudo apt-get install postfix
158
h h
la question Configuration type du serveur de messagerie, choisir Site Internet. la question Nom de courrier, entrez le nom de domaine de votre mail (si votre mail est contact@atelierdrupal.net, entrez atelierdrupal.net). Editez le fichier main.cf :
sudo gedit /etc/postfix/main.cf
h h h
Compltez le paramtre relayhost par le nom de votre STMP entre crochets :

relayhost = [smtp.free.fr]
Enfin, redmarrez postfix

sudo /etc/init.d/postfix restart
1.5.4 Test de linstallation

Votre installation doit maintenant fonctionner, vous pouvez la tester en crant un nouveau compte utilisateur (chap. II 2.3 User : gestion des utilisateurs). Pour modifier ladresse 'de' des mails envoys sous Drupal, utilisez la page menu Configuration lien Informations
Adresse mail des mails envoys par Drupal sous Linux
Sauvegarde / Restauration
sauvegarde de lintgralit des fichiers de Drupal ; sauvegarde de la base de donnes.
La sauvegarde de Drupal se droule en deux temps :
La base de donnes de Drupal contient les donnes du site (contenu des nodes, paramtres des utilisateurs) mais galement sa structure (types de contenus, taxonomie) et ses options de configuration. Le systme de fichiers contient lui le code de Drupal (modules et coeur de Drupal) mais galement certains fichiers lis au contenu (images des nodes).
2 - Sauvegarde / Restauration
159
2.1
Sauvegarde / Restauration de larborescence de fichiers
2.1.1 Avec un gestionnaire de fichiers

Rien de difficile dans cette tche, il sagit seulement de sauvegarder un rpertoire.
Sauvegarde
Sauvegarder les fichiers de Drupal avec un gestionnaire de fichiers se fait en trois clics.
h h
Clic droit sur le dossier C:\wamp\www\drupal ou /home/drupal/drupal Dans le menu contextuel Choisir Copier
Sauvegarde de larborescence sous Windows

h
Puis Coller le rpertoire un autre endroit de larborescence
Restauration
h h h
Clic droit sur le dossier de sauvegarde Dans le menu contextuel Choisir Copier Puis Coller le rpertoire dans C:\wamp\www ou /home/drupal Vous pouvez utiliser un gestionnaire darchive (zip ou tar.gz) pour navoir quun seul fichier compress pour larborescence
2.1.2 En ligne de commande avec Linux

Il est bien souvent ncessaire dautomatiser la sauvegarde pou un site de production sur un serveur ddi. Voici les lignes de commandes pour Linux : Cre une archive drupal.tar.gz du rpertoire /home/atelier/drupal
tar -czvf /home/atelier/drupal.tar.gz /home/atelier/drupal
Extrait cette archive :

cd / tar zxvf /home/atelier/drupal.tar.gz
160
La commande tar possde une multitude doptions permettant de ladapter vos besoins. Nhsitez pas lire sa page de manuel.
2.2
Sauvegarde / Restauration de la base de donnes
2.2.1 Avec phpMyAdmin

Sauvegarde de la BDD avec phpMyAdmin
Il est possible de sauvegarder / restaurer sa base de donnes graphiquement grce phpMyAdmin.
h h
Connectez-vous sur phpMyAdmin : http://localhost/phpmyadmin/ Choisissez la base de donnes que vous voulez sauvegarder dans la liste sur la gauche, drupal, si vous avez suivi lexemple de ce livre Cliquez sur longlet Exporter. Les paramtres par dfaut devraient tre les bons : le format doit tre SQL. Structure et Donnes doivent tre coches.
Interface dexport dune base sur PhpMyAdmin

h h
En bas de page, cochez Transmettre Choisissez aussi gzipp pour gagner du temps et de lespace disque (ou zipp sous Windows)
161
Paramtres du fichier transmettre
Le format bzipp est plus performant mais nest pas toujours disponible.
h h
Cliquez sur Excuter Tlchargez le fichier sur votre disque local Le fichier sauvegard est une archive contenant une longue requte SQL excuter pour crer la structure de la base et y insrer ses donnes. Vous pouvez lditer pour mieux comprendre son fonctionnement.
Restauration de la BDD avec phpMyAdmin

h
Connectez-vous sur phpMyAdmin : http://localhost/phpmyadmin/ Dans la zone Crer une base de donnes, entrez le nom de la base crer Bouton Crer Cliquez sur longlet Importer Cliquez sur le bouton Parcourir, choisissez le fichier prcdemment tlcharg
Il faut crer une base de donnes dans laquelle vous voulez restaurer les donnes.
h h
Vrfiez que vous tes bien dans la base o vous voulez restaurer les donnes.
h h
Restauration de la base de donnes

h
Cliquez sur Excuter.
162
Vous pouvez augmenter la taille maximum du fichier importer en modifiant les paramtres de php.ini (chap. III 1.2 Configuration de PHP). Si votre importation choue cause dune limite de temps dpasse (timeout), rechargez la page, limportation continuera o elle sest interrompue.
2.2.2 En ligne de commande avec MySQL

Faire ses sauvegardes par phpMyAdmin est simple mais comporte des dsavantages : phpMyAdmin nest pas toujours install ; il nest pas possible de programmer des sauvegardes automatiques ; il gnre parfois des erreurs ; il faut tlcharger un fichier qui peut tre volumineux. Pour toutes ces raisons, il est parfois prfrable de passer par la ligne de commande.
Sauvegarde de la BDD en ligne de commande

Voici la ligne de commande pour sauvegarder la base (attention, le mot de passe est en clair dans le script) :
mysqldump --user=root --password=atelierdrupal drupal>drupal.sql
Restauration de la BDD en ligne de commande

Pour restaurer la base sauvegarde dans un autre base (drupal-test) :
mysql --user=root --password=atelierdrupal drupal-test<drupal.sql
Pour que la commande ci-dessus fonctionne, il faut que la base drupal-test existe. Pour la crer en ligne de commande, vous pouvez crer un fichier sql (exemple : script.sql) contenant les requtes que vous dsirez excuter :
DROP DATABASE drupal-test CREATE DATABASE drupal-test
Puis excuter ce fichier avec la commande :

mysql --user=root --password=atelierdrupal drupal-test<script.sql
2.3 Backup and Migrate : sauvegardez votre base de donnes

VI Description des modules utiles de Drupal
Ce module permet de sauvegarder, directement partir de linterface de Drupal, votre base de donnes. Vous pouvez galement programmer des sauvegardes automatiques intervalles de temps rguliers.
163
Ce module permet de sauvegarder uniquement la base de donnes et pas larborescence de fichiers. Veillez bien sauvegarder lensemble des donnes de votre site (chap. III 2 Sauvegarde/restauration de l'arborescence de fichiers).
h
Installez et activez le module (version utilise pour ce livre 7.x-2.1) http://drupal.org/project/backup_ migrate Menu Configuration lien Sauvegarder et migrer
2.3.1 Onglet Backup

Cet onglet permet de sauvegarder immdiatement votre base de donnes, il propose deux modes, le Quick Backup (sauvegarde rapide) et le Advanced Backup (sauvegarde avance).
Quick Backup
Trois listes droulantes permettent de slectionner la base sauvegarder, lemplacement et le profil. Par dfaut il ny a quune seule possibilit pour chacune des listes.
h
Bouton Backup now
Quick Backup
164
Advanced Backup
h
Bouton Advanced Backup (de longlet Backup)
Plusieurs sections permettent de configurer la sauvegarde : Load Settings Backup file Choix dun profil Backup and Migrate. Configuration du nom du fichier, du format de la date dans le nom du fichier et du mode de compression du fichier. Permet dexclure la sauvegarde de la structure et des donnes de certaines tables (premire liste) ou uniquement les donnes de certaines tables (deuxime liste). Cela peut-tre utile pour les tables de cache. Une option Lock tables during backup permet de verrouiller la base de donnes pendant la sauvegarde. Configuration de lenvoi de courriels en cas de succs ou dchec. Permet de choisir lemplacement des sauvegardes ralises. Longlet Destinations ajoute des lments la liste. Enregistre les options de la page pour une prochaine sauvegarde
Database Options
Advanced Options Backup Destination Enregistrer ces paramtres
2.3.2 Onglet Restaurer

Cet onglet permet de restaurer un fichier de type *.sql ou *.sql.gz ou *.sql.zip. Il peut avoir t cr par Backup and Migrate ou bien via lune des mthodes dcrites au chapitre prcdent. Inversement, il est possible de restaurer les fichiers crs par Backup and Migrate via phpMyAdmin ou la commande mysql.
2.3.3 Onglet Destinations

Une destination est un emplacement o le module peut crer ou restaurer des fichiers de sauvegarde. La base de donnes quutilise Drupal est galement un emplacement pour Backup and migrate (Default Database).
h
Lien + Add destination
Vous pouvez configurer diffrents types demplacement : Server Directory MySQL Database FTP directory Amazon S3 Bucket Courriel Permet au module de sauvegarder dans un autre rpertoire du serveur WEB. Le serveur WEB doit avoir les droits dcriture sur ce rpertoire. Configuration du nom du fichier de la sauvegarde. Ajout dun emplacement sur un serveur FTP. Service de stockage en ligne dAmazon (http://aws.amazon.com/fr/s3/). Permet denvoyer les sauvegardes par mail.
165
Ajout dun emplacement FTP
Liste des emplacements disponibles
2.3.4 Onglet Profils

Un profil permet de runir le nom dune sauvegarde, son type de compression, les tables exclure et les mails envoyer. Vous pourriez par exemple dfinir un nouveau profil qui sauvegardera uniquement les donnes utilisateurs en slectionnant la table users.
166
Cration dun nouveau profil
2.3.5 Onglet Schedules

Cet onglet permet de programmer lexcution des sauvegardes automatiques.
Ce message indique quil faut dfinir un chemin vers le systme priv de fichier. Pour cela, cliquez sur le menu Configuration lien Systme de fichiers ou sur le lien contenu dans le message affich par Backup and Migrate.
Ajout du chemin
Vous pouvez galement utiliser une autre destination (chap. III 2.3.3. Onglet destination).
h
Lien + Add Schedule
167
Page dajout dune sauvegarde automatique
Voici les diffrents champs remplir : Activ Settings Profile Sauvegarder toutes les Nombre de sauvegardes conserver Destination Si la case est dcoche, la sauvegarde ne seffectuera pas. Choix dun profil cr dans longlet Profils. Frquence de sauvegarde. Indiquer ici le nombre de sauvegardes conserver avant que la plus ancienne ne soit supprime. Pour la copie dcran prcdente, les sauvegardes seront gardes 3 heures au maximum. Choix de la destination de la sauvegarde cre dans longlet Destinations.
Liste des sauvegardes automatiques dfinies
168
2.4
Features : transfrez la configuration de votre site
La base de donnes de Drupal regroupe la fois le contenu du site (utilisateurs, nodes, etc.) et galement sa configuration (types de contenus, vues, taxonomie). Cela pose problme lorsquun site est en production, que du contenu y est rgulirement ajout par des utilisateurs et que dans le mme temps des fonctionnalits doivent y tre ajouts. Vous navez pas le choix : vous devez travailler directement en production. Le module Features tente de combler cette faiblesse en permettant dexporter des composants dun site vers un autre. Ces composants peuvent tre un type de contenu, un vocabulaire, une vue, etc. Le module transforme alors lensemble des composants slectionns en un module Drupal que vous pouvez installer sur un autre site. Pour raliser lexemple suivant, il faut que vous ayez deux sites Drupal sur votre installation. Le premier sera le site de test sur lequel vous effectuerez vos dveloppements, le second le site de production sur lequel vous installerez les modules du site de test crs par Features. Voici les sauvegardes qui seront utilises pour les exemples de ce chapitre : site de test : sauvegarde aprs Content UI ; site de production : installation aprs Partie I. Le but de cet exemple est de transfrer les composants suivants du site de test vers le site de production : le type de contenu recette, les vocabulaires de taxonomie difficult et provenance, le menu liens divers.
Cration dune fonctionnalit

h
Sur le site de test, tlchargez et activez le module Features (http://drupal.org/project/features) Version utilise pour ce livre 7.x-1.0-beta3 Menu Structure lien Fonctionnalits Lien Crer une fonctionnalit Nom : vos toques partie 2 Description : Fonctionnalits de la partie 2 du livre Atelier Drupal 7 Version : 7.x-1.0 Dans la liste Editer les composants, choisissez Types de contenu Cochez Recette
Allez sur la page de configuration de Features :

h h
Dfinissez les caractristiques du module features qui sera cr :

h h h
Vous devez ajouter des composants :

h h
169
Ajout dun type de contenu
Dans la partie droite de lcran, saffichent toutes les dpendances du composant slectionn. Ici, les champs du type de contenu sont automatiquement ajouts. Ajoutez les vocabulaires de taxonomie :
h h
Dans la liste Editer les composants, choisissez Taxonomie Cochez Difficult et Provenance Dans la liste Editer les composants, choisissez Menus Cochez Liens divers
Et enfin le menu :
h h
La fonctionnalit est complte

h
Bouton Tlchager la fonctionnalit
Il vous est alors propos de tlcharger un fichier .tar (archive) qui contient le module Drupal.
170
Installation du module cr
Sur le site de production, installez le module A vos toques partie 2 prcdemment tlcharg :
h
Extrayez le module dans le rpertoire sites\all\modules\ de votre site de production (vous devriez obtenir un rpertoire sites\all\modules\a_vos_toques_partie_2) Menu Modules
la section Features, le module doit apparatre :
Le module cr
h h
Installez les dpendances (Features et Email) Activez le module A vos toques partie 2
Vous pouvez maintenant constater que le type de contenu, les vocabulaires et le menu ont t crs lors de linstallation du module. Vous pouvez activer le module via la page de configuration de Features :
h
Menu Structure lien Fonctionnalits
Liste des fonctionnalits du site
Mise jour dune fonctionnalit

Vous possdez maintenant un site de test et un autre de production. Vous pouvez donc modifier le type de contenu recette sur le site de test et transfrer cette modification sur le site de production en proposant une mise jour de votre module cr par features. Il faut commencer par installer le module A vos toques partie 2 prcdemment cr sur le site de test. Lide tant ensuite de le recrer lorsque des mises jours seront faites sur le type de contenu.
h
Extrayez le module dans le rpertoire sites\all\modules\ de votre site de test
171
Activez par linterface de features :

h h h
Menu Structure lien Fonctionnalits Cochez la case A vos toques partie 2 Bouton Enregistrer les paramtres Menu Structure lien Types de contenu Lien grer laffichage du type de contenu Recette Inversez lordre des champs Temps de prparation et Prix par personne Bouton Enregistrer Menu Structure lien Fonctionnalits
Puis modifiez le type de contenu Recette :

h h h h
Il faut maintenant recrer votre module :

h
Ltat de la fonctionnalit est maintenant Supplant, cest dire quelle a t modifie.
Cette fonctionnalit a t modifie

h h h
Lien Recrer Version : 7.x-1.1 Bouton Tlchager la fonctionnalit Extrayez le module dans le rpertoire sites\all\modules\ de votre site de production en remplacement de lancien (vous pouvez craser directement les fichiers) Menu Structure lien Fonctionnalits Dcochez loption du module pour le dsactiver Ractivez le module
Mettez jour votre fonctionnalit sur le site de production :

h
h h h
Ainsi, la modification a t applique sur le site de production. Le module Features tente de pallier un dfaut bien connu de Drupal. Il est parfois dlicat utiliser et nest pas parfait. Un groupe de travail a t lanc pour que ce module ne soit plus ncessaire avec Drupal 8.
172
2.5
Sauvegarde / restauration dune vue
Le module Views propose un systme de Restauration / Sauvegarde trs simple utiliser.
Exporter une vue

h h
Menu Structure lien Views Cliquez sur le lien Exporter dune vue
Copiez le code de la zone de texte Exporter
Exporter une vue
Vous pouvez maintenant coller ce script dans un diteur de texte et sauvegarder le fichier.
Importer une vue

h h h h
Menu Structure lien Views Lien + Importer Entrez le nom de la vue Collez le code prcdemment sauvegard dans la zone Paste view code here
Importer une vue

h
Bouton Importer
3 - Outils dadministration
173
3
3.1
Outils dadministration
Optimisation des performances
Drupal est parfois critiqu pour le nombre de requtes SQL quil gnre pour laffichage dune page. Il propose pourtant un systme de cache efficace et facile configurer qui permet damliorer ses performances. Lorsque le cache est activ, Drupal enregistre dans la base de donnes du code HTML gnr par PHP. Si une requte identique est rencontre par la suite, Drupal retourne alors directement le code HTML sans excuter nouveau le code PHP. Voici une description de la page qui permet doptimiser les performances dans Drupal :
h
Menu Configuration lien Performance Mme si aucune option nest active pour le cache des pages, Drupal utilise quand mme le cache pour les menus, les thmes, le systme de fichiers, etc. Donc, si vous faites des modifications sur un site et que ces modifications ne sont pas prises en compte, videz le cache.
Voici la liste des options disponibles pour la Mise en cache : Pages en mmoire cache pour les utilisateurs anonymes Cache des blocs Dure de vie minimale de la mmoire cache Expiration des pages en cache Les pages mises en caches dans leur intgralit sont servies uniquement pour les visiteurs anonymes. En effet, lorsque lutilisateur est identifi, il y a au moins le bloc affichant le nom de lutilisateur qui diffre. Si vous avez un site vitrine visit uniquement par des anonymes, cette option est fortement recommande pour amliorer les performances. Le code HTML des blocs peut ne pas varier dun utilisateur identifi lautre. Ce cache permet donc damliorer les performances pour un site communautaire. Temps minimum avant que les pages ne soient pas recres. Choisir <aucun> est une bonne solution ici. Dure de vie maximale dune page dans le cache.
Il est prfrable de nactiver aucune option de cette page lorsque votre site est en cours de dveloppement. Voici la liste des options disponibles pour lOptimisation de la bande passante : Compression des pages caches Compresser les donnes permet de gagner du temps de chargement des pages et dconomiser de la bande passante. Cette option permet de rduire la taille des fichiers CSS en les runissant en un seul et en supprimant les caractres de mise en forme (commentaires, retour la ligne, etc.). Cela peut-tre pnalisant lors du dveloppement de nouveaux thmes. Cela peut galement tre une bonne solution pour contourner la limite des 32 fichiers CSS dInternet Explorer. Idem loption prcdente mais pour les fichiers .js
Agrger et compresser les fichiers CSS
Agrger les fichiers Javascript
174
Il existe de nombreux projets visant crer du cache au niveau du serveur Apache : http://drupal.org/project/apc ; http://drupal.org/project/memcache.
3.2
Update Status : mettre jour Drupal
Le module Update Status vrifie rgulirement si votre installation (coeur de Drupal, modules installs et thmes installs) possde de nouvelles version disponibles sur drupal.org. Update Status peut ralentir laffichage de certaines pages de votre site, notamment la page Configuration. Vous pouvez dsactiver ce module pour retrouver une vitesse daffichage normale.
3.2.1 Mise jour des modules

Lorsque Update Status rencontre un problme de mise jour, un message saffiche en haut de diffrentes pages.
Message davertissement sur la page des modules

h
Vous pouvez en savoir plus sur le problme rencontr en cliquant sur le lien mises jour disponibles du message Menu Modules lien Mettre jour
Ou accder directement la page en cliquant sur :

h
175
Mise jour recommande pour Video Filter et conseille pour Adresse Field et Entity API
h h
Cochez les modules que vous souhaitez mettre jour Cliquez sur le bouton Tlcharger ces mises jour
Aprs le tlchargement et avant linstallation, il se peut que la nouvelle version du module impose une modification de la structure de la base de donnes. Drupal conseille alors de faire une sauvegarde de celle-ci.
Sauvegardez la base avant la mise jour

h
Cliquez sur le bouton Continuer
Une fois la mise jour effectue, Drupal propose un lien pour mettre jour la base si celle-ci doit tre modifie. Ne pas effectuer cette mise jour peut provoquer des erreurs de fonctionnement.
Installation russie mais mise jour de la base ncessaire

h
Lien Run database updates
176
Il est possible de faire les mises jour de la base en lanant lurl http://drupal.tld/update.php (drupal.tld tant ladresse de votre site).
h
Suivre les diffrentes tapes de la mise jour de la base
Votre module est alors mise jour !
3.2.2 Mise jour du coeur de Drupal

Le cur de drupal (Drupal et les modules installs par dfaut) ne peuvent tre mis jour automatiquement, Update Status le signale ainsi :
Une mise jour du coeur de Drupal est disponible

h h h h
Faites une sauvegarde de votre site en cas de problme lors de la mise jour Cliquez sur le lien Drupal core et tlchargez la dernire version Extrayez larchive dans le rpertoire de votre installation et crasez tous les fichiers Lancez le script de mise jour de la base de donnes Drupal en faisant pointer un navigateur vers le fichier update.php (http://localhost/drupal/update.php) Bouton Continue
Le script indique alors les mises jour qui seront appliques.
Mise jour de la base de donnes

h
Bouton Apply pending updates
Votre site est maintenant jour !
177
3.2.3 Configuration
Vous pouvez configurer le module Update Status via le lien suivant :
h
Menu Rapports lien Mises jour disponibles Onglet Paramtres
Saffiche alors le rapport complet de la vrification des mises jour de votre installation.
h
Cette page permet de dfinir la frquence de vrification, lenvoi de mail en fonction des mises jours trouves et si les modules installs mais non activs doivent tre vrifis.
3.2.4 Le mode maintenance

Lors de la mise jour de modules ou du cur de Drupal, il est prfrable de mettre votre site en mode maintenance. Ce mode permet aux visiteurs du site de voir une page dinformation plutt quune liste derreurs PHP.
Le site est en cours de maintenance

h
Pour configurer la page maintenance, menu Configuration lien Mode maintenance
Page de configuration du mode maintenance
Vous pouvez sur cette page mettre le site en mode maintenance et modifier le message dinformation. Si par accident, vous tes bloqu en mode maintenance, voici la requte SQL excuter pour en sortir (dans phpMyAdmin par exemple) :
UPDATE variable SET value = 's:1:"0"'; WHERE name= 'site_offline'; DELETE FROM cache WHERE cid = 'variables';
178
3.3
Le Cron
Cron est un programme qui permet dexcuter automatiquement des tches une date ou une heure spcifie lavance ou avec un intervalle de temps rgulier. Drupal a besoin dexcuter rgulirement des tches de maintenance : vrifier la prsence de mises jour, purger des fichiers de log et bien dautres choses demands par diffrents modules. Pour cela, Drupal utilise le programme cron. Pour excuter ces tches, vous pouvez cliquer sur le lien Vous pouvez lancer le cron manuellement depuis le tableau de bord. Cron peut-tre configur via la page :
h
Menu Configuration lien Cron
Page de configuration du Cron
Vous pouvez ici lancer manuellement le cron et configurer sa frquence de lancement automatique.
La base de donnes de Drupal
Ce chapitre prsente comment sont organises une partie des donnes de Drupal. Vous pouvez lire ce chapitre pour mieux comprendre le fonctionnement interne de Drupal ou pour pouvoir importer ou exporter des donnes depuis ou vers Drupal.
4.1
Gestion des utilisateurs
La gestion des utilisateurs dans Drupal a t dcrite au chap. II 2.3 User : gestion des utilisateurs. Les donnes des utilisateurs tant organises de faon simple, ce premier chapitre donnera les cls pour mieux comprendre les schmas de cet ouvrage par la suite. Une base de donnes est compose de tables, chaque table est compose de champs, et chaque champ contient des donnes.
4 - La base de donnes de Drupal
179
4.1.1 La table users

La table users contient les donnes relatives aux utilisateurs. uid 0 1 2 3 admin bertrand Benoit $P$C3L98Cx2qHW9r0XoLfsCXM4eBZ9KWh1 test@laposte.net $P$CGpxQP8ipe1066j.oFT7Vz0B5fdOQT1 $P$Cvez9GgGmZq/KjiYp4XTVTMueC79KR.
Extrait de la table users
name
pass
mail
bertrand@atelierdrupal.net benoit@atelierdrupal.net
Cette table contient le nom de lutilisateur (name), son mot de passe (pass), son mail, sa signature, son numro (uid), etc. Ces colonnes sont appels des champs. Dans cet exemple, il y a 4 utilisateurs, lutilisateur ayant le numro 1 est admin, le numro 2 est bertrand et il a pour mail bertrand@atelierdrupal.net. Chaque utilisateur possde un numro unique (uid) attribu par Drupal appel cl primaire. Le champ mot de passe n'est pas lisible directement dans la base pour des raisons de scurit (une personne pouvant lire la base ne peut ainsi pas connatre le mot de passe de l'administrateur de Drupal), il est crypt par la fonction drupal_hash_base64. La table Users et ses champs seront schmatiss ainsi :
La table users (gestion des utilisateurs)
Cette table contient dautres champs (language, signature, etc.) qui ne seront pas dtaills ici.
Exemple de requtes SQL

Une requte SQL interroge la base pour rcuprer une certaine partie des donnes. Par exemple, la requte suivante affiche le nom et le mail de chaque utilisateur :
SELECT name, mail FROM users
180
Vous pouvez excuter cette requte dans phpMyAdmin :

h h h h
Rendez-vous sur phpMyAdmin (http://drupal.tld/phpmyadmin) Dans la colonne de gauche, slectionnez la base drupal Onglet SQL Entrez la requte
La requte dans phpMyAdmin

h
Bouton Excuter
Le rsultat saffiche alors.
Rsultat de la requte
4.1.2 Les tables role et role_permission

Chaque utilisateur possde un ou plusieurs rles qui lui procurent des permissions. La liste des rles est stocke dans la table role et la liste des permissions dans la table role_permission. Voici le contenu de ces tables : rid 1 2 3 4 name anonymous user authenticated user administrator Rdacteur de recettes
La table role
181
Ici, il existe donc 4 rles diffrents, le rle numro 3 est le rle administrateur. rid 3 2 3 1 2 3 4 3 permission access administration pages access comments access comments access content access content access content access content access content overview
Extrait de la table role_permission
Chaque permission est dcrite par une phrase dans le champ permission. Le champ rid indique le numro du rle ayant le droit dexcuter la permission. Le rle numro 3 (rle administrateur) peut accder aux pages dadministration (access administration pages). Les rles 1 (utilisateur anonyme), 2 (utilisateur authentifi), 3 (administrateur) et 4 (Rdacteur) peuvent accder au contenu (access content). On dit donc que le champ rid de la table role_permission est une cl trangre lie au champ rid de la table role. Voici comment cela sera reprsent dans cet ouvrage :
Liste des champs de role et role_permissions
Les shmas de ce livre ont t raliss grce au Concepteur de phpMyAdmin. Dans Drupal, aucune relation nexiste entre les tables, elles ont t cres pour faciliter la comprhension.

Vous pouvez effectuer des requtes sur plusieurs tables. Afficher les permissions accordes au rle Rdacteur :
SELECT role.name, role_permission.permission FROM role JOIN role_permission ON role.rid = role_permission.rid WHERE role.name = "Rdacteur"
182
4.1.3 La table users_roles

Des rles sont attribus aux utilisateurs. Un utilisateur peut possder plusieurs rles et un rle peut tre possd par un utilisateur. Il est donc ncessaire davoir une table contenant tous les couples utilisateur/rle possibles. Cette table est la table users_roles. uid 2 3 3 rid 4 3 4
Contenu de la table users_roles
Lutilisateur numro 2 possde le rle numro 4 (Rdacteur). Lutilisateur numro 3 possde les rles numro 3 (Administrateur) et 4 (Rdacteur). La table users_roles contient donc deux cls trangres. Elle est appele table intermdiaire.
Schma de la gestion des utilisateurs, des rles et des permissions sous Drupal

Afficher les rles associs lutilisateur Benoit :
SELECT users.name, role.name FROM users JOIN users_roles ON users.uid = users_roles.uid JOIN role ON role.rid = users_roles.rid WHERE users.name = "Benoit"
Afficher les permissions de Benoit :

SELECT DISTINCT users.name, role_permission.permission FROM users JOIN users_roles ON users.uid = users_roles.uid JOIN role ON role.rid = users_roles.rid JOIN role_permission ON role.rid=role_permission.rid WHERE users.name = "Benoit"
183
4.2
Gestion des nodes
Une ligne est cre dans la table node pour chaque nouvelle node ajoute au site.
4.2.1 Types de nodes
Gestion des nodes
Dans la table node, vous trouverez des informations telles que le langage, le numro de lutilisateur qui a cr la node (uid), son titre (title), ses options de publication (sticky, promote), etc. Dans cette table, le seul champ prsent est le titre, les autres champs sont stocks dans dautres tables qui seront tudies au prochain chapitre. Node est relie la table node_type qui dfinit les types de nodes (article, page, sondage, recette de cuisine).

Afficher le titre de toutes les nodes du site :
SELECT title FROM node
184
Afficher le titre de toutes les nodes et leur auteur :

SELECT title, users.name FROM node JOIN users ON node.uid=users.uid
Afficher le nombre de nodes par type :

SELECT type, count(*) AS "Nombre nodes" FROM node GROUP BY type
4.2.2 Commentaires
La table comment des commentaires
La table comment contient les informations lies aux commentaires. Elle contient deux cls trangres, uid qui indique quel est lauteur du commentaire et nid qui indique a quelle node se rattache le commentaire. Le champ pid est galement une cl trangre de la table comment elle mme qui indique quel est le commentaire (cid) parent (dans le cas ou les commentaires sont hirarchiss).

Afficher le nombre de commentaires par node :
185
SELECT node.title, count(*) AS "Nombre Commentaires" FROM node RIGHT JOIN comment ON comment.nid=node.nid GROUP BY node.title
4.3
Gestion des champs
Le contenu dune node dpend des champs qui composent le type de contenu (chap. II 4 Field UI : Types de contenus personnaliss).
4.3.1 Les tables field_data_*

Tous les champs se rapportant aux nodes se trouvent dans les tables prfixes par la chaine field_data_*. Lorsquun nouveau champ est cr, une table est cre (champ body => field_data_body, champ prix => field_data_prix).
Contenu des nodes
Le champ entity_type de chaque table field_data_* indique quel est le type dentir (node, users, comment) laquelle il se rattache. Le champ bundle lui, stocke le type de contenu (article, page, recette) lorsque entity_type est une node. Le champ entity_id contient le numro de lentit (nid lorsque entity_type est une node).
186
Les table field_data peuvent avoir des champs diffrents en fonction du type de champ, voici trois exemples de tables : le contenu du champ body, de type Texte long et rsum, est stock dans la table field_data_body. Le contenu (body_value), le rsum (body_summary) et le format dentre sous forme de cl trangre (body_format) sont stocks dans la table ; entity_type node node node node node bundle article article article article recette entity_id 1 2 3 5 6 body_value Voila , cest une version estivale de ma recette au Risotto a la bire blanche et Stilton et tranches de ------- Ingrdients (pour 1 pers.) ------Voil une recette toute simple pour faire de Si je devais choisir mon lgume ftiche du mo
Extrait du contenu de la table field_data_body
le contenu du champ image, de type image, est stock dans la table field_data_field_image. Cette table contient un lien vers le fichier sous forme de cl trangre (field_image_fid) et les paramtres alt (field_image_alt) et title (field_image_title) ; le contenu du champ Prix, de type rel virgule flottante, est stock dans la table field_data_field_ prix. Cette table contient uniquement le rel stock (field_prix_value).

Afficher le nombre de caractres du body des nodes de type article :
SELECT title, CHAR_LENGTH(body_value) FROM field_data_body JOIN node ON field_data_body.entity_id=node.nid WHERE node.type="article"
Afficher le titre des recettes tries par prix :

SELECT node.title, field_prix_value FROM field_data_field_prix JOIN node ON field_data_field_prix.entity_id=node.nid ORDER BY field_prix_value
187
4.3.2 Cas dun champ contenant plusieurs valeurs

Un champ peut contenir un nombre de valeurs illimits comme le champ ingrdients que vous avez cr pour le type Recettes. Dans ce cas, le shma relationnel entre les tables est identique :
Gestion dun champ valeurs multiples
Il y aura donc plusieurs lignes dans la table field_data_field_ingredients qui auront un champ entity_id identique. Le champ delta permet de connatre lordre des lignes.

Affiche le nombre dingrdients pour chaque recette :
SELECT node.title, count(*) as "Nombre d'ingrdients" FROM node LEFT JOIN field_data_field_ingredients ON field_data_field_ingredients. entity_id=node.nid WHERE node.type="recette" GROUP BY node.nid
Liste des ingrdients de la recette Gnocchis la courge, sauce mandarine et parmesan :

SELECT field_ingredients_value FROM node LEFT JOIN field_data_field_ingredients ON field_data_field_ingredients. entity_id=node.nid WHERE node.title="Gnocchis la courge, sauce mandarine et parmesan" ORDER BY field_data_field_ingredients.delta
188
4.3.3 Les formats dentre

Un champ personnalis peut tre associ un format dentre. Cest le cas par exemple du champ body dun article ou dune page.
Gestion des formats dentre
Un champ contenant un format dentre possde une cl trangre (ici, body_format) la liant la table filter_format. Chaque format dentre contient ensuite un ou plusieurs filtres de la table filter.
4.3.4 Paramtres des champs

Chap. II 4.2.6 Ajout du champ photo de larticle, vous avez ajout le champ field_image du type article au type recette. Les informations relatives aux photos des articles et des recettes sont donc stockes dans la table field_data_field_image. Cependant, il est possible de dfinir certaines options spcifiquement pour chaque champ, voici comment cela est organis dans la base de donnes.
Champs lis aux entits
189
Les champs field_id et field_name indiquent le numro et le nom du champ (body, field_prix, field_photo, etc.), entity_type le type dentite et bundle le nom de lentit. id 1 2 3 4 5 6 7 8 9 10 11 12 field_id 2 1 2 1 3 4 2 1 5 6 7 8 field_name body comment_body body comment_body field_tags field_image body comment_body field_preparation field_ingredients field_etapes field_photo entity_type node comment node comment node node node comment node node node node bundle page comment_node_page article comment_node_article article article recette comment_node_recette recette recette recette recette

Afficher les champs attachs au type de contenu recette :
SELECT field_name FROM field_config_instance WHERE entity_type = "node" AND bundle = "recette"
4.3.5 Les champs des autres types dentit

Dans la base de donnes Drupal, une entit est un lment auquel il est possible dajouter des champs personnaliss. Cela peut-tre une node, un terme de taxonomy, un commentaire, etc.
190
Les tables field_data_* avec diffrentes entits
Les tables sont organises de la mme faon que pour les entits node : une table field_data_* par champ et un numro dentit dans le champ entity_id (nid pour les nodes, tid pour les vocabulaires, cid pour les commentaires, etc.). Le champ bundle change alors selon le type dentit : type de node, nom du vocabulaire, etc. Il est possible de connatre le type dentit grce au champ etid de chaque table. Chaque numro est dcrit dans la table field_config_entity_type. etid 2 1 3 type comment node taxonomy_term
La table field_config_entity_type
191
4.3.6 Les rvisions des champs

Chaque node peut avoir une rvision ou version (gr par longlet horizontal Rvisions).
Rvisions des champs personnaliss
La table node contient deux cls : nid (numro de la node) et vid (numro de rvision en cours). Elle est relie la table node_revision qui contient les donnes des diffrentes rvisions de node. Pour chaque table field_data_*, une table field_revision_* existe. Ces deux tables sont relies de la mme manire que les tables node et node_revision. Elles permettent de stocker les rvisions de chaque champ.
4.3.7 Relation entre les vocabulaires et les nodes
Organisation des donnes pour la taxonomie
La table taxonomy_vocabulary contient la description des vocabulaires. La table taxonomy_term_data contient les descriptions de chaque terme. La table taxonomy_index est une table de transition entre taxonomy_term_data et node car une node peut avoir plusieurs termes et un terme peut tre reli plusieurs nodes.
192
Comme vu au chap. III - 3.1.5 Les champs des autres types dentit taxonomy_term_data peut-tre reli aux tables field_data_*

Liste des termes de la node Gnocchis la courge, sauce mandarine et parmesan :
SELECT taxonomy_term_data.name FROM taxonomy_term_data JOIN taxonomy_index ON taxonomy_term_data.tid = taxonomy_index.tid JOIN node ON node.nid = taxonomy_index.nid WHERE node.title = "Gnocchis la courge, sauce mandarine et parmesan"
1 - Views : organisez vos donnes
193
Chapitre
IV
Description de modules utiles de Drupal
ette partie dcrit un grand nombre de modules Drupal rpondant divers besoins. Vous pouvez la lire dans son ensemble pour savoir ce qui existe et quoi cela sert ou essayer de trouver uniquement celui dont vous avez besoin. Sachez seulement que le module Views est un module central de Drupal, difficile apprhender mais vite indispensable. Si vous ne devez en prendre quun : choisissez celui-l.
Views : organisez vos donnes
Le module Views permet de crer des vues qui slectionnent, organisent et affichent des donnes de la base de donnes Drupal. Views ralise tout cela sur mesure grce une interface utilisateur comprenant des centaines doptions.
194
IV - Description de modules utiles de Drupal
Voici les vues que vous allez raliser durant ce chapitre :
Liste des recettes sous forme de tableau avec filtres de tri et de slection pour lutilisateur
Bloc contenant les 3 recettes prise au hasard
Bloc dinformation pour les rdacteur de recettes propos de la recette affiche
Si vous avez suivi cet ouvrage, vous navez pour linstant quune seule recette disponible. Voici les 5 recettes qui ont t ajoutes en plus pour illustrer ce chapitre : Tatziki : http://1001recettes.blogspot.com/2006/05/retour-de-crte.html Tartare de Boeuf : http://1001recettes.blogspot.com/2009/07/un-carpaccio-qui-tourne-mal.html
195
Poulet Korma : http://1001recettes.blogspot.com/2008/02/une-journe-pimenter.html Gteau 101% chocolat : http://1001recettes.blogspot.com/2009/07/cest-fort-en-chocolat-et-meme-bien-plus.html Curry Malais : http://1001recettes.blogspot.com/2010/06/un-ptit-curry-mais-malais-cette-fois.html
1.1
Installation et dcouverte du module
1.1.1 Installation
Le module Views dpend du module CTools :
h
Tlchargez et activez les module Chaos tool suite (http://drupal.org/project/ctools) Version utilise pour ce livre 7.x-1.0-rc1 et Views et Views UI (http://drupal.org/project/views) Version utilise pour ce livre 7.x-3.0-rc1. CTools est un module qui contient des fonctions PHP pour Drupal. Il facilite la vie des programmeurs. Au moment de la rdaction de cet ouvrage, Views ntait pas encore traduit en Francais. Pour les copies dcran, une traduction a t import depuis http://localize.drupal.org/.
Pour pouvoir consulter la volumineuse aide de Views, il faut installer le module Advanced help.
1.1.2 Dcouverte de la vue Tracker

En activant le module Views, quelques exemples de vues sont installs.
h h
Menu Structure lien Views Dans la liste, cliquez sur le lien activer de la vue Tracker
La vue Tracker est active
196
Un bug prsent sur la version 3.0-rc1 empche daccder directement au contenu de la vue active, il faut donc dabord :
h h h h
Cliquer sur le lien modifier de la vue Tracker Bouton Enregistrer Retourner Menu Structure lien Views
Pour voir la vue en action, cliquez sur /tracker dans la colonne CHEMIN
La vue Tracker en action
Cette vue affiche la liste des nodes du site et diverses informations leur propos. Remarquez galement que : les nodes sont prsentes sous forme de tableau ; il est possible de modifier lordre de tri de ces nodes en cliquant sur les enttes du tableau. Tout est configurable dans cette vue : le nombre de colonnes du tableau, lordre de tri par dfaut, le format des colonnes, de la date, les liens vers les nodes et les auteurs, etc.
1.1.3 Interface du module Views

Vous pouvez voir comment est construite cette vue en lditant. Un menu contextuel qui saffiche en haut droite des vues. Vous pouvez accder la page de configuration de la vue directement partir de ce menu.
Menu contextuel dune vue
197
ditez la vue
Vous arrivez alors sur la page de construction des vues. Celle-ci est divise en trois parties : Affichages, Dtails de l'affichage et Aperu de la vue.
Affichages
Chaque vue peut dfinir plusieurs sorties (page, bloc, etc). Cette aspect sera dtaill plus tard dans ce chapitre.
Dtails de laffichage
Paramtres de laffichage Page
Cest dans cette section que vous pouvez configurer les paramtres de la vue. Remarquez par exemple la liste dans la section CHAMPS qui correspond exactement aux champs affichs dans la vue tracker.
198
Aperu de la vue
Aperu de la vue en temps rl
Cette section rpercute automatiquement les modifications faites aux paramtres de la section prcdente. Des menus contextuels permettent galement de modifier certains paramtres directement depuis laperu.
1.1.4 Modification de la vue Tracker

Vous allez maintenant de modifier quelque paramtres de la vue Tracker : Modifier le format daffichage de la vue ; limiter 10 le nombre de nodes par page ; supprimer des champs de la vue.
Modification du format
La section FORMAT de la vue indique que Tracker est affiche sous forme de Tableau. Modifiez ce paramtre pour que les nodes saffichent sous forme de liste.
Le paramtre Format de Tracker est tableau

h
Cliquez sur le lien Tableau pour modifier ce paramtre Choisissez Liste HTML
Dans la fentre qui apparat vous pouvez choisir le format de la vue.

h
199
Modification du paramtre Format

h
Bouton Appliquer (tous les affichages)
Une deuxime page popup permet de configurer le style Liste HTML. Vous pourriez par exemple choisir un type de liste ordonne (items numrots).
h
Vous pouvez ds prsent constater dans laperu limpact qu eu ce changement de paramtre sur la vue.
La vue tracker avec le style Liste HTML
200
Modification de la pagination
De la mme faon, vous pouvez changer la pagination de cette vue. Par dfaut, 25 lments par page saffichent en format tableau, vous allez le passer 10.
h h
Cliquez sur le lien Avec pagination, 25 lments lments par page : 10 Si le nombre de nodes de votre installation Drupal est infrieur 10, la pagination ne saffichera pas.
Modification de la pagination
h
Nouvelle pagination
201
Une nouvelle section pagination apparat alors en aperu. Remarquez quun nouveau menu contextuel permet daccder directement aux paramtres de pagination.
Suppression de champs
La zone CHAMPS affiche la liste des champs qui apparaissent dans la vue. Vous allez supprimer les champs relatifs aux commentaires.
Les champs de la vue Tracker

h
Cliquez sur le lien rordonner de la section CHAMPS
Liste des champs de la vue

h
Cliquez sur le lien Retirer des trois champs relatifs aux commentaires (Contenu : Nombre de commentaires (Replies), Contenu : Last comment time (Last Post) et Contenu : Nouveaux commentaires) Bouton Appliquer (tous les affichages)
202
Tracker sans les informations relatives aux commentaires
Si vous cliquez sur le lien voir page de la vue Tracker, vous pourrez faire le constat que vos modifications nont pas t prise en compte. Cest parce que vous navez pas sauvegard la vue. Cliquez sur le bouton Enregistrer situ en haut de la page pour prendre en compte les modifications ou Annuler pour ne pas prendre en compte lensemble des modifications.
Section denregistrement de la vue
1.2
Cration dune vue liste des recettes
Vous voil maintenant prt crer votre propre vue. Cette vue slectionnera les contenus de type Recette et les affichera dans une page sous forme de tableau et dans un bloc.
1.2.1 Formulaire de cration

h h
Menu Structure lien Vues Lien + Ajouter une nouvelle vue Nom de la vue : Liste des recettes Description : Une page qui affiche la liste de toutes les recettes et un bloc qui affiche les 5 dernires recettes
La page qui apparat est lassistant de cration dune vue.

h h
203
Nom et description de la vue
Le paramtre Format daffichage permet de modifier le style des lignes :

h
Format daffichage : Tableau Pour ce premier exemple, vous nallez pas utiliser les paramtres de cet assistant pour mieux comprendre les mcanisme de linterface de views.
Bouton Continuer & modifier
Aperu de la vue aprs sa cration
1.2.2 Slection des champs

Ajoutez deux champs votre vue : le champ Prix ; le champ Photo sous forme de miniature (Thumbnail). Le champ Titre a t automatiquement ajout la vue par lassistant.
Ajout du champ prix

h h
Cliquez sur le lien ajouter de la section CHAMPS Dans le popup, cochez la ligne Contenu : Prix par personne
204
La liste des champs est longue. Si vous savez prcisment le champ que vous recherchez, nhsitez pas entrer une chane dans la zone Recherche.
Slection dun champ ajouter

h
Bouton Ajouter et configurer le champ
Saffiche une deuxime fentre popup contenant des dizaine doptions. Cette fentre permet de configurer laffichage du champ.
h
La vue avec un deuxime champs
Ajout du champ photo

Ajouter le champ photo nest pas plus compliqu :
h h h
Cliquez sur le lien ajouter de la section CHAMPS Dans le popup, cochez la ligne Contenu : Photo de la recette Bouton Ajouter et configurer le champs Etiquette : Photo Style dimage : Thumbnail Link image to : Contenu Bouton Appliquer (tous les affichages)
Saffiche alors la deuxime fentre popup de configuration du champ photo.

h h h h
205
Aperu en tableau avec image
Chap. IV 4.5 Image : crez des styles d'image personnaliss
Modification dun champ

Il manque une tiquette (titre de colonne) au champ titre. Pour lajouter, il faut diter le champ titre :
h h h
Dans la section CHAMPS, lien Contenu : Titre Cocher Crer une tiquette tiquette : Titre
Ajout dune tiquette au champ titre

h
206
Noubliez pas denregistrer votre vue de temps autre en cliquant sur le bouton Enregistrer situ en haut de la page.
La section CHAMPS de Views correspond la clause SELECT dune requte SQL.
Vous pouvez crer un raccourci vers la page /liste_des_recettes avec le module chap. IV 3.3 Shortcuts : grez la barre de raccourcis pour accder rapidement au rendu de la vue.
1.2.3 Critres de filtrage

La vue cre affiche toute les nodes (articles, sondages, etc). Vous pouvez restreindre cette liste aux seules nodes de type Recette.
h h h
Cliquez sur le lien ajouter de la section CRITRES DE FILTRAGE Dans le popup, cochez la ligne Contenu : Type Bouton Ajouter et configurer critres de filtre Oprateur : Fait partie de Types de contenu : Recette Bouton Appliquer (tous les affichages) Le filtre Contenu : Publi (Oui) a t automatiquement ajout par dfaut. Il ne slectionne que les contenus qui ont la case Publi coche dans les Options de publication.
Saffiche une deuxime fentre popup qui permet de configurer le filtre.

h h h
Dans laperu, vous pouvez constater que seuls les recettes sont maintenant affiches. La section CRITRES DE FILTRAGE de Views correspond la clause WHERE dune requte SQL
1.2.4 Critres de tri

Par dfaut, la vue est trie par ordre de Date de publication du plus rcent au plus vieux. Vous allez supprimer ce critre et ordonner la vue par Titre en ordre alphabtique.
Suppression du critre Contenu : Date de publication (desc)

h h h
Cliquez sur le lien rordonner de la section CRITRES DE TRI Cliquez sur le lien Retirer de la ligne Contenu : Date de publication desc Bouton Appliquer (tous les affichages)
207
Ajout du critre par ordre alphabtique

h h h
Cliquez sur le lien ajouter de la section CRITRES DE TRI Dans le popup, cochez la ligne Contenu : Titre Bouton Ajouter et configurer critres de tri Option : Trier par ordre croissant Bouton Appliquer (tous les affichages)
Saffiche alors la deuxime fentre popup qui permet de configurer le critre.

h h
La vue trie par ordre alphabtique
La section CRITRES DE TRI de Views correspond la clause ORDER BY dune requte SQL
Tri par tableau

Lorsque votre vue utilise un format en Tableau, vous pouvez trier la vue par colonne :
h h
Lien Paramtres de la section FORMAT Cochez la case CLASSABLE des colonne dsires
Option de tri par en-tte de colonne
208
Tri par titre et prix possible
1.2.5 Exercice : modification de la vue

Modifier la vue de faon ce quelle saffiche de la faon suivante :
Ajout dun champ difficult et rorganisation des colonnes
Corrig
Ajout du champ Difficult
h h h
Cliquez sur le lien ajouter de la section CHAMPS Dans le popup, cochez la ligne Contenu : Difficult Bouton Ajouter et configurer le champs Bouton Appliquer (tous les affichages) Cliquez sur le lien rordonner de la section CHAMPS Dplacez les champs en cliquant sur licne de gauche
Saffiche alors la deuxime fentre popup de configuration du champ.

h
Rordonner les champs

h h
209
Modifier lordre des champs

h
1.2.6 Relations
Lors du chap. II 4.4.2 Ajout dun champ un terme de Taxonomie, vous avez associ chaque terme Illustration. Il sagit maintenant dafficher dans la vue cette illustration la place des termes de difficult (Trs facile, Facile, Moyen, etc.) Votre vue tant base sur le contenu, vous ne trouverez pas le champ Illustration du terme de taxonomie dans la liste.
Pas de champ pour lillustration
Il faut alors crer une relation entre la node affiche et son terme de taxonomie du vocabulaire difficult.
h
Dans la troisime colonne de la page de configuration de Views, cliquez sur le lien ajouter de la section RELATIONS
Ajout dune relation
210
Saffiche la liste des liens possibles par rapport une vue base sur le contenu. Voici quelques uns de ces liens : lien vers lutilisateur Auteur de la recette (Contenu : Auteur) ; lien vers les fichiers rattachs au nud (Utilisation du fichier : Fichier) ; lien vers les diffrents vocabulaires de taxonomie lis un type de contenu (Contenu : Difficult (field_difficulte), Contenu : Provenance (field_provenance), etc.).
h
Slectionnez la ligne Contenu : Difficult (field_difficulte)
Ajout de la relation avec le vocabulaire difficult

h h
Bouton Ajouter et configurer relations Bouton Appliquer (tous les affichages) Cliquez sur le lien ajouter de la section CHAMPS Dans le popup, cochez la ligne Terme de taxonomie : Illustration
Le champ Illustration doit tre disponible maintenant :

h h
De nouveaux champs sont disponibles grce la relation

h
Bouton Ajouter et configurer le champ
Saffiche la deuxime fentre popup. Remarquez que Views indique quune relation est utilise pour accder ce champ.
211
Une relation est utilise pour accder ce champ

h h
Etiquette : Difficult Bouton Appliquer (tous les affichages) La section RELATION de Views correspond la clause JOIN dune requte SQL
Vous pouvez retirer le champ difficult prcdent et rorganiser les champs
1.2.7 Formulaires expos

Views permet lutilisateur de votre vue dinteragir avec son contenu. Pour cela, il est possible dajouter des filtres ou des critres de tris. Voici par exemple le formulaire que vous allez crer :
Le formulaire permettant lutilisateur dinteragir avec la vue
Ajout dun filtre expos pour le champ Difficult

Il est aussi simple de crer un filtre expos lutilisateur quun filtre normal :
h h h
Cliquez sur le lien ajouter de la section CRITRES DE FILTRAGE Dans le popup, cochez la ligne Contenu : Difficult (field_difficulte) Bouton Ajouter et configurer critres de filtre
212
Le champ ajout est de type terme de taxonomie. Il faut donc choisir le widget utiliser pour le formulaire :
h h
Choisissez Liste droulante Bouton Appliquer et continuer Cochez la case Exposer ce filtre aux visiteurs, pour leur permettre de le modifier Etiquette : Difficult
Saffiche la fentre popup qui permet de configurer le filtre.

h h
Ajout dun filtre expos

h
Dans laperu, apparat une nouvelle section Filtres exposs au dessus de la vue.
Aperu du filtre cr
Ajout dun critre de tri expos pour le champ difficult

De la mme faon, il est possible dexposer un critre de tri :
h h h
Cliquez sur le lien ajouter de la section CRITRES DE TRI Dans le popup, cochez la ligne Contenu : Difficult (field_difficulte) Bouton Ajouter et configurer critres de tri Cochez la case Exposer ce filtre aux visiteurs, pour leur permettre de le modifier
Saffiche la deuxime fentre popup qui permet de configurer le critre.

h
213
h h
Etiquette : Difficult Bouton Appliquer (tous les affichages)
Aperu du critre de tri expos
Lorsque vous utilisez un style Tableau, vous pouvez permettre lutilisateur de trier le contenu en utilisant les en-ttes. Lorsque plusieurs critres de tri sont exposs, ils sont tous grs par la mme liste droulante.
Tri par titre ou Difficult
Ajout dun filtre expos pour le champ Tags

Pour le champ tags, vous allez utiliser un autre widget que la liste droulante :
h h h
Cliquez sur le lien ajouter de la section CRITRES DE FILTRAGE Dans le popup, cochez la ligne Contenu : Tags (field_tags) Bouton Ajouter et configurer critres de filtre Choisissez Autocompltion Bouton Appliquer et continuer Cochez la case Exposer ce filtre aux visiteurs, pour leur permettre de le modifier Etiquette : Mots cls Bouton Appliquer (tous les affichages)
Le champs ajout est de type terme de taxonomie. Il faut donc choisir le widget utiliser :
h h
Saffiche la fentre popup qui permet de configurer le filtre.

h h h
214
Filtre avec widget dautocompltion
Les options des formulaires exposs dune vue

Une section FORMULAIRE EXPOS permet de modifier certains paramtres :
Section pour configurer les formulaires exposs
Formulaire expos dans un bloc : le formulaire ne sera pas affich au dessus de la vue mais il sera disponible sous forme de bloc. Il sera alors possible de le positionner dans une autre rgion du thme ; Style de formulaire expos : si Valeur requise est choisie, la vue naffichera aucun rsultat tant que lutilisateur na pas utilis le formulaire ; Paramtres : permet de modifier les textes et quelques options du formulaire.
Options des formulaires exposs
215
Notez galement loption Utiliser AJAX qui permet de ne recharger que la vue lorsquune valeur du formulaire est modifie et non pas lensemble de la page. Bravo ! Votre page est maintenant termine. Vous pouvez Enregistrer votre vue et cliquez sur le lien voir page.
La vue dans son environnement Drupal
1.3
Gestion des affichages
Il est possible, pour une mme vue, de crer diffrents affichages. Votre vue Liste des recettes saffiche sur une page dfinie par une url. Voici dautres affichages possibles :
Une autre page sans les photos
216
Un bloc qui affiche trois recettes
Flux RSS
Nul besoin davoir une vue pour chacun de ces trois affichages. Tout cela se gre via linterface de configuration de Views.
Gestion des affichages dans views
217
1.3.1
Cration du bloc
Vous allez crer le bloc qui affiche les trois recettes au hasard.
h h
Dans la section Affichages, lien + Add Slectionner Ajouter Bloc
Ajout dun affichage
Un bloc ne saffiche pas par une url mais pas linterface dadministration des blocs. Il faut donc lui donner un nom dans cette page.
h h h
Dans la section PARAMTRES DU BLOC, modifiez le paramtre Nom du bloc Nom du bloc : Trois recettes au hasard Bouton Appliquer
Si vous enregistrez la page, vous pourrez alors activer le bloc sur la page menu Structure lien Blocs.
Le bloc de la vue est disponible
Forcment, laffichage de la page dans un bloc nest pas adapt. Il va falloir modifier quelques paramtres de la vue pour cet affichage.
1.3.2 Paramtres spcifiques laffichage

Il y a quelques modifications apporter laffichage Bloc.
Modification du Format
Le format en Tableau ne convient pas pour un bloc :
h
Si ce nest pas le cas, slectionnez laffichage Bloc
218
Slection dun affichage

h h
Lien Tableau de la section FORMAT Choisissez Liste non mise en forme
Si vous appliquez cette modification en cliquant sur le bouton Appliquer (Tous les affichages), lensemble des affichages seront impacts. Une liste droulante en haut de la fentre permet de choisir laffichage modifier.
h
Choisir Ce(tte) block (supplanter) dans la liste en haut de page
Modification applique uniquement laffichage en cours
Remarquez que lintitul du bouton Appliquer (cet affichage) chang pour vous permettre dviter lerreur commune de modifier lensemble des affichages. Il est conseill denregistrer rgulirement votre vue pour pouvoir annuler les modifications en cas dcrasement des paramtres des autres vues.
h h
Bouton Appliquer (cet affichage) Bouton Appliquer (cet affichage) de nouveau pour les paramtres du format
219
Les champs dont la valeur a t supplante pour laffichage en cours sont nots en italique.
Le champ format est supplant, le champ titre ne lest pas
Mise en forme modifie pour le bloc
1.3.3 Exercice : modification des paramtres dun affichage

Modifiez les paramtres de laffichage bloc pour quil ait laspect suivant :
Bloc de trois recettes au hasard
220
Corrig
Suppression des champs Photo et Prix par personne
h h h h
Cliquez sur le lien rordonner de la section CHAMPS Lien Retirer sur les lignes Contenu : Photo de la recette Photo et Contenu : Prix par personne Choisir Cette) block (supplanter) dans la liste en haut de page Bouton Appliquer (cet affichage) Cliquez sur le lien Contenu : Titre (Titre) de la section CHAMPS Dcocher la case Crer une tiquette Bouton Appliquer (cet affichage) Cliquez sur le lien Terme de taxonomie : Illustration de la section CHAMPS Dcocher la case Crer une tiquette Style dimage : Thumbnail Bouton Appliquer (cet affichage) Cliquez sur le lien Complet de la section PAGINATION Option Afficher un nombre dfini dlments Bouton Appliquer (cet affichage) lments afficher : 3 Bouton Appliquer (cet affichage) Cliquez sur le lien Lien plus de la section PAGINATION Cochez la case Crer un lien plus Bouton Appliquer (cet affichage) Cliquez sur le lien ajouter de la section CRITRES DE TRI Slectionnez la ligne Global : Au hasard Bouton Ajouter et configurer critres de tri Bouton Appliquer (cet affichage) Cliquez sur le lien Liste de recettes de la section TITRE Entrez Trois recettes au hasard Bouton Appliquer (cet affichage)
Suppression de ltiquette du titre

h h h
Modification du champs difficult

h h h h
Affichage de trois lments et du lien plus

h h h h h h h h
Tri au hasard
h h h h
Modification du titre
h h h
221
Retirer les filtres expos

h h h h h h
Cliquez sur le lien rordonner de la section CRITRES DE TRI Lien retirer des lignes avec filtre expos Bouton Appliquer (cet affichage) Cliquez sur le lien et/ou de la section CRITRES DE FILTRAGE Lien retirer des lignes avec filtre expos Bouton Appliquer (cet affichage)
La page de configuration de laffichage bloc
1.4
Cration dun bloc dinfo supplmentaires sur la recette
Une vue peut utiliser des filtres contextuels, cest dire que son contenu pourra tre diffrent selon son contexte daffichage. Vous allez crer un bloc qui affichera des informations relatives la node de type Recette qui saffiche.
Le contenu du bloc change en fonction de la recette affiche
222
1.4.1 Cration du bloc de base

h h
Menu Structure lien Vues Lien + Ajouter une nouvelle vue
Lassistant de cration de vue apparat alors. Compltez-le comme dans lillustration suivante :
Cration de la vue grce lassistant

h
Bouton Continuer et modifier
1.4.2 Cration du filtre contextuel

Un filtre contextuel est un paramtre que la vue rcupre dans lUrl de la page. Par exemple, lurl daffichage dune node est de type node/6. La vue peut donc utiliser le nid du contenu affich en rcuprant le deuxime paramtre de lurl.
h h h
Cliquez sur le lien ajouter de la section Filtres contextuels Slectionnez la ligne Contenu : Nid Bouton Ajouter et configurer filtres contextuels Choisir loption Fournir une valeur par dfaut la section Quand la valeur de filtre nest pas disponible
La fentre popup de configuration des filtres contextuels saffiche alors.

h
223
Valeurs pouvant tre trouves automatiquement par Views
Cette option Fournir une valeur par dfaut est trs utilise pour fournir des arguments aux vues. Views peut trouver les nid des nodes, les uid des utilisateurs, etc. Vous pouvez galement entrer directement du code PHP pour gnrer largument.
h h
Cocher Supplanter le titre la section Quand la valeur de filtre est disponible Titre : Recette : %1
Insertion dun argument dans le titre

h
224
Aperu avec filtres contextuels

La section Aperu automatique naffiche rien car aucun filtre contextuel nest fourni. Il est possible den fournir un grce la zone de texte Aperu avec filtres contextuels.
Aperu avec en paramtre la node 10
Test du bloc
Vous pouvez dj tester si votre bloc fonctionne :
h h h h h
Cliquez sur le paramtre Nom du bloc Nom : Informations supplmentaires Enregistrer la vue Placez le bloc Informations supplmentaires en Premire barre latrale Chargez une page contenant une recette (attention : la vue ne fonctionne pas avec la page de liste des recettes)
Le bloc sadapte au contenu affich
225
1.4.3 Modification de la sortie par dfaut dun champ

Modification de la balise HTML Cr il y a
Laffichage dun champ est entirement configurable avec Views. Vous allez crer ici un champ qui affichera le temps coul depuis la date de cration de la recette :
h h h h h
Cliquez sur le lien ajouter de la section CHAMPS Slectionnez la ligne Contenu : Date de mise jour Bouton Ajouter et configurer champs tiquette : Cr il y a Format de date : Il y a
Format de date
Pour la prsentation, il faudrait que le texte soit en italique. Pour cela, il faut linclure dans une balise <em> :
h h h
Section PARAMTRES DAFFICHAGE Cocher Personnaliser le code HTML du champ Elment HTML : EM
Changement de la balise HTML dun champ
226
Le nouveau champ du bloc
Beaucoup doptions dans cette fentre permettent de modifier laffichage du champ. Elles peuvent varier selon le type de champ : nhsitez pas les explorer !
Modification du texte Photo

Vous allez nouveau utiliser ces options de transformation de texte pour afficher le champ photo... sous forme de texte ! Si la photo est prsente, le texte affichera " Photo prsente ", sinon, " Photo non prsente " :
h h h h h
Cliquez sur le lien ajouter de la section Champs Slectionnez la ligne Contenu : Photo de la recette Bouton Ajouter et configurer champs Dcochez Crer une tiquette la section Comportement en labsence de rsultats, dans la zone de texte Texte en labsence de rsultats, entrez le texte <strong>Photo non prsente</strong>
Texte afficher si la photo est non prsente

h h
la section Rcrire les rsultats, cochez la case Rcrire la sortie de ce champ Dans la zone de texte, mettez Photo prsente
Texte afficher la place du contenu du champs

h
227
Affichage du champs photo sous forme de texte
1.4.4 Exercice : ajouter le lien de modification

Crez un lien Vous pouvez modifier cette recette qui mnera directement la page ddition de la recette.
Lien ddition de la recette
Corrig
h h h h h h
Cliquez sur le lien ajouter de la section Champs Slectionnez la ligne Contenu : Lien de modification Bouton Ajouter et configurer champs Dcocher Crer une tiquette Texte afficher : Vous pouvez modifier cette recette Bouton Appliquer (tous les affichages)
1.4.5 Exercice : ajouter le champ Auteur

Ajoutez un champ qui affiche le nom de lutilisateur auteur de la recette :
Le nouveau champs Auteur
Cet exercice fait appel des connaissances apprises lors des chapitres prcdents, fouillez dans les options de Views.
228
Corrig
Dans la liste des champs ajouter, rien nest en lien avec le nom de lutilisateur qui est lauteur de la node.
Le nom de lauteur nest pas prsent
Il faut donc ajouter ce champs en passant par une relation.

h h h h h
Cliquez sur le lien ajouter de la section RELATIONS Slectionnez la ligne Contenu : Auteur Bouton Ajouter et configurer relations Bouton Appliquer (tous les affichages) Cliquez sur le lien ajouter de la section CHAMPS
Un grand nombre de champs lis lutilisateur sont maintenant disponibles

h h h h
Slectionnez la ligne Utilisateur : Nom tiquette : Par Bouton Appliquer (tous les affichages) Rorganisez lordre des champs, profitez-en pour supprimer le champ titre
2 - Site multilingue
229
1.4.6 Droits daccs

Ce bloc ne doit safficher que pour les utilisateurs ayant le rle rdacteur de recettes. Il est possible de grer ces droits daccs directement pour le bloc, mais galement partir de Views (ce qui est plus scuritaire) :
h
Dans la section PARAMTRES DU BLOC, cliquez sur le paramtre Droits daccs Aucun(e) restriction daccs ; Droit daccs : permet de choisir le droit daccs (Menu Personnes onglet Droits) que lutilisateur devra possder pour voir la vue ; Rle : permet de choisir le rle que lutilisateur devra possder pour voir la vue.
Vous pouvez alors choisir le type de restriction daccs pour votre vue :
Restriction daccs la vue

h h h h
Choisissez loption Rle Bouton Appliquer (tous les affichages) Cochez les rles administrator et Rdacteur de recettes Bouton Appliquer (cet affichage) Vous pouvez modifier laffichage des vues chap. V 6 Le theming des vues dans les thmes Drupal
Site multilingue
Crer un site multilingue est une tche complexe, il faut pouvoir traduire tous les lments du site : linterface, le contenu que les utilisateurs ajoutent, les menus, les termes de taxonomie, les blocs, etc. Drupal 7 supporte trs bien nativement linternationalisation. Dans ce chapitre, vous allez dcouvrir les modules du coeur de Drupal 7. Ensuite, vous apprendrez comment participer leffort de traduction du coeur de Drupal et des modules.
230
2.1
Locale : traduire linterface de Drupal
Lors de linstallation de Drupal (chap. I 1.1.3. Installation de la langue franaise), vous avez ajout la traduction franaise de linterface Drupal mais la langue anglaise, installe par dfaut est toujours conserve. Vous allez dcouvrir comment passer linterface de Drupal dune langue lautre en crant un site multilingue.
2.1.1 Configuration
Le module Locale est install et activ par dfaut si la langue franaise a t ajoute durant le processus dinstallation.
h
Menu Configuration lien Langues (ou lien configurer du module Locale)
Langlais et le franais sont installes sur votre configuration

h
Onglet Dtection et slection
Cet onglet permet dindiquer Drupal comment il doit choisir la langue de lutilisateur courant. URL Session Utilisateur Navigateur Par dfaut
h h h
Se base sur lURL de la page. Cela peut tre dtect via le nom de domaine (fr.votresite.com) ou par prfixe de chemin (www.votresite.com/fr) Cherche un paramtre en fin dURL (http://www.votresite.com?language=fr) Recherche la langue active dans le profil de lutilisateur Recherche la langue du navigateur Langue active par dfaut sur Drupal (cran prcdent)
Il est possible de cumuler les mthodes de dtection et de les rordonner. Cliquez sur le lien Configurer de la ligne URL Choisir Prfixe de chemin Bouton Enregistrer la configuration http://drupal.tld/en/node/1 : langue anglaise ; http://drupal.tld/fr/node/1 : langue francaise.
h
Ainsi la langue sera ngocie selon lurl :
Cochez les cases Activ des lignes URL et Utilisateur
231
Paramtrage de dtection de la langue par Drupal

h
Bouton Enregistrer les paramtres Par dfaut, le prfixe de chemin est nul pour la langue anglaise. Il est possible de modifier cela pour plus de clart :
h h h
Menu Configuration lien Langues Lien modifier de la langue English Code de langue du prfixe de chemin : en
Ajout dun prfixe de chemin pour la langue anglaise

h
Bouton Enregistrer la langue
2.1.2 Ajout dune langue

Vous allez maintenant ajouter la langue espagnole votre site. Pour cela, il faut dabord copier le fichier de traduction dans votre installation Drupal.
h h
Cliquez sur le menu Download & Extend de www.drupal.org Dans la section Translations, cliquez sur le lien All Translations Vous pouvez accder cette page directement depuis ladresse http://localize.drupal.org
232
Pour pouvoir tlcharger des fichiers sur ce site, il faut tre connect. Crez vous un compte sur http://www.drupal.org
h h h h
Dans la liste des langues, choisir Spanish Tlchargez le fichier correspondant la version 7 de Drupal Enregistrez le fichier dans le rpertoire profile\standard\translation de votre installation Renommez le fichier en es.po, vous devriez obtenir un fichier profile\standard\translation\es.po Menu Configuration lien Langues Lien + Ajouter une langue Choisir Espagnol (Espaol) dans la liste
Vous pouvez ajouter la langue espagnol, ses traductions seront importes automatiquement :
h h h
Ajout dune langue un site Drupal

h
Bouton Ajouter une langue
Votre site est maintenant tri-lingue !
2.1.3 Bloc de slecteur de langue

Le module Locale met disposition un bloc permettant de choisir la langue courante. Cela va vous permettre de faire fonctionner le site dans les trois langues installes
h h h h
Menu Structure lien Blocs Mettez le bloc Slecteur de langue (User interface text) en rgion Premire barre latrale Bouton Enregistrer les blocs Retournez sur la page daccueil du site
Vous pouvez alors modifier la langue courante en utilisant le bloc.
233
Linterface de Drupal en espagnol
Remarquez lURL qui est sous la forme : http://drupal.tld/es

h
Repassez en langue franaise aprs avoir eu la satisfaction de constater que vous compreniez parfaitement lEspagnol.
2.1.4 Traduire linterface

Vous avez peut-tre constat que certains modules de Drupal ne sont pas traduits en franais ou uniquement partiellement. Il est possible de traduire ces chanes directement partir de linterface de Drupal. Pour cet exemple, vous allez traduire certaines chanes du module Chaos tools
h
Tlchargez et activez les module Chaos tool suite (http://drupal.org/project/ctools) Version utilise pour ce livre 7.x-1.0-rc1
Description du module non traduite
234
Il est possible quau moment ou vous lirez ces lignes, le module soit livr avec ses traductions. Dans ce cas, choisissez un autre module non traduit. Vous allez traduire la chane A library of helpful tools by Merlin of Chaos. pour votre site :
h
Menu Configuration lien Traduire linterface
Sur cette page, un tableau vous indique quel est la proportion des chanes traduites dans les diffrentes langues installes.
Statut des traductions de linterface

h
Onglet Traduire La chane contient : library of helpful Bouton Filtrer
Le formulaire permet de rechercher des chanes dans tous les modules et thmes installs.
h h
La chane a t trouve dans la page admin/modules
235
Si vous ne trouvez pas une chane grce cet interface, vrifiez que : vous respectez la casse (majuscules minuscules) ; que la chane ne contient pas darguments (Recent posts for %1 ou %1 est remplac par le nom dutilisateur).
h
Lien modifier de la chane Franais : Une bibliothque doutils utiles par Merlin of Chaos
Vous pouvez alors proposer un texte de remplacement pour les diffrents langages installs
h
Traduction de la chane en franais

h
Bouton Enregistrer les traductions
La colonne LANGUES de linterface de recherche montre alors que la chane est bien traduite en franais mais pas en espagnol.
Chane prsent traduite en franais
Vous pouvez retourner sur la page des modules pour constater le rsultat de votre travail :
La chane est remplace dans linterface
236
2.1.5 Exercice : traduire les chanes dune vue

Pour excuter cet exercice, vous allez utiliser la vue cre chap. IV 1.2 Cration dune vue liste des recettes. modifiez le titre de la vue en Recipes list ; traduisez le titre en franais ; testez si le titre change lorsque vous passez danglais franais.
Corrig
Modifiez le titre de la vue en Recipes list
h h h h
Menu Structure lien Vues Lien modifier de la vue Liste des recettes Modifiez largument Titre de la section TITRE Entrez le texte Recipes list
Modification du titre dune vue

h h
Bouton Appliquer (tous les affichages) Bouton Enregistrer de la vue
ce moment, le titre de la page de la vue est Recipes list Traduisez le titre en franais
h h h h h h
Menu Configuration lien Traduire linterface Onglet Traduire La chane contient : Recipes Bouton Filtrer Lien modifier Franais : Liste des recettes
Traduction du titre de la vue
237
Bouton Enregistrer les traductions
Test
Pour savoir si tout fonctionne, il faut afficher la vue Liste des recettes et ensuite utiliser le bloc de langues pour changer la langue :
h h
Cliquez sur le lien voir page de la vue ou entrez lURL fr/liste-des-recettes Choisissez la langue Franais dans le bloc
Titre de la vue en franais

h
Choisissez la langue English dans le bloc
Titre de la vue en anglais
Si vous voulez crer un site multilingue, il faut toujours entrer ses chanes de caractres dorigine en anglais et ensuite les traduire. Cela est vrai pour le module Views, mais galement lorsque vous crez un thme ou un module et utilisez la fonction t() (chap. VI 1.2.5 Conventions et finitions).
2.2
Participer leffort de traduction
Le site localize.drupal.org a t mis en place pour centraliser lensemble des traductions des modules de Drupal. Il permet ainsi : dexporter les traductions existantes dun module et les importer sur votre installation ; de traduire des chanes de modules directement via le site localize.drupal.org ; de se mettre en lien avec le groupe de traduction de Drupal en Franais ; dimporter les traductions faites sur votre propre installation.
238
2.2.1 Dcouverte du groupe de traduction de Drupal en Franais

h h
Rendez-vous sur localize.drupal.org, vrifiez que vous tes bien connect Dans le bloc de droite Quick navigation, slectionnez French dans la liste Pick a language
Slection de la langue
h
Cliquez sur le bouton Go there
Vous arrivez alors sur la page daccueil du groupe de traduction de Drupal en franais (French team)
Prsentation de la French team !
Cinq onglets permettent daccder aux diffrentes fonctionnalits de localize.drupal.org : Overview Board Translate Import Export Page daccueil du groupe, elle regroupe des liens vers les manuels de traductions, une liste de meilleurs contributeurs et des liens vers les fichiers de traductions des diffrentes versions de Drupal Blog du groupe Interface permettant de traduire des chanes de tous les modules Drupal Importer un fichier de traduction vers localize.drupal.org Exporter un fichier de traduction de localize.drupal.org
239
2.2.2 Importer les traductions dun module

Vous avez traduit au chapitre prcdent une chane du module Chaos tool suite. Mais dautres utilisateurs avaient dj traduit ces chanes. Vous allez exporter le fruit de leur travail depuis localize.drupal.org et les importer sur votre site.
h h
Onglet Export de la page daccueil du groupe (http://localize.drupal.org/translate/languages/fr) Project : Chaos tool suite (ctools) Un lien vers cette page est disponible depuis la page du module, en colonne de droite (http://drupal.org/project/ctools).
Lien vers la page des traductions

h
Release : 7.x-1.0-rc1 only
Export des traductions

h
Bouton Export Gettext file Menu Configuration lien Traduire linterface Onglet Importer Fichier de langue : pointez vers le fichier .po que vous avez tlcharg Bouton Importer
Reprez o votre navigateur a enregistr le fichier (.po) et retournez votre site Drupal :
h h h h
240
Rsultat de limportation du fichier
Si beaucoup de chanes restent non traduites et que vous pensez quelles devraient ltre, choisissez All releases merged (toutes versions confondues) lors de lexport.
Les descriptions du module Chaos tool suite sont maintenant en franais
2.2.3 Partager ses traductions avec la communaut

Dans le module CTools, certaines chanes ne sont pas encore traduites par la communaut.
Le nouveau module de ctools nest pas traduit
Vous pouvez proposer une traduction la communaut.

h h
Onglet Translate de la page daccueil du groupe (http://localize.drupal.org/translate/languages/fr) Project : Chaos tool suite (ctools) Cliquez sur le lien Reveal more filters Status : Untranslated (Non traduites) Contains : custom styles
Un formulaire propose des listes pour trouver ce que vous voulez traduire :
h h h
241
Linterface de recherche de chanes de localize.drupal.org
Vous pouvez alors proposer ou corriger une traduction et lensemble de la communaut en profitera !
Proposition dune traduction
2.2.4 Localization client : une interface Ajax pour traduire linterface

Voici un module plus convivial pour traduire les chanes de linterface et les partager automatiquement sur http://localize.drupal.org.
h
Tlchargez et activez le module Localization client (http://drupal.org/project/l10n_client) Version utilise pour ce livre 7.x-1.0 Il faut dsactiver le module Overlay pour que Localization client fonctionne de manire optimale.
242
Utilisation
Une fois le module activ, une barre apparat en bas de page. Vous pouvez lutiliser pour traduire quelques chanes du module CTools :
h h
Menu Modules Cliquez sur le lien Traduire le texte en bas droite de la page Reprez une chane non traduite dans la page et utilisez la zone de recherche de Localization Client pour la retrouver dans la liste TEXTE SUR LA PAGE Slectionnez la ligne traduire Entrez une traduction pour la chane dans la zone TRADUCTION EN FRANAIS
Les chanes dj traduites dans la langue courante sont en vert, les non traduites en blanc.
h
h h
Traductions avec Localization client

h
Bouton Enregistrer la traduction
La traduction a t sauvegarde en locale
Si vous rechargez la page, la chane est bien traduite. Pour traduire une chane en espagnol, il faut que la langue courante soit espagnol.
Lien avec un serveur de traduction (localize.drupal.org)

Il est possible de configurer Localize Client pour que vos traductions soient directement envoyes vers http://localize.drupal.org :
243
h h h
Menu Configuration lien Langues Onglet PARTAGE Cochez la case Activer le partage des traductions avec le serveur
Configuration du partage des traductions

h
Il faut maintenant que le site localize.drupal.org puisse vous identifier. Pour cela, il faut entrer une cl unique dans votre profil utilisateur Drupal.
h h h
Menu Bonjour Admin Onglet Modifier la section Client de traduction, cliquez sur le lien propos (qui commence par http://localize.drupal.org) Si vous tes dj connect sur drupal.org, une cl vous est fournie Copiez la cl dans la zone Your Localization Server API key
h h
Ajout dune cl dans le profil

h
Bouton Enregistrer
partir de l, lorsque vous utiliserez Localization Client pour traduire une chane, le message suivant apparatra :
Partagez votre talent de traducteur avec Localization Client !
244
2.3
Content Translation : traduire le contenu
Vous savez traduire linterface des modules et des thmes de Drupal. Il vous reste traduire le contenu de votre site. Dans ce chapitre, vous allez crer une page en franais et proposer une traduction en anglais et en espagnol.
h
Activez le module Content translation (module prsent par dfaut)
2.3.1 Configuration
Vous pouvez configurer la gestion multilingue du contenu par type de contenu (Article, Page, Recette etc.). Ici, vous allez traduire un contenu de type Page de base.
h h h
Menu Structure lien Types de contenu Lien modifier du type Page de base Onglet Options de publication
De nouvelles options pour la Gestion mutilingue sont apparues. Par dfaut, celle-ci est dsactive.
Les options multilingue par type de contenu

h
Choisissez Activ, avec traductions Loption Activ permet de choisir la langue de larticle. Loption Activ, avec traductions permet de choisir la langue de larticle et de le mettre en lien avec sa(ses) traduction(s).
Bouton Enregistrer le type de contenu
2.3.2 Utilisation
Vous allez crer un contenu en franais que vous traduirez ensuite :
h h h h h h
Menu Contenu Lien + Ajouter du contenu Lien Page de base Title : Bonjour le monde Body : Il pleut aujourdhui ! Langue : Franais
245
Ajout dune page en franais

h
Bouton Enregistrer
Lorsque vous ajoutez la node que vous venez de crer, le bloc de langues indique que larticle existe uniquement en franais.
Le bloc de langue et le nouvel onglet Traduire
prsent, il faut traduire cette page en anglais :

h h
Onglet Traduire Lien ajouter une traduction de la ligne English Title : Hello World Body : Its raining today ! Bouton Save
Drupal cr une copie de la page en franais. Il ne reste plus quau traducteur de remplacer les chanes :
h h h
Vous pouvez changer la langue courante danglais franais, le contenu est automatiquement traduit ainsi que linterface. Recommencez lopration pour la langue espagnol.
h
Onglet Traduire
246
La traduction anglaise existe, manque la traduction espagnole

h
Lien ajouter une traduction de la ligne Spanish Chaque page de traduction est une node part entire, le module Content translation enregistre seulement un lien entre les nodes. Grce ce systme, il est donc possible de traduire tous les champs dune node (texte, photo, fichiers attachs, liens, etc.)
h h h
Title : Hola mundo Body : Esta lloviendo hoy ! Bouton Guardar Lorsque vous modifiez une node qui possde une traduction, vous pouvez signaler aux nodes traduites que leur contenu est prim.
Primer les traductions dune node
Ainsi, une notification apparatra dans longlet Traduire :
Indication de traduction prime
3 - Administrer Drupal
247
Administrer Drupal
3.1 Dashboard : crez un tableau de bord pour ladministrateur

La page du tableau de bord, accessible par le premier lment de la barre de menu de Drupal, est compltement configurable par simple Glisser/Dposer. Il peut vous permettre daccder aux tches dadministrations de votre site. Il ne faut pas confondre le lien Tableau de bord du module Dashboard et la page Rapports / Tableau de bord qui informe sur ltat de sant de votre installation.
Installation
Le module Dashboard fait partie du coeur de Drupal et est activ par dfaut.
Configuration
Sur cette page, vous pouvez afficher tous les blocs disponibles du site dans lune ou lautre colonne.
h h
Menu Tableau de bord Cliquez sur le lien +Personnaliser le tableau de bord
Apparat alors la liste des blocs dsactivs du tableau de bord Si le bloc que vous dsirez afficher nest pas disponible, cliquez sur le lien Ajouter dautres blocs
h
Vous pouvez ensuite disposer vos blocs par simple Glisser / Dposer.
Le tableau de bord en court de personnalisation
248
3.2
Administration menu : une alternative Toolbar
Ce module a rendu beaucoup de services aux utilisateurs de Drupal 6, alors que Toolbar nexistait pas encore. Une version pour Drupal 7 existe et peut, dans certains cas, remplacer avantageusement Toolbar.
Installation
h h
Tlchargez et installez le module (version utilise pour ce livre 7.x-3.0-rc1). Activez le module Administration menu Il est prfrable dsactiver le module Toolbar pour plus de cohrence.
Utilisation
Aprs activation, la Toolbar est alors remplace par un menu droulant qui permet daccder un maximum de tches dadministration en un seul clic.
Le module administration menu
Le module Administration menu Toolbar style propose les mmes fonctionnalits mais avec un thme se rapprochant plus de Toolbar.
Adminsitration menu et le style Toolbar
249
3.3
Shortcuts : grez la barre de raccourcis
Par dfaut, en dessous de la Toolbar (barre de menu du haut) se trouve une zone grise contenant les liens Ajouter un contenu et Trouver des contenus. Il est possible de grer ces raccourcis grce au module Shortcuts.
Installation
Le module Shortcuts fait partie du coeur de Drupal et est activ par dfaut. Le dsactiver supprimera la zone grise.
Drupal 7 et le module Shortcuts dsactiv
Vous pouvez afficher ou cacher la barre de raccourcis en cliquant sur la flche noire en haut droite.
Gestion des liens

Vous pouvez modifier la liste des raccourcis sur la page de configuration du module.
h
Cliquez sur le lien Modifier les raccourcis droite de la barre Shortcuts. Vous pouvez accder cette page de cette faon :
h h h
Menu Configuration Section Interface utilisateur Raccourcis Lien lister les liens de la ligne Par dfaut.
Saffiche alors la page qui liste les raccourcis. Dans cet exemple, vous allez ajouter un raccourci vers la page dajout dun article :
h h h
Cliquez sur le lien + Ajouter un raccourci Nom : Ajouter un article Chemin : node/add/article
250
Page dajout dun raccourci

h
Bouton Enregistrer
Le lien est ajout dans la barre et dans la liste
Il est possible de rorganiser les raccourcis et den dsactiver certains en les plaant dans la zone Dsactiv. Cela permet de ne pas avoir les recrer au moment ou vous en aurez nouveau besoin.
Ensemble de raccourcis
Vous pouvez crer des ensembles de raccourcis et ensuite permettre lutilisateur de choisir lequel il prfre afficher dans son profil.
h h
Menu Configuration Section Interface utilisateur Raccourcis
251
h h h
Lien + Ajouter un ensemble de raccourcis Nom de lensemble : A vos toques Bouton Crer un nouvel ensemble.
Le nouvel ensemble contient alors les raccourcis de lensemble par dfaut.
Liste des ensembles de raccourcis
Gestion des droits

Chaque utilisateur du site peut choisir la barre doutils quils prfrent utiliser. Pour cela, il faut tout dabord leur attribuer les droits daccs.
h h h h
Menu Personnes Onglet Droits daccs Section Shortcut Cochez la case Choisir un ensemble de raccourcis pour les utilisateurs identifis.
Droits daccs pour le module Shortcuts

h
Cliquez sur Enregistrer les droits daccs. Allez sur la page de compte dun utilisateur Onglet Raccourcis
prsent les utilisateurs peuvent choisir leur barre de raccourcis.

h h
252
Choix du menu de raccourcis par un utilisateur
3.4
Module filter : administration de la liste des modules
Voici un module trs simple mais qui peut savrer utile lorsquun grand nombre de modules sont activs sur votre installation Drupal.
Installation
h
Tlchargez, installez et activez le module (version utilise pour ce livre 7.x-1.5)
Utilisation
h
Menu Modules
Vous pouvez alors afficher les modules par catgories ou les filtrer selon certains critres.
Page module avec le module Filter activ
3.5
Token : des jetons pour les modules
Token est un module qui peut-tre utilis par dautres modules. Beaucoup des fonctionnalits de la version 6 sont intgres au coeur de Drupal 7. Cependant, une petite partie na pas t intgre.
253
Token permet dentrer des jetons dans certaines chanes de caractres qui seront ensuite remplacs par des valeurs variables. Par exemple, [current-page:title] sera remplac par le titre de la page.
Installation
h
Tlchargez et activez le module token (http://drupal.org/project/token) Version utilise pour ce livre 7.x-1.0-beta4 Allez sur la page daide du module Aide Token
Liste des Tokens diponibles
Utilisation
Vous ne pouvez pas utiliser le module Token seul. Ce sont les autres modules qui lutilisent. Voici quelques exemples :
Token dans Pathauto
254
Rpertoire du fichier pour un champs image
Pour insrer facilement un token, cliquez dabord dans la zone de texte ou vous dsirez linsrer puis sur le lien du Token. Il ny aura alors pas besoin de faire de copier/coller.
3.6
Google Analytics : mesurez laudience de votre site
Google Analytics est un service gratuit qui mesure laudience des sites web. Le module Drupal Google Analytics permet dajouter le code javascript adquat chaque page de votre site pour que Google Analytics puisse tablir ses rapports statistiques.
Installation
Le prrequis pour paramtrer le module est davoir un compte Google. Vous pouvez en crer un sur http://www.google.fr.
h
Tlchargez et activez le module Google Analytics (http://drupal.org/project/google_analytics) Version utilise pour ce livre 7.x-1.2
Configuration
h h h h h h h
Rendez-vous sur le site de Google Analytics : http://www.google.com/intl/fr/analytics/ Bouton Accder Google Analytics Connectez-vous avec votre compte Google Bouton Inscription Entrez lURL racine de votre site Drupal. Cliquez sur le bouton Continuer. Dans le code Javascript, notez bien le numro commencant par UA-xxxxxx-x
255
Votre site est sous surveillance
Vous pouvez retrouver ce code en cliquant sur le lien Modifier de votre site, puis sur le lien Vrifier ltat en haut droite du formulaire. Rendez-vous sur la page de configuration du module :
h h
Menu Configuration lien Google Analytics. Il faut maintenant entrer votre numro de compte de Google Analytics (UA-xxxxxx-x) dans le champ Numro du compte Google Analytics. Bouton Enregistrer la configuration
Quelques heures plus tard, vous devriez avoir accs aux statistiques de votre site
Un rapport de Google Analytics
3.7
Rules : automatisation de tches
Rules est un module qui permet dautomatiser des actions lorsque certains vnements se ralisent et en fonction de certaines conditions.
256
Voici des exemples dvnements : aprs lajout dun article ; lorsquun utilisateur se dconnecte ; aprs avoir effac un terme de taxonomie. Voici des exemples de condition : larticle est de type Recette ; lutilisateur a pour rle Rdacteur de recette ; le terme de taxonomie appartient au vocabulaire Tags . Voici des exemples dactions : envoyer un email ; afficher un message systme ; ajouter un terme de taxonomie. Via linterface de Rules, il est donc possible de combiner tout ces lments pour obtenir une fonctionnalit telle que Aprs lajout dun article de type Recette, envoyer un email lauteur de la node . Rules est un module trs vaste. Les rgles ralises ici noffrent quun petit aperu des possibilits du module.
h
Tlchargez et activez les module Entity API (http://drupal.org/project/entity) Version utilise pour ce livre 7.x-1.0-beta10 et Rules (http://drupal.org/project/rules) Version utilise pour ce livre 7.x-2.0-rc2 Le module Trigger intgr au coeur de Drupal contient les mmes fonctionnalits que Rules mais tend tre moins utilis.
3.7.1 Cration dune premire rgle

Lorsquun utilisateur se dconnecte du site, il est redirig vers la page daccueil du site. Votre premire rgle va rediriger lutilisateur vers une page dadieu si il a le rle Rdacteur de recettes .
h h h h
Commencez par ajouter une nouvelle node de type Page de base Titre : Au revoir Body : Merci davoir particip ce site en tant que crateur de recettes ! Alias dURL : byebye Menu Configuration lien Rgles (ou lien Configurer du module Rules) Lien + Ajouter une nouvelle rgle Nom : Redirection aprs dconnexion
Vous pouvez maintenant crer votre rgle :

h h h
257
Il faut galement choisir un vnement.

h
Ragir lvnement : dans la section Utilisateur, choisir Lutilisateur sest dconnect
Lassistant de cration dune rgle

h
Bouton Enregistrer
Un vnement est donc ajout. Vous allez maintenant ajouter laction dclencher lorsque cet vnement se ralise.
h h
Lien + Ajouter action Dans la liste, la section Systme, choisir Redirection de page Valeur : byebye (ou le chemin vers la page que vous avez cr) Bouton Enregistrer
La page se recharge alors, les options de configuration de laction saffichent :

h h
Le but de cette rgle est de ne rediriger que les utilisateurs ayant le rle Rdacteur de recette. Il faut donc ajouter cette condition :
h h h h
Lien + Ajouter condition Dans la liste, la section Utilisateur, choisir Lutilisateur a le(s) rle(s) Dans la liste des Rles, choisir Rdacteur de recettes Bouton Enregistrer
258
La rgle avec son vnement, sa condition et son action

h
Bouton Enregistrer les modifications
Vous pouvez maintenant tester votre rgle en vous dconnectant avec un utilisateur ayant pour rle Rdacteur de recettes.
Redirection de lutilisateur vers la page dadieu
Vrifiez galement quil ny a pas de redirection lorsque vous vous dconnectez avec lutilisateur administrateur.
3.7.2 Utilisation des valeurs des champs

Il est possible de crer des rgles en ajoutant des conditions sur les valeurs des champs des entits. Vous allez en crer une qui teste si une image est prsente sur une node de type recette lorsque celle-ci est ajoute au site ou quelle est modifie.
h h
Menu Configuration lien Rgles Lien + Ajouter une nouvelle rgle
259
h h h
Nom : message si pas dimage dans une recette Ragir lvnement : dans la section Noeud, choisir Aprs lenregistrement dun nouveau contenu Bouton Enregistrer
Laction se dclenchera alors lors de lajout dune nouvelle recette mais elle doit galement se dclencher lors de la mise jour dune recette. Il faut donc ajouter un deuxime vnement :
h h h
Lien + Add event Ragir lvnement : dans la section Noeud, choisir Aprs mise jour dun contenu existant Bouton Ajouter
Laction se dclenche pour deux vnements
Ajoutez maintenant laction dclencher. Rien de nouveau ici :

h h h h h
Lien + Ajouter action Dans la liste, la section Systme, choisir Show a message on the site Valeur : Cette recette na pas dimage ! Type de message : Avertissement Bouton Enregistrer Lien + Ajouter condition Dans la liste, la section Noeud, choisir Content is of type Dans la liste des Types de contenu, choisir Recette Bouton Enregistrer Lien + Ajouter condition Dans la liste, la section Donnes, choisir Data value is empty
Laction ne doit tre dclenche que pour les nodes de type Recette. Cette condition est simple galement :
h h h h
Reste ajouter une condition pour tester la valeur du champ image.

h h
La liste Data selector se complte au fur et mesure des lments slectionns. Si vous choisissez un item contenant (...), cela veut dire quil faudra slectionner un autre item ensuite :
h
Choisissez litem node:... (contenu cr)
260
Premire slection
La liste se recharge alors :

h
Choisissez alors node:field-image (Photo de la recette)
Deuxime slection
h h
Bouton Enregistrer Bouton Enregistrer les modifications ditez et sauvegardez une recette contenant une image : aucun message ne saffiche ; ditez et sauvegardez une recette ne contenant pas dimage : le message saffiche.
Vous pouvez maintenant tester la rgle :
Message davertissement
3.7.3 Exercice : envoyer un mail lorsquune recette chinoise est envoye

Crez une rgle qui envoie un mail ladresse recette_asie@example.com lorsquune recette ayant pour provenance Chine est cre.
Corrig
h h h h
Menu Configuration lien Rgles Lien + Ajouter une nouvelle rgle Nom : Mail pour recette chinoise Ragir lvnement : Dans la section Noeud, choisir Aprs lenregistrement dun nouveau contenu
261
Bouton Enregistrer Lien + Ajouter action Dans la liste, la section Systme, choisir Envoi de courriel Valeur : recette_asie@example.com (ou votre adresse mail) Sujet : Une nouvelle recette chinoise a t envoye par [node:author] Vous pouvez utiliser la section Motifs de substitution (Token) pour connatre la syntaxe des variables ajouter vos chanes.
Ajoutez maintenant laction :

h h h h
Les motifs de substitution disponibles pour un champ texte

h
Message : La recette [node:title] a t ajoute. <a href=[node:url]>Cliquez ici pour la consulter.</a> Bouton Enregistrer Lisez le chap. III 1.5 Configuration du serveur pour lenvoi de mail pour que votre installation Drupal puisse envoyer des mails.
Reste ajouter les conditions. La premire filtrera uniquement les nodes de type recette :
h h h h
Lien + Ajouter condition Dans la liste, la section Noeud, choisir Content is of type Dans la liste des Types de contenu, choisir Recette Bouton Enregistrer Lien + Ajouter condition Dans la liste, la section Donnes, choisir Data comparison Choisissez litem node:... (contenu cr) Choisissez litem node:provenance:... (Provenance)
Dans la seconde, on doit savoir si le terme de taxonomie du champ Provenance est Chine
h h h h
262
h h
Choisissez litem node:provenance:name (Nom) Bouton Continuer Oprateur : gale Valeur : Chine Bouton Enregistrer
Vous devez maintenant tester si le champ provenance est gale la chane Chine :
h h h
La rgle dans son ensemble

h
Crez une recette ayant pour provenance la Chine pour tester votre rgle.
Message reu !
4 - Contenu
263
4
4.1
Contenu
CKEditor : diteur Wysiwyg complet
Successeur de FCKEditor, CKEditor est lun des diteur Wysiwyg les plus utilis par la communaut Drupal, notamment grce sa bonne compatibilit avec IMCE et la possibilit de faire des imports de texte depuis Word sans perdre sa mise en forme. Le module Wysiwyg permet dinstaller cet diteur facilement.
h h
Menu Configuration Profils Wysiwyg la section Instructions dinstallation, rechercher CKEditor
Section CKEditor de Wysiwyg

h h h h
Cliquez sur le lien Tlcharger Tlcharger larchive de CKEditor (version utilise pour ce livre CKEditor 3.6.1) Extraire larchive dans /sites/all/libraries Recharger la page de configuration de Wysiwyg et vrifiez que Wysiwyg a bien localis CKEditor
CKEditor est prt tre utilis
Il faut maintenant crer un format de texte pour CKEditor.

h h h h h
Menu Configuration lien Formats de texte Lien + Ajouter un format de texte Nom : CKEditor Ne cochez aucun filtre Bouton Enregistrer la configuration
264
Associez lditeur CKEditor au format de texte :

h h h
Retournez sur la page de configuration des profils Wysiwyg : menu Configuration Profils Wysiwyg Choisissez lditeur CKEditor pour le Format de texte CKEditor cr Bouton Enregistrer Lien Modifier de la ligne CKEditor la section Configuration basique, choisissez Francais pour la langue la section Boutons et plugins, cochez les cases des fonctionnalits (boutons) que vous voulez ajouter votre diteur
Il reste modifier les options de lditeur :

h h h
Ajout des boutons

h
Bouton Enregistrer
Vous pouvez utiliser votre diteur en choisissant le format de texte CKEditor pour une zone de texte.
Lditeur en action
Regardez les fonctionnalits avances de type Agrandir, Collage partir de Word, Tableau, Afficher les blocs et vous aurez un aperu de la puissance de cet diteur.
4 - Contenu
265
4.2 IMCE : insrer des images dans un texte partir de CKEditor

Avec le module IMCE, vous pouvez tlcharger des images de votre disque dur dans votre diteur Wysiwyg. Des outils permettent ensuite de positionner et de redimensionner ces images. Le module install chap. II 3.4 Wysiwyg : installer un diteur Wysiwyg doivent tre installs et configurs
h
Tlchargez et activez le module IMCE (http://drupal.org/project/imce) Version utilise pour ce livre 7.x-1.4
Pour faire fonctionner IMCE avec le module Wysiwyg, il faut installer le module IMCE Wysiwyg bridge qui ne demande aucune configuration.
h
Tlchargez et activez le module IMCE Wysiwyg bridge (http://drupal.org/project/imce_wysiwyg) Version utilise pour ce livre 7.x-1.x-dev. Menu Configuration Profils Wysiwyg Lien Modifier de la ligne CKEditor la section Boutons et plugins, cochez loption IMCE qui est apparue
Le nouveau plugin IMCE doit tre ajout lditeur CKEditor :

h h h
IMCE et IMCE Wysiwyg bridge sont bien installs

h
Bouton Enregistrer Positionnez votre curseur lendroit ou vous dsirez placer limage Cliquez sur le bouton Image dans la barre doutils de CKEditor
Dans une zone de texte, slectionnez le format de texte CKEditor :

h h
Le bouton Image de lditeur
266
Fentre de proprit de limage

h h
Bouton Explorer le serveur Si IMCE est correctement install, vous devriez avoir un bouton Transfert de fichiers dans la fentre popup qui apparat Pointez vers un fichier image prsent sur votre disque dur en cliquant sur le bouton Choisissez un fichier
Bouton Transfert de fichiers
Si vous pensez utiliser les vos images en petits format, nhsitez pas crer des vignettes, cela conomisera de la bande passante. Il est possible dajouter de nouveaux formats sur la page de configuration de IMCE.
Rglage des nouveaux formats de vignettes
4 - Contenu
267
Limage se transfre alors sur le serveur et les vignettes sont cres.

h
Slectionnez limage dsire
Image afficher dans votre zone de texte

h
Cliquez sur le bouton Insrer un fichier
Vous retournez alors dans la fentre Proprit de limage ou vous pouvez positionner limage.
Fentre en float : right

h
Bouton OK Il est ensuite possible de positionner limage dans la zone de texte gre par CKeditor par glisser/dposer ou diter ses proprits grce un menu contextuel.
Modification de limage
268
4.3
Pathauto : crez automatiquement des alias d'url
Pathauto est un des modules les plus populaires de Drupal, il permet de crer automatiquement des alias durl pour tous les types de contenu. La construction dune URL est trs importante pour le rfrencement de votre site.
Installation
h
Tlchargez et activez le module token (http://drupal.org/project/token) Version utilise pour ce livre 7.x-1.0-beta4 Tlchargez et activez le module pathauto (http://drupal.org/project/pathauto) Version utilise pour ce livre 7.x-1.0-rc2
Utilisation
h
Menu Configuration Alias dURL (ou lien Configurer du module Pathauto) Onglet MODLES
Quatre onglets ont t ajouts cette page par Pathauto

h
Dans cet onglet, vous pouvez dfinir des modles pour les alias dURL pour des contenus de type Node, Taxonomie, Utilisateurs, etc. Par exemple, pour que les URL des recettes soient automatiquement de type : /recette/curry-de-pouletkorma, vous pouvez crer le modle suivant :
h
Motif de chemin pour tous les Recette : [node:content-type:machine-name]/[node:title]
Alias automatique pour les contenus de type recette
La section Motifs de substitution est gre par le module chap. IV 3.5 Token : des jetons pour les modules
h h
Bouton Enregistrer la configuration ditez une recette
4 - Contenu
269
h h
Onglet Paramtres des chemins dURL Cocher la case Alias Automatique
Alias automatique pour une recette

h
Bouton Enregistrer
Votre URL est alors construite selon le modle dfini. Si vous avez un grand nombre de nodes existantes et que vous crez ou modifiez un modle vous pouvez utiliser longlet Mise a jour massive de Pathauto. Cela peut vous viter la fastidieuse tche dditer les contenus un par un.
Mise jour des alias dURL de tous les contenus
Paramtres
Longlet Paramtres du module permet daffiner la construction de vos URL : Mode verbeux Sparateur Casse des caractres Longueur maximale dun alias Longueur maximale dun composant Action de mise jour Rduire les chanes des lettres et des chiffres Chanes (de caractres) retirer Ponctuation Affiche les alias durl crs en zone de notification lorsque Pathauto est utilis. Caractre despacement. Permet de passer tous les caractres en minuscules. Longueur maximum de lensemble dun alias. Longueur maximum dun lment de lalias. Lorsque Pathauto met jour un alias, lancien peut-tre gard. Cela est important pour les sites ayant du contenu dj rfrenc. vite davoir des caractres accentus dans les url. Permet de retirer cerains mots des urls (par exemple les articles). Remplace les caractres de ponctuation.
270
4.4
Search : un moteur de recherche simple
Vous avez peut-tre dj utilis le module Search qui est install et activ par dfaut. Au chap. I 2.3.2 Les rgions, vous avez dplac le bloc quil propose et qui affiche une zone de recherche.
Utilisation
h
Lorsque vous faites une recherche, une page de rsultats saffiche
Rsultat de la recherche
Cette page permet : de rechercher selon le type dentit (contenu, utilisateurs, etc.) ; dafficher une section de recherche avance permettant de filtrer selon la langue, le type de contenu, etc. ;
Section de recherche avance
daccder la liste des rsultats contenant le mot recherch.
4 - Contenu
271
Indexation du site
Si, lors de vos recherches, votre contenu nest pas trouv, il y a de fortes chances pour que lensemble du site ne soit pas index. Pour le vrifier, allez sur la page de configuration du module :
h
Menu Configuration lien Paramtres de recherche (ou lien configurer du module Search)
Le contenu du site nest pas entirement index par Search
Pour continuer lindexation du site, il faut lancer le Cron du site. chaque lancement du Cron, un certain nombre dlments supplmentaires sera index (paramtre Seuil dindexation). Chap. III 3.3. Le Cron
Configurer laffichage des rsultats

Lorsque le module Search trouve le mot recherch dans un type de contenu recette, il laffiche en commenant par le temps de prparation et le prix par personne. Cela naide pas lutilisateur savoir si cest le contenu quil cherche. Pour modifier cet affichage :
h h h h h
Menu Structure lien Types de contenu Lien grer laffichage du type recette En bas de la page, la section CUSTOM DISPLAY SETTINGS, cocher Rsultat de la recherche En haut de la page slectionner laffichage Rsultat de la recherche Pour les champs Temps de prparation et Prix par personne, choisir le format Cach
272
Le champ Prix par personne napparatra pas dans les rsultats de la recherche
h
Bouton Enregistrer
Rsultat sans les champs parasites
4.5
Image : crez des styles dimage personnaliss
Il existe par dfaut trois styles dimages que vous avez peut-tre dj utilis : thumbnail, medium et large. Linterface dadministration du module Image permet de crer de nouveaux styles :
h h
Ce module fait partie du coeur de Drupal et il est activ par dfaut Menu Configuration lien Styles dimages (section Mdia)
Saffiche alors la liste des trois styles dimages pr-dfinis. thumbnail medium large Mise lchelle 100x100 Mise lchelle 150x150 Mise lchelle 200x200
Vous allez crer un style qui met limage en noir et blanc et la redimensionne en 100 pixels par 100 pixels en rognant les cots du bord trop grand.
h h h h
Cliquez sur + Ajouter un style Nom du style : miniature-recadree-nb Dans la liste Slectionner un nouveau effet, choisissez Dsaturer Bouton Ajouter
4 - Contenu
273
Vous pouvez constater dans laperu que vos images vont passer en noir et blanc. Vous pouvez combiner plusieurs effets pour un style.
h
Dans la liste Slectionner un nouvel effet, choisissez Mettre lchelle et recadrage Largeur : 100 pixels Hauteur : 100 pixels Bouton Ajouter un effet
Vous pouvez alors rgler les paramtres de leffet choisi :

h h h
Le nouvel effet ajout

h
Bouton Mettre jour le style Recadrage dune image, vous pouvez entrer la largeur et la hauteur de limage en pixel ou pourcentage, ainsi que le point de dpart de ce recadrage (Ancre). Passe une image en niveaux de gris. Redimensionne une image sans conserver son aspect. Grce cette action, il est possible dtendre ou dallonger une image. Effectue une rotation de limage du nombre de degrs spcifi. Tourne dans le sens des aiguilles dune montre. Mise lchelle de limage. Vous pouvez spcifier une hauteur dimage, la largeur sera alors calcule pour que laspect de limage soit conserv. Cr une mise lchelle de limage en hauteur et largeur, mais dcoupe limage si celle-ci ne rentre pas dans le cadre.
Voici la liste des effets disponibles pour construire vos styles : Recadrer Dsaturer Redimensionner Rotation Mettre lchelle Mettre lchelle et recadrage
274
Vous pouvez ensuite utiliser ce style pour tout les champs image :
h h h h
Menu Structure lien Types de contenu Ligne Article Lien grer laffichage Cliquez sur le bouton droite du Style de limage
Utilisation de votre nouveau style
Les images modifies sont enregistres dans le rpertoire /sites/default/styles/nomdustyle
4.6 Display suite : prsentez vos contenus en utilisant linterface de Drupal

Voici un module vraiment pratique si vous avez du mal apprhender le systme complexe de theming sous Drupal. Display Suite permet de prsenter les champs des entits grce des mises en pages prdfinies. Ce module comporte de nombreuses fonctionnalits et vous pourrez parfois hsiter entre utiliser celui-ci ou Views. Sachez que Views est un module plus rpandu.
h
Tlchargez et activez le module Display Suite (http://drupal.org/project/ds) Version utilise pour ce livre 7.x-1.3
4.6.1 Personnaliser laffichage par dfaut

Vous allez personnaliser laffichage dun contenu de type recette en positionnant ses diffrents champs sur une mise en page contenant quatre rgions. Le module Display Suite a largement modifi la page grer laffichage des entits :
h h
Menu Strucure lien Types de contenu Lien grer laffichage du type Recette
Deux nouveaux onglets horizontaux apparaissent en bas de page. Il faut commencer par choisir longlet Mise en page :
4 - Contenu
275
Onglet Mise en page pour recette dans default
Les diffrentes mise en page de Display suite

h
Choisir la mise en page Deux colonnes empiles Loption Dsactiver les blocs/rgions Drupal permet de ne pas afficher les barres latrales pour ce type de contenu. Ainsi, vous pouvez prvoir une mise en page qui prend toute la largeur de la page.
Bouton Enregistrer
En choisissant un style de mise en page, vous confiez Display Suite le soin dafficher le contenu des nodes pour le mode daffichage Par dfaut. Le style de mise en page Deux colonnes empiles propose quatres rgions. Il suffit maintenant de les garnir de champs par simple glisser/dposer.
Les quatres rgions du style de mise en page
276
Constatez galement que de nouveaux champs sont disponibles sur cette page (Titre, Lire la suite, Auteur, etc.)
De nouveaux champs sont disponibles pour laffichage

h
Positionnez les champs comme sur les copies dcran suivantes (pensez galement rgler les tiquettes et les formats)
La rgion den-tte
La rgion de gauche
La rgion de droite
4 - Contenu
277
La rgion Pied de page

h
Bouton Enregistrer
Rendu de la node
Pour amliorer cet affichage, il faudra ajouter un peu de code CSS. Ne modifiez pas directement les fichiers CSS de Display Suite, sachez quil est possible de crer un thme uniquement pour intgrer une seule feuille CSS (chap. V 3 Crer un thme partir dun design HTML/CSS).
278
4.6.2 Exercice : crer un mode daffichage pour laccroche

Faites en sorte que les recettes saffichent comme sur la copie dcran suivante sur la page daccueil :
Accroches pour un type de contenu Recette
Corrig
Il faut commencer par choisir une mise en page pour le mode Accroche
h h h h h h
Menu Strucure lien Types de contenu Lien grer laffichage du type Recette Mode daffichage : Accroche Onglet Mise en page pour recette dans teaser Choisir la mise en page Trois colonnes empiles fluides 25/50/25 Bouton Enregistrer Positionnez les champs comme sur la copie dcran suivante (noubliez pas de mettre un lien sur le titre)
Reste disposer les champs dans les rgions.

h
4 - Contenu
279
Disposition des champs pour laccroche
4.6.3 Cration dun champ personnalis

En bas de la page Grer laffichage ou une mise en page Display Suite est slectionne, un onglet Add custom Field est disponible. Cette section permet dajouter diffrents types de champs.
Section dajout de champs personnaliss de Display Suite
Code field
Permet dajouter un champs calcul partir de code PHP ou de jetons Token (chap. IV 3.5 Token : des jetons pour les modules).
280
h h h h
Cliquez sur le bouton Add a code field Etiquette : Nid Entits : cochez Node Champ de code : <?php print $entity->nid; ?>
Ajout dun champ code

h h
Bouton Enregistrer Un nouveau champ Nid sajoute la liste, placez le en rgion Pied de page
Le nouveau champ
h
Bouton Enregistrer
Rendu du champ dans la node
Il est possible de modifier les champs personnaliss sur la page de configuration de Display Suite :
h h
Menu Structure lien Display Suite Lien Champs
4 - Contenu
281
Vous pouvez connatre lensemble des variables disponibles en entrant le code PHP suivant dans un champ code et en ayant activ le module Devel (chap. VI 3.1. Devel : simplifiez votre vie de dveloppeur) :
h
Champ de code : <?php dpm(get_defined_vars()); ?>
Affichage des variables disponibles dans un champ Code Field
Vous pouvez galement utiliser des Jetons (Token) dans la zone Champ de code. Ici le rsultat aurait t le mme avec le jeton :
h
Champ de code : [node:nid]
Block field
Permet dafficher un bloc lintrieur du contenu. Il est par exemple possible dafficher le bloc trois recettes au hasard (chap. II 1.3. Gestion des affichages) en dessous de la liste des ingrdients :
h h h h
Bouton Add a block field Etiquette : 3 autres recettes Entits : cochez Node Bloc : Trois recettes au hasard
Ajout dun champ Block field

h h h
Bouton Enregistrer Placez le nouveau champ 3 autres recettes en rgion Gauche Bouton Enregistrer
282
Un bloc lintrieur dun contenu
4.6.4 Intgration Views

Display Suite peut fonctionner avec le module Views en mettant disposition de nouveaux styles daffichage. Dans cet exemple, un nouveau style daffichage de la node contenant uniquement le titre et la photo sera cr et ensuite utilis dans Views.
h h h h h h
Menu Structure lien Display suite Lien View modes Lien + Add a view mode tiquette : Titre et photo Entits : cochez Node Bouton Enregistrer Menu Strucure lien Types de contenu Lien grer laffichage du type Recette En bas de page cochez le mode daffichage Titre et photo
Un nouveau mode daffichage est alors cr, activez-le pour le type de contenu Recette :
h h h
Le nouveau mode daffichage cr par Display Suite
4 - Contenu
283
h h
Bouton Enregistrer Slectionnez le mode Titre et photo (bouton en haut de page)
Le mode est activ

h h h
Slectionnez la mise en page Deux colonnes Bouton Enregistrer Positionnez les champs comme sur la copie dcran suivante
Une photo et un titre
Vous pouvez maintenant utiliser ce mode daffichage avec Views :

h h h h
Menu Structure lien Vues Lien modifier de la vue Liste des recettes (chap. II 1.2. Cration dune vue liste des recettes) Lien +Add dans la zone des Affichages Lien Ajouter Page
Ajout dun nouvel affichage dans la vue

h h
Lien Chemin : liste_recettes_ds Bouton Appliquer Format : Liste non mise en forme Choisir Ce(tte) page (supplanter) dans la liste en haut de page Bouton Appliquer (cet affichage) nouveau bouton Appliquer (cet affichage)
Il reste maintenant utiliser le format mis disposition par Display Suite :

h h h h
284
h h
Lien Champs Choisir le style Display suite
Le nouveau style de Display suite

h
Bouton Appliquer (cet affichage) Mode de visualisation par dfaut : Titre et photo
Il faut maintenant choisir le mode daffichage que vous avez cr :

h
La liste des modes daffichages des nodes

h h
Bouton Appliquer (cet affichage) Affichez la page de la vue
Liste des recettes avec Display Suite et Views
5 - Site coopratif
285
Vous auriez pu raliser cet affichage avec Views. Vous pourrez donc parfois hsiter entre les deux mthodes. Je vous conseille dutiliser Views pour plusieurs raisons : Views est un module plus rpandu, donc mieux connu. Votre site sera donc plus facile maintenir ; Votre vue sera alors configurable uniquement avec linterface de views et non avec les interfaces des deux modules.
Site coopratif
5.1 Blog : donnez la possibilit vos utilisateurs de possder un blog

Vous pouvez proposer chacun de vos utilisateurs de crer un blog.
h
Le module Blog fait partie du coeur de Drupal, il suffit donc de lactiver
Configuration
Ce module permet aux utilisateurs enregistrs davoir chacun leur propre blog. Commencez par configurer les droits daccs du module blog :
h
Menu Personnes onglet Droits
Seul les rdacteurs de recettes ont droit leur blog
Utilisation
Un nouveau type de contenu Billet de blog est disponible :
h h
Connectez vous avec un utilisateur ayant pour rle Rdacteur de recettes Crez un ou deux billets en utilisant le bloc Navigation Ajouter du contenu
286
Blog dun utilisateur
LURL blog affiche la liste des billets de tous les utilisateurs. Les URLs blog/id_utilisateur affichent la liste des billets dun utilisateur.
En activant le module Blog, vous avez accs un bloc listant les derniers billets.
5.2
h
Forum : crez un lieu dchange pour vos utilisateurs
Le module Forum, prsent par dfaut dans Drupal, permet de crer un forum minimaliste. Le module Forum fait partie du coeur de Drupal, il suffit donc de lactiver
Configuration
h
Menu Structure lien Forums Lien + Ajouter un forum Nom du forum : Techniques de cuisine Description : Partagez ici des astuces de cuisine Bouton Enregistrer Lien + Ajouter un forum
Un forum Discussion gnral est automatiquement ajout, vous allez en ajouter un autre :
h h h h
Ajoutez-en un deuxime :
h
5 - Site coopratif
287
h h h
Nom du forum : Rdigez une recette Description : Problmes rencontrs sur le site Bouton Enregistrer
Pour plus de clart dans lorganisation de vos forums, vous pouvez crer des conteneurs qui regrouperont les forums traitant du mme sujet :
h h h
Lien + Ajouter un conteneur Nom du conteneur : Site vos toques Bouton Enregistrer
Il est ensuite possible de rorganiser lordre des forums et de les placer dans un conteneur.
Organisation des forums de votre site

h
Bouton Enregistrer
Utilisation
Vous pouvez maintenant utiliser vos forums :
h h
Rendez-vous lurl /forum Ajoutez quelques sujets en cliquant sur un forum puis sur le lien + Ajouter un nouveau sujet de discussion Vous pouvez galement poster quelques rponses ces sujets
La page des forums commence se garnir !
288
Le module Forum utilise dautres modules de Drupal : le module Node pour le premier message des sujets ; le module Comment pour les rponses aux sujets ; le module Taxonomy pour la cration des forums et des conteneurs (vocabulaire Forums).
5.3
Advanced Forum
Le module Advanced forum permet, en quelques clics, de faire ressembler les forums Drupal... aux vrais forums que vous rencontrez sur internet. Il possde galement une page ou vous pourrez configurer diverses options.
h
Tlchargez et activez le module Avanced Forum (http://drupal.org/project/advanced_forum) Version utilise pour ce livre 7.x-2.0-beta1
Les diverses pages des forums ont un nouveau style plus engageant.
Page des forums avec Advanced forum
Advanced Forum propose une page doptions pour grer lapparence des forums :
h
Menu Configuration lien Advanced Forums
5 - Site coopratif
289
Advanced Forum met disposition un certain nombre de blocs et de pages que vous pouvez modifier avec Views :
h
Menu Structure lien Vues
5.4
h
Contact
Le module Contact propose un formulaire de contact pour le site et dautres pour chacun des utilisateurs. Le module Contact fait partie du coeur de Drupal, il suffit donc de lactiver
Utilisation
h
Une page de contact est disponible ladresse /contact, vous pouvez faire un lien de menu ou un bloc pour diriger lutilisateur vers cette page
La page de contact par dfaut
Pour que le formulaire de contact fonctionne, il faut configurer le serveur : chap. III 1.5 Configuration du serveur pour lenvoi de mail
290
galement, un formulaire de contact est disponible pour chaque utilisateur du site sur sa page de profil :
Contacter un utilisateur par mail
5.5
Webform : crez des formulaires
Ce module permet de crer des questionnaires laide de toute sortes de composants (zone de texte, liste, case cocher, etc.) et de les associer une node. Vous pourrez ensuite rcuprer ces rsultats sous diffrentes formes.
Installation
h
Tlchargez et activez le module Webform (http://drupal.org/project/webform) Version utilise pour ce livre 7.x-3.13
Configuration
Vous allez crer un formulaire permettant aux utilisateurs de sinscrire un repas. Dans ce formulaire, il sera demand lutilisateur dentrer son nom, son prnom, son email et le plat quil dsire.
h h h
Menu Contenu lien + Ajouter un contenu Lien Webform Titre : Inscription au repas annuel Body : Merci de remplir les champs suivants et de valider votre inscription Bouton Enregistrer
Crez une node qui prsentra votre formulaire :

h h h
Saffiche alors la page de configuration des champs du formulaire.
5 - Site coopratif
291
Page de configuration des champs du formulaire
Commencez par crer le premier champ nom :

h h h h
tiquette : Nom et prnom Type : Champ texte Cochez Obligatoire Bouton Ajouter Valeur par dfaut : %username Ce champ est un Token, chap. IV 3.5.3 Token : des jetons pour les modules
Saffiche alors la page de configuration du champ Nom :

h
Bouton Enregistrer le composant Nom : Email Type : courriel Bouton Ajouter Valeur par dfaut : %usermail Bouton Enregistrer le composant Nom : Choix du plat Type : Liste droulante
De la mme faon, ajoutez le champ mail :

h h h
Saffiche alors la page de configuration du champ :

h h
Reste le dernier champ qui affichera la liste des plats sous forme doptions :
h h
292
h h
Cochez Obligatoire Bouton Ajouter Options :
Dans la page de configuration, il faut lister les options qui safficheront dans la liste :
h
Liste des options

h
Bouton Enregistrer le composant
Les trois composants sont crs

h
Bouton Enregistrer Le bouton Courriels permet denvoyer un mail contenant la valeur des champs chaque validation du formulaire. Le bouton Paramtres du formulaires permet de configurer certaines options du formulaires (messages affichs, redirection, etc.)
Utilisation
Vous pouvez tester votre formulaire en vous inscrivant votre repas :
h h
Cliquez sur longlet Voir Remplissez votre formulaire
5 - Site coopratif
293
Votre formulaire en action !

h h
Bouton Soumettre Essayez de remplir ce formulaire plusieurs fois avec diffrentes valeurs Il est possible dafficher des formulaires avec nimporte quel type de node en configurant la page menu Configuration lien Paramtres de Webform
Rsultats
Vous pouvez alors consulter les rsultats de votre formulaire :
h h
Onglet Rsultats Onglet Tableau
Rsultats du formulaire sous forme de tableau.
294
Vous obtenez alors un aperu des rponses envoyes via votre formulaire. Il est possible de les consulter grce aux diffrents onglets : Soumissions Analyses Tableau Tlchargement Effacer Liste des formulaires soumis Statistiques sur les diffrents champs Listes des formulaires soumis et de la valeur de chaque champs Exportation des formulaires pour traitement dans une base de donnes ou un tableur Efface lensemble des formulaires soumis
Liste des types de composants disponibles

Voici deux copies dcrans qui prsentent les diffrents composants qui vous permettront de composer vos formulaires :
Les champs de Webform disponibles
5 - Site coopratif
295
Et dautres champs
Date Courriel Fichier Groupe de champs Grille Cach Balisage Saut de page Liste droulante Zone de texte Champ texte Heure
Affiche des listes droulantes pour choisir une date ainsi que formulaire jQuery Affiche un champ email Permet lutilisateur du formulaire de joindre un fichier. Il est possible de nautoriser que certains types de fichiers Permet de regrouper les champs par section. Ces sections peuvent tre pliantes. Permet de proposer des questions sous forme de tableau Permet dinsrer un champ cach Permet dinsrer un texte, du code HTML ou PHP dans votre formulaire Permet de diviser son formulaire en plusieurs pages. Des boutons Prcdent et Suivant permettent de naviguer entre ces pages Affiche une liste de choix sous forme de liste ou de liste droulante. Les options Multiple et Liste droulante permettent dobtenir diffrents Widgets Affiche une zone de texte sur plusieurs lignes Affiche une zone de texte sur une ligne Affiche des listes droulantes pour choisir une heure
296
5.6
Fivestar : notez vos contenus
Fivestar est le module dvaluation de contenu le plus populaire pour Drupal. Il se prsente sous la forme dun type de champs quil est possible dajouter nimporte quelle entit (node, utilisateur, terme de taxonmie, etc). Il sappuie sur le fameux module Voting API qui tait utilis par beaucoup de modules de votes dans Drupal 6.
h
Tlchargez et activez les module Voting API (http://drupal.org/project/votingapi) Version utilise pour ce livre 7.x-2.4 et Fivestar (http://drupal.org/project/fivestar) Version utilise pour ce livre 7.x-2.0-dev
Ajout dun champ Fivestar

Il est possible dajouter un champ Fivestar sur nimporte quel type dentit. Dans cet exemple, vous allez lajouter sur le type de contenu Recette (chap. II 4.2 Cration dun nouveau type de contenu)
h h h h h h
Menu Structure lien Types de contenu Lien grer les champs du type Recette tiquette : Notez cette recette Nom du champ : rate_recette Type de donnes stocker : Fivestar Rating lment du formulaire pour ldition des donnes : Stars (rated while viewing) Trois types de widgets sont disponibles pour le type Fivestar Rating : Stars (rated while viewing) : lvaluation se fait lorsque la node est affiche ; Stars (rated while editing) : lvaluation se fait lorsque la node est dite grce des toiles, cest le rdacteur qui note le contenu ; Stars (rated while editing) : lvaluation se fait lorsque la node est dite grce une liste droulante.
h h
Bouton Enregistrer Voting Tag : vote Il est possible de crer de nouveaux Voting Tag pour les votes dans la page de configuration de Fivestar (menu Configuration lien Fivestar). Cela permettra ensuite de regrouper et de faire des calculs sur les votes selon ces tags.
Bouton Enregistrer les paramtres du champ
La page de configuration dun champ texte saffiche alors. Vous pouvez configurer ici le nombre dtoiles afficher (entre 1 et 10).
h
5 - Site coopratif
297
Utilisation
h
Affichez une node de type recette
Affichage de Fivestar
Configuration de laffichage
Il est possible de configurer laffichage de Fivestar, de nombreux styles existent par dfaut :
h h h
Menu Structure lien Types de contenu Lien grer laffichage du type Recette Cliquez sur le bouton engrenage du champs Notez cette recette
Modification de laffichage du champs Fivestar
De nouveaux types Relations sont disponibles dans Views pour effectuer des calculs sur les votes effectus.
Les nouvelles relations de Voting API
298
Blocs, menus
6.1 Taxonomy menu : affichez vos vocabulaires dans des menus

Aprs avoir ajout des vocabulaires et des termes de taxonomy (chap. II 4.3. Taxonomy : classer le contenu), vous aimeriez peut-tre les exposer sous forme de menus ou de blocs sur votre site. Taxonomy_menu permet cela et remet jour automatiquement ces blocs et menus lors de lajout de contenus associs ou de termes.
Pour bien comprendre le fonctionnement de ce module, lisez dabord les chap. II 4.3. Taxonomy : Classer le contenu, chap. II 2.2. Menu : les menus et chap. 2.1 Block : les blocs
h
Tlchargez et activez les module Taxonomy Menu (http://drupal.org/project/taxonomy_menu) Version utilise pour ce livre 7.x-1.2
Configuration
Taxonomy menu permet dafficher un vocabulaire dans un menu. Dans lexemple qui va suivre, vous allez afficher le vocabulaire Provenance dans un nouveau menu appell galement provenance. Commencez par crer le menu :
h h h h
Menu Structure lien Menus Lien + Ajouter un menu Titre : Provenance Bouton Enregistrer
Le module ne possde pas sa propre page de configuration mais il ajoute une section a chaque vocabulaire de taxonomie :
h h h
Menu Structure lien Taxonomie Lien modifier le vocabulaire du vocabulaire Provenance Dans la liste Emplacement du menu, choisir <Provenance>
6 - Blocs, menus
299
Section de configuration de Taxonomy menu

h
Bouton Enregistrer Menu Structure lien Blocs Choisissez la rgion Premire barre latrale pour le bloc Provenance Bouton Enregistrer les blocs
Il ne reste plus qu afficher le bloc du menu Provenance en premire barre latrale :

h h h
Le vocabulaire Provenance affich dans un bloc !
6.2
Menu Block : divisez, liez et organisez vos blocs
Tout menu de Drupal peut tre affich dans un bloc. Mais, vous pourriez avoir besoin de sparer ce bloc en deux ou de lier un bloc de menu un autre. Menu Block offre des options de configuration spcifiques pour les blocs crs partir des menus. Dans cette exemple, vous allez reprendre votre bloc Provenance cr prcdemment (chap. IV - 6.1 Taxonomy menu : affichez vos vocabulaires dans des menus) et afficher le niveau 1 du menu (les continents) dans un bloc en premire barre latrale et lautre partie du menu dans un autre bloc en deuxime barre latrale.
300
Installation
h
Tlchargez et activez le module Menu Block (http://drupal.org/project/menu_block) Version utilise pour ce livre 7.x-2.2
Configuration
Menu block permet de crer des blocs dun genre nouveau :
h
Ajout dun bloc spcial menu block

h h h h h h h
Lien + Add menu block Titre du bloc : Navigation principale Titre pour ladministration : Navigation principale Menu : Provenance Niveau de dpart : 1er niveau (primaire) Profondeur maximale : 1 Choisissez Premire barre latrale pour le thme Bartik
Cration dun menu block
6 - Blocs, menus
301
Bouton Enregistrer le bloc
Premier niveau du vocabulaire Provenance
Il sagit maintenant de crer un second bloc qui affichera les niveaux suivants du vocabulaire provenance :
h h h h h h h h h
Menu Structure lien Blocs Lien + Add menu block Titre du bloc : Navigation secondaire Titre pour ladministration : Navigation secondaire Menu : Provenance Niveau de dpart : 2me niveau (secondaire) Profondeur maximale : illimit Choisissez Sidebar second (barre de droite) pour le thme Bartik Bouton Enregistrer le bloc
Les deux blocs menus blocs sont en lien
Menu block est utilis sur les sites qui ont une navigation principale en en-tte et une navigation secondaire en barre latrale.
302
6.3
Nice Menus : rendez vos menus dynamiques
Ce module transforme vos blocs de menus en menus droulants grce au plugin jQuery Superfish (http://users.tpg.com.au/j_birch/plugins/superfish/). Ils peuvent se drouler de droite gauche, de gauche droite ou de haut en bas. Lexemple utilis pour ce module suppose que vous ayez cr le bloc Nos recettes comme indiqu dans chap. IV 6.1. - Taxonomy_menu : affichez vos vocabulaires dans des menus.
h
Tlchargez et activez les module Nice Menus (http://drupal.org/project/nice_menus) Version utilise pour ce livre 7.x-2.0
Utilisation
lactivation de Nice Menus, 2 blocs sont crs (Nice Menu 1 et Nice Menu 2). Il faut configurer ces blocs pour leur indiquer quel sera leur contenu.
h
Les deux blocs crs par Nice menu

h h h h h h h
Cliquez sur le lien configurer du bloc Nice menu 1 (Nice Menu). Titre du bloc : Provenance Menu Name : Provenance Menu Parent : Provenance Menu Style : Right Choisissez Premire barre latrale pour le thme Bartik Cliquez sur le bouton Enregistrer le bloc
Nice Menu en action !
6 - Blocs, menus
303
Configuration
Une page de configuration permet de rgler certains paramtres de Nice Menu :
h
Menu Configuration lien Nice menus Nombres de blocs crer par Nice Menus Si la case n'est pas coche Nice Menus utilise uniquement CSS pour crer les menus. Dans le cas contraire, il utilise le plugin jQuery Superfish
Numro Use Javascript
Les options de Nice Menu
Modifier lapparence des menus

Lapparence de menus avec Nice Menus est entirement personnalisable avec CSS. Pour cela, vous devez copier le fichier /sites/all/modules/nice_menus/nice_menus_default.css dans votre rpertoire de thme. Vous pouvez indiquer le nom et le chemin de votre propre fichier CSS sur la page de configuration des thmes :
h h
Menu Apparence Lien Paramtres du thme actif
Modification du fichier CSS de Nice Menus
304
Commerce : crez une boutique
Le module Commerce permet dintgrer une boutique complte votre site Drupal. Ce module est totalement nouveau et na plus rien en commun avec Ubercart, son anctre pour Drupal 6, si ce nest son auteur (Ryan Szrama). Le module Drupal Commerce utilise, pour sa configuration, de nombreux autres modules tels que Entity API, Field, Views ou encore Rules. Ainsi, il est possible de configurer de nombreux paramtres de Drupal Commerce par l'interface : configuration des modules de Drupal Commerce pour une utilisation simple ; configuration des modules tiers pour une modifier lapparence (Views) ou le comportement (Rules) ; dveloppement de nouveaux modules pouvant sinterfacer avec Drupal Commerce. Cette prsentation dbutera par une prise en main rapide durant laquelle vous mettrez en place une boutique complte (cration de produit, mise en place du panier, cration dune commandes et gestion des paiements). Ensuite, vous dcouvrirez tous les lments que Drupal Commerce met votre disposition (vues, entits, rgles, etc.). Enfin, vous dcouvrirez comment modifier ces lments grce quelques exemples prcis. Nessayez pas de crer une boutique avec Drupal Commerce sans avant de matriser les grands principes de Drupal. Au minimum, lisez les parties I et II de ce livre.
7.1
Dmarrage rapide
7.1.1 Installation et configuration

Drupal commerce utilise un grand nombre de modules de la communaut Drupal, il est donc normal quil ait un grand nombre de dpendances :
h
Tlchargez et activez les modules Entity API (http://drupal.org/project/entity) version utilise pour ce livre 7.x-1.0-beta10, Rules (http://drupal.org/project/rules) version utilise pour ce livre 7.x-2.0-rc2, Views (http://drupal.org/project/rules) version utilise pour ce livre 7.x-3.0-rc1 et Adress Field (http://drupal.org/project/adressfield) version utilise pour ce livre 7.x-1.0-beta2 Tlchargez le module Commerce (http://drupal.org/project/commerce) version utilise pour ce livre 7.x-1.0 Drupal Commerce intgre 21 modules au moment de la rdaction de cet ouvrage. Vous activerez ces modules au fur et mesure de leur utilisation.
7 - Commerce : crez une boutique
305
Commencez par activer les modules Commerce et Commerce UI Les modules se terminant par UI (User Interface) servent linterface utilisateur du module.
Un nouveau menu Boutique apparat dans la barre de menu. Cest partir de ce menu que vous pourrez effectuer la majorit des tches dadministration du module. Pour commencer, vous pouvez configurer les devises qui seront utilises sur votre site :
h h h h
Menu Boutique lien Configuration Lien Paramtres des devises Devise par dfaut de la boutique : EUR Euro Bouton Enregistrer la configuration
7.1.2 Cration dun premier produit

Commencez par crer un premier produit (un robot multifonction 79 EUR) pour votre boutique. Il faut pour cela activer de nouveaux modules :
h
Activer les modules Product, Price et Product UI Le module Price est ncessaire car un produit contient un champ prix.
h h h
Menu Boutique lien Produits Lien + Ajouter un produit SKU : robot-multifonction (cest la rfrence de votre produit et elle doit tre unique sur lensemble de votre site) Titre : Robot multifonction Prix : 79
h h
Ajout dun produit la boutique

h
Bouton Enregistrer le produit
306
7.1.3 Affichage des produits dans une node

Votre nouveau produit est maintenant cr... mais vous ne pouvez pas lafficher ! En effet, les produits sont des entits part entire et non des nodes. Pour les afficher, il faut les lier une node grce un nouveau type de champ propos par Drupal commerce :
h
Activez le module Product Reference Menu Structure lien Types de contenu Lien + Ajouter un type de contenu Nom : Produit Description : Node lier des produits existants dans la boutique Bouton Enregistrer et ajouter les champs
Commencez par crer un nouveau type de contenu Produit :

h h h h h
Il faut maintenant ajouter des champs votre type de contenu. Ici, vous ajouterez un champ image pour votre produit et un champ " rfrence produit " pour lier les produits :
h
Lien grer les champs du type Produit Dans la liste Champ partager, slectionnez le champ Image : field_image Etiquette : Image Bouton Enregistrer Bouton Enregistrer les paramtres Etiquette : Image field_produit Type de donnes : Rfrence produit Elment de formulaire : Champ autocompltion Bouton Enregistrer Bouton Enregistrer les paramtres du champ
la section Ajouter un champ existant :

h h h h
Maintenant, ajoutez le champ rfrence produit, la section Ajouter un nouveau champ :

h h h h h h
La page de configuration dun champ de type rfrence produit saffiche alors. Pour ce produit, les paramtres par dfaut conviennent.
h
307
Le type de contenu Produit
Crez une node de type produit en la liant au robot :

h h
Menu Contenu Lien + Ajouter un contenu
Crez la node comme sur la copie dcran suivante :
Lier une node un produit

h
Bouton Enregistrer
La node saffiche alors avec un lien vers le produit de votre boutique, ce qui est encore loin dtre parfait, mais vous allez l'amliorer.
308
7.1.4 Le panier
Le module Cart (Panier) permet dafficher des boutons Ajouter au panier et de grer le panier utilisateur via un bloc et une page.
h
Activez le module Cart Menu Structure lien Types de contenu Lien grer laffichage du type Produit Pour la ligne produit, choisir le format Formulaire dajout au panier
La node doit afficher le bouton dajout au panier en lieu et place du lien vers le produit :
h h h
Modification de laffichage du produit

h
Bouton Enregistrer
Affichage du produit
Vous pouvez grer laffichage des diffrents champs sur la page grer laffichage du type Produit.
h
Vous pouvez maintenant ajouter votre article au panier !
Affichage du panier
Votre article est au panier mais o est votre panier ? Il peut safficher sous forme de bloc :
309
h h
Menu Structure lien Blocs Choisir la rgion Premire barre latrale pour le bloc Panier
Le bloc Panier
Le lien Voir le panier affiche une page qui permet de grer les quantit et les lignes du panier.
Dtail du panier
Vous pouvez modifier le format daffichage dajout au panier pour ajouter un widget de quantit cot du bouton Ajouter au panier.
Modification du formulaire dajout au panier
Affichage de la node et des quantits ajouter
310
7.1.5 Commandes
Le panier tant maintenant rempli, vous pouvez passer commande.
h h
Activez le module Order UI Cliquez sur le lien Valider la commande du panier
cran de validation de la commande
7.1.6 Paiement
Dernire tape : il faut effectuer un paiement ! Drupal Commerce propose pour cela un module permettant de simuler un paiement fictif :
h h
Activer les modules Payment, Payment UI et Payment Method Example Bouton Passez ltape suivante de lcran de commande Entrez une chane de plus dun caractre dans la zone Nom du paiement
Une page rsumant la commande se charge avec une section permettant de choisir le mode de paiement
h
Payez la commande
Le module Payment Method Example teste seulement si la zone nom contient plus dun caractre. Dans le cas inverse, le paiement est refus. Ce module permet donc de tester les divers tats d'un paiement.
h
Bouton Passez ltape suivante
311
Une nouvelle page vous indique que la commande est complte. Le client peut y voir la liste des commandes passes sur le site depuis son profil :
h
Lien Bonjour admin Onglet Commandes
Liste des commandes dun client
7.1.7 Gestion des commandes

Cot vendeur, une page permet la gestion des commandes :
h
Menu Boutique lien Commandes
Liste des commandes du site
partir de cette ligne, vous pouvez effectuer diffrentes oprations : voir : voir la commande ; modifier : changer le contenu de la commande, ladresse du client et surtout, le statut de la commande ;
Modification du statut dune commande
paiement : consulter la balance des paiements pour savoir si le paiement a t effectu et par quel moyen ; supprimer : supprimer la commande.
312
7.2
Les lments de Drupal Commerce

Si vous ne trouvez pas certaines pages de configuration dans le menu Boutique, pensez activer les modules UI (Customer UI, Order UI, etc) de Drupal Commerce.
Ce deuxime chapitre liste les diffrents lments configurables que le module Commerce propose.
7.2.1 Entits et types de champs

Entit produit
h h
Menu Boutique lien Produits Onglet Types de produits
Ici, vous pouvez dfinir de nouvelles familles de produits. Par exemple, un produit Stage peut avoir un nouveau champ Date. Un exemple de cration de nouveau produit est dcrit au chapitre suivant. Longlet grer laffichage permet de dfinir la faon dont saffichera le produit dans la node auquel il est attach (mode daffichage Par dfaut) ou dans le panier et la commande (mode daffichage Ligne article).
Mode daffichage Ligne article pour les produits
Type de champ Rfrence produit

Permet de lier un ou des produit(s) un contenu. Vous pouvez grer laffichage de chaque champ du produit dans la node pour un champ de type Rfrence produit.
313
Gestion de laffichage dun champ rfrence produit dans une node
Type de champ Prix

Champ utilis par dfaut dans les types produits. Plusieurs formats daffichage sont disponibles : montant format (79,00 EUR), montant brut (7900), prix calcul avec lapplication des rgles, prix original sans application des rgles.
Entit Commande
Vous pouvez configurer les champs qui composent une commande :
h h h
Menu Boutique lien Configuration Lien Paramtres de commande Onglet Grer les champs
Les champs par dfaut dune commande
Entit Type de ligne de commande

Chaque ligne dune commande est une entit de type ligne de commande.
Ligne de commande
314
Champ Rfrence de ligne article

Champ utilis par lentit commande pour lier plusieurs lignes articles une commande.
Entit Client
Un client est un utilisateur Drupal qui a valid une commande. Il est possible de modifier les champs des profils des clients :
h h h
Menu Boutique lien Profils client Onglet Types de profils Lien grer les champs
Champ du profil client par dfaut
Champ Rfrence du profil client

Champ utilis par lentit commande pour lier une commande un client.
Champ Postal address

Champ utilis par dfaut dans le profil des clients. Ce champ comporte lui seul plusieurs lments de formulaire.
Widget du champ Postal address
315
7.2.2 Les vues

Voici les diffrentes vues cres par dfaut par le module Commerce :
Shopping cart block

Vue utilise pour afficher le bloc panier.
Le panier est une vue !
Shopping cart form

Vue utilise pour afficher le dtail du panier.
Dtail du panier
Shopping cart summary

Vue utilise pour afficher le rsum du panier lors de la validation de la commande.
Validation dune commande
316
Line items
Affiche les lignes dune commande.
Lignes dune commande
Order payments
Vue utilise pour afficher les paiements dune commande
h h
Menu Boutique lien Commandes Lien paiement dune commande
Balance des paiements dune commande
Users orders
Liste des commandes dun utilisateur.
Onglet Commandes du profil utilisateur
Orders
Liste les commandes dans ladministration.
Products
Liste des produits dans ladministration.
Customer profiles
Liste des profils des clients dans ladministration.
317
7.2.3 Les rgles

Le module Commerce propose galement de nombreuses rgles utilisant des actions et des vnements spcifiques ajouts au module Rules. Certaines rgles peuvent tre ajoutes ou modifies via les pages de configuration de la boutique :
h h
Menu Boutique lien Configuration Lien Rgles de tarification des produits Lien Modes de paiement Lien Paramtres de validation de commande Onglet Rgles de validation de commande
Sur cette page, vous pouvez ajouter des rgles pour modifier le calcul des prix des produits.
h
Sur cette page, vous pouvez ajouter des rgles pour slectionner les modes de paiement disponibles.
h h
Sur cette page, vous pouvez ajouter des rgles qui permettront de modifier les critres de validation des commandes. Vous pouvez consulter l'ensemble des rgles de Drupal Commerce la page :
h
Menu Configuration lien Rgles
7.2.4 Autres lments de configuration

Formulaire de commande
Vous pouvez cacher ou afficher certaines sections de la page de validation de commande :
h h
Menu Boutique lien Configuration Lien Paramtres de validation de commande
Un lien configurer permet de paramtrer le comportement de chaque panneau.
318
Les panneaux des pages de commande
Paramtres des devises

Vous pouvez activer plusieurs devises pour votre boutique :
h h
Menu Boutique lien Configuration Lien Paramtres des devises
Page de gestion des devises
319
7.3
Quelques exemples de configuration
Voici quelques exemples de configuration du module Commerce qui utilisent les lments lists ci-dessus.
7.3.1 Crer une node contenant plusieurs produits

Il est possible de lier plusieurs produits une seule node. Cela peut permettre vos clients de ne pas avoir naviguer sur le site pour trouver les produits dun mme thme. Ici, vous allez crer une node qui listera lensemble des pices dtaches du robot multifonction. Tout dabord, il faut crer les produits pices dtaches :
h h h h h h
Menu Boutique lien Produits Lien + Ajouter un produit SKU : robot-multifonction-couteau Titre : Couteau pour robot multifonction Prix : 19 Bouton Enregistrer et ajouter un autre SKU : robot-multifonction-bol Titre : Bol pour robot multifonction Prix : 29 Bouton Enregistrer le produit Menu Structure lien Types de contenu Lien Grer les champs du type Produit Lien modifier du champ Produit Nombre de valeurs : Illimit Bouton Enregistrer les paramtres Titre : Pices dtaches pour robot multifonction Corps : Commandez vos pices dtaches Produit : robot-multifonction-bol, robot-multifonction-couteau (ajout de deux produits dans la zone)
Ajoutez le deuxime produit :

h h h h
Ensuite, il faut permettre au type de contenu Produit de rfrencer plusieurs entits produit :
h h h h h
Il reste crer une nouvelle node de type Produit :

h h h
Plusieurs produits pour une node
320
Bouton Enregistrer
Le champ prix change en fonction du produit slectionn
7.3.2 Produits avec attributs

Imaginez maintenant que vous souhaitiez vendre une batterie de cuisine contenant les lments suivants : pole de 14 cm et 16 cm ; casserole de 12 cm, 14 cm et 16 cm ; sauteuse de 16 cm et 18 cm. Vous souhaitez vendre chaque lment de cette batterie sparment. Voici linterface que vous pourriez proposer avec le module Commerce :
Slection des lments de la batterie dans une seule node
Pour cela il faut crer un nouveau type de produit et lui ajouter les deux champs attributs (type dlment et taille) et un champ image pour les diffrents types.
321
h h h h h h
Menu Boutique lien Produits Onglet Types de produit Lien + Ajouter un type de produit Nom : lment de batterie de cuisine Bouton Enregistrer et ajouter les champs Ajoutez le champ existant Image (chap. II 4.2.6. Ajout du champ photo de larticle) Etiquette : Type dlment Nom du champ : type_element Type de donnes stocker : Liste (texte) lment du formulaire pour ldition des donnes : Liste de slection Bouton Enregistrer Liste des valeurs autorises : Pole, Casserole, Sauteuse (une par ligne)
Puis, il faut ajouter les attributs. Commencez par le type dlment (pole, casserole, etc.) :
h h h h h h
Liste des valeurs de lattribut taille

h
Bouton Enregistrer les paramtres du champ Autoriser ce champ fonctionner comme un champ dattribut sur le formulaire dAjout au panier. : coch Widget de slection dattribut : Boutons radio

h
Paramtres des attributs dun produit

h
Nombre de valeurs : 1
322
Les attributs des produits ne peuvent avoir un nombre de valeurs suprieure 1.

h
Bouton Enregistrer les paramtres Etiquette : Taille Nom du champ : taille Type de donnes stocker : Liste (texte) lment du formulaire pour ldition des donnes : Liste de slection Bouton Enregistrer Liste des valeurs autorises : 12 14 16 18 (une par ligne) Bouton Enregistrer les paramtres du champ Autoriser ce champ fonctionner comme un champ dattribut sur le formulaire dAjout au panier. : coch Widget de slection dattribut : Boutons radio Nombre de valeurs : 1 Bouton Enregistrer les paramtres Menu Boutique lien Produits Lien + Ajouter un produit Lien Crer Elment de batterie de cuisine SKU : poele14 Titre : Pole (14 cm) Prix : 15 Type dlment : Pole Taille : 14
Puis, faites de mme pour la taille :

h h h h h h h

h
h h h
Vous pouvez maintenant ajouter les sept produits que vous proposez la vente :
h h h h h h h h
Les nouveaux attributs du produit
323
Bouton Enregistrer et ajouter un autre
Ajoutez ainsi les 6 autres produits de la batterie de cuisine.
Les produits de la batterie de cuisine
Vous pouvez maintenant crer la node Batterie de cuisine qui contiendra l'ensemble des produits :
h h h h
Titre : Batterie de cuisine Corps : Achetez nos lments au dtail Produit : poele14, poele16, casserole12, casserole14, casserole16, sauteuse16, sauteuse18 Bouton Enregistrer
Tailles disponibles en fonction de llment
324
Il manque encore quelques lments de mise en forme : limage ne saffiche pas et il faut rordonner les champs. Vous pouvez grer laffichage grce deux pages : longlet Grer laffichage du type de contenu Produit : ici, vous rordonnez les champs du produit et dterminez lesquels doivent safficher ;
Affichage des champs du produit dans la node
longlet Grer laffichage du type de produit lment de batterie de cuisine : ici, vous dfinissez le format des champs du produit.
Format des champs du produit
325
7.3.3 Exercice : modifier laffichage du panier

Modifiez bloc panier pour quil ait laspect suivant :
Nouveau panier
Corrig
Le panier est une vue, il suffit donc de la modifier
h h h
Cliquez sur le menu contextuel du panier : Modifier la vue Choisir le menu rordonner de la section Champs Placer litem (Article) Commerce Entre darticle : Quantit avant le Total
Rordonner les champs de la vue

h
Bouton Appliquer Dans la section Champs, cliquez sur litem (Article) Commerce Entre darticle Mettez x en Prfixe Supprimez le Suffixe Bouton Appliquer Bouton Enregistrer de la vue
Il reste modifier laffichage de la quantit :

h h h h h
326
7.3.4 Rduction pour un rle

Vous allez maintenant crer une nouvelle rgle qui appliquera une rduction des prix de 10% sur lensemble du site pour un utilisateur ayant pour rle Rdacteur de recettes.
h h
Menu Boutique lien Configuration Lien Rgles de tarification des produit Lien + Ajouter une rgle de tarification Nom : 10% aux rles Rdacteur de recette Bouton Enregistrer
Vous reconnaissez linterface de Rules. Il va donc falloir crer une nouvelle rgle :
h h h
Lvnement Calcul du prix de vente dun produit est slectionn. La rgle sera donc dclenche chaque fois quun prix sera affiche. Commencez par ajouter la condition :
h h h h
Lien + Ajouter une condition Dans la liste, la section Utilisateur, choisir Lutilisateur a le(s) rle(s) Dans liste Rles, slectionnez Rdacteur de recettes Bouton Enregistrer Lien + Ajouter une action Dans la liste, la section Commerce Entre darticle, choisir Multiply the unit price by some amount Valeur : 0.9 Bouton Enregistrer
Puis laction :
h h h h
La rgle dans son intgralit
327
Bouton Enregistrer les modifications
Connectez-vous avec un utilisateur ayant le rle Rdacteur de recettes.
Prix du robot multifonction pour les rdacteurs de recettes
1 - Configurer les thmes par linterface
329
Chapitre
V
Les thmes
odifier lapparence de Drupal peut-tre une tche trs simple (installation dun nouveau thme) ou trs complique (personnalisation de tous les lments du thme). Le systme Drupal est en effet construit pour quil soit possible, depuis un thme, de modifier lapparence et mme le contenu de chaque lment. Ce chapitre vous accompagnera pas pas dans cette tche complexe : vous commencerez par configurer diffrents thmes existants par linterface de Drupal ; vous modifierez le thme Orange en dcouvrant ses fichiers CSS et ses gabarits (templates) ; vous crerez un thme en partant dun simple design HTML/CSS.
1
1.1
h
Configurer les thmes par linterface

Paramtres globaux des thmes
Il est possible de configurer certains lments graphiques des thmes directement depuis linterface de Drupal.
Menu Apparence onglet Paramtres
330
V - Les thmes
Paramtres globaux des thmes
partir de cette page, vous pouvez configurer les paramtres de lensemble des thmes. Il sera ensuite possible de rgler ces lments selon chaque thme grce aux boutons situs en haut de la page. Le positionnement de ces lments peut diffrer dun thme lautre (rien nempche un thme dafficher le logo en bas de la page).
Personnaliser le logo
Pour modifier le logo :
h h
Dcochez la case Utiliser le logo par dfaut (Druplicon) Dans la zone Envoyer le logo, cliquez sur Choisissez un fichier et pointez limage que vous dsirez
Changement de logo
331
Limage que vous ajouterez ne sera pas redimensionne. Pour information, licne Drupal par dfaut fait 65x73 pixels. Vous pouvez redimensionner et retoucher vos images grce au logiciel libre Gimp (http://www.gimp-fr.org).
h
Le nouveau logo sous Bartik
Pour ne pas avoir un carr blanc autour de votre logo, il est possible de mettre un fond transparent. Pour cela, utilisez le canal alpha sous Gimp et sauvegardez votre fichier au format png.
Personnaliser licne
Utilisez le mme procd pour modifier licne du site. Drupal se charge cette fois-ci de la redimensionner automatiquement.
Licne et le logo personnaliss
1.2
h h
Color : shma de couleur du thme Bartik
Chaque thme possde sa propre page de configuration, voici celle de Bartik, le thme par dfaut de Drupal : Menu Apparence Pour le thme Bartik, cliquez sur le lien Paramtres
En bas de page, saffichent les sections vues prcdemment (affichage dlments, modification du logo et
332
V - Les thmes
de licne). En dbut de page il y a galement une section Schma de couleurs. Elle permet de modifier la couleur de nombreux lments du site.
h
Choisissez le Jeu de couleurs Prune
Modification des couleurs de Bartik
Bartik utilise le module Color prsent et activ par dfaut dans Drupal. Tous les thmes utilisant ce module proposent cette fonctionnalit.
h
Vous pouvez alors voir le nouveau jeu de couleurs de Bartik en allant sur la page daccueil du site.
1.3
Paramtres du thme Marinelli
Marinelli est un thme populaire contenant un grand nombre de fonctionnalits avances.
Installation du thme Marinelli

h
Tlchargez le thme Marinelli (http://drupal.org/project/marinelli Version utilise pour ce livre 7.x-3.0-beta9) Installez le thme Marinelli comme vous avez install Danblog (chap. I 2.6.2 Installation dun thme externe). Si cela ne fonctionne pas, vous pouvez installer un thme manuellement comme vous installez un module (chap. II 1.3.3 Mthodes dinstallation dun module) dans le rpertoire sites/all/themes ou sites/default/themes.
Menu Apparence
333
Le thme Marinelli est install

h
Cliquez sur le lien Activer et choisir par dfaut du thme Marinelli Pour voir le thme dfini par dfaut, il faut se rendre sur une page qui nest pas une page dadministration (page daccueil du site par exemple). Les pages dadministration utilisent le thme de ladministration (Seven par dfaut).
Lien Paramtres du thme Marinelli
Les paramtres spcifiques dfinis par le thme Marinelli
De nombreuses options permettent de configurer le thme et ses fonctionnalits avances.

h
Vous pouvez par exemple utiliser la section Banner Managment pour modifier les images de la bannire et son mode de dfilement (Banner configuration)
334
V - Les thmes
Configuration de la bannire de Marinelli

h
Vous pouvez galement crer un menu droulant en 3 clics grce la section Primary Menu Settings
Configuration du menu
Deux fonctionnalits avances de Marinelli : le menu droulant et le diaporama sur la bannire
2 - Structure et modification dun thme
335
Comme le montre Marinelli chaque thme peut proposer divers paramtres de configuration et parfois des fonctionnalits trs avances. De nombreux thmes existent, nhsitez pas les tester et noubliez pas de visiter leur page de configuration.
Structure et modification dun thme
Dans cette section, vous dcouvrirez comment est construit un thme Drupal et comment le modifier en ditant ses fichiers. Pour cela, vous utiliserez le thme Orange.
Le thme Orange a t choisi car il est simple et utilise les nouvelles fonctionnalits de Drupal 7.
Tlchargez le thme Orange (http://drupal.org/project/orange Version utilise pour ce livre 7.x1.1) Cliquez sur le lien Activer et choisir par dfaut du thme Orange
La page daccueil avec le thme Orange
336
V - Les thmes
2.1
Les fichiers dun thme
Le thme Orange doit tre install dans le rpertoire sites/all/themes/orange.
Larborescence de Orange
Le rpertoire contient deux sous-rpertoires : orange et orange_admin. En effet, deux thmes sont inclus dans larchive, un thme classique Drupal (orange) et un thme dadministration (orange_admin) activable la section Thme de ladministration de la page des thmes. Voici une description des diffrents fichiers qui composent le thme Orange : Le fichier .info orange.info : cest le point dentre du thme, il dfini le nom et la description du thme, la version de Drupal sur laquelle il fonctionne, les rgions qui le composent, les fichiers CSS et javascript qui lui sont attachs, etc. Les images logo.png : logo par dfaut du thme pour le site. screenshot.png : copie dcran pour la page dadministration des thmes.
337
Le rpertoire images Ce rpertoire contient lensemble des fichiers image qui seront utiliss dans le thme. Par exemple, les boutons ou des icnes (signe + devant Ajouter un commentaire) Le rpertoire css style.css : fichier contenant tous les styles du site ie-6.css : fichier contenant les styles spcifiques au navigateur Internet Explorer 6 ie-7.css : fichier contenant les styles spcifiques au navigateur Internet Explorer 7 Les fichiers CSS sont les feuilles de styles du thme. Cest dans ces fichiers que sont dfinis les polices utilises, les couleurs de fonds, le positionnement des lments HTML, etc. Le rpertoire js orange.js : fichier contenant les scripts Javascript du thme Le Javascript est souvent utilis pour modifier les lments HTML par le navigateur de lutilisateur du site. Il permet par exemple dajouter des effets visuels, de contrler des formulaires lors de la saisie sans recharger la page, etc. Le rpertoire templates Ce rpertoire contient lensemble des templates dfinis par le thme. Les fichiers template (.tpl.php) sont des gabarits interprts par un langage propre Drupal, le phpTemplate. Ces fichiers sont composs dun mlange de HTML et de php. html.tpl.php : template pour la construction de la page HTML en dehors du contenu. Cest ici que seront dfinis les contenus des balises DOCTYPE et <head>. page.tpl.php : template pour la construction de la page dans son ensemble. Cest ici que sera dfini le contenu de la balise <body>. node.tpl.php : template pour la construction des nodes (tout type de contenu). region.tpl.php : template pour la construction des rgions du thme. block.tpl.php : template pour la construction des blocs des rgions. comment-wrapper.tpl.php : template pour la construction de la zone des commentaires (formulaires + commentaires). comment.tpl.php : template pour la construction dun commentaire seul (nom de lauteur, date, texte du commentaire).
338
V - Les thmes
Utilisation des templates du thme Orange pour la construction dune page
Le fichier template.php template.php : ce fichier prsent la racine ne contient que du code PHP. Il sera tudi plus tard dans le chap. V 4.2 Le fichier template.php.
2.2
Modification de Orange par CSS
Les feuilles de styles CSS prennent en charge la prsentation dune page HTML. La feuille de style principale du thme Orange est style.css. Il est possible dditer le code de ce fichier pour modifier lapparence du site.
339
2.2.1 Modification dun fichier CSS

Dans cet exemple, vous allez mettre toutes les balises h2 (titre des pages et des blocs) en petites majuscules grce la proprit CSS font-variant.
h
ditez le fichier sites/all/themes/orange/orange/css/style.css Avec Windows, vous pouvez utiliser Notepad++ pour diter les fichiers CSS
Recherchez le code suivant (ligne 87) :

h2, h2 a { color: #222; font-size: 1.5em; text-decoration: none; }
Modifiez le en ajoutant un ligne :

h2, h2 a { color: #222; font-size: 1.5em; text-decoration: none; font-variant: small-caps; }
h h
Sauvegardez le fichier Rechargez votre page
Les titres des blocs et des nodes sont maintenant en petites majuscules
Si vous ne connaissez pas CSS, il est conseill de lire lun des nombreux tutoriaux disponibles sur internet (exemple : http://css.mammouthland.net/)
340
V - Les thmes
2.2.2 Installation et utilisation de Firebug

Pour vous aider situer les styles que vous voulez modifier dans Drupal, il existe une extension pour Firefox qui savre rapidement indispensable : Firebug.
Installation
h h h
Si Firefox nest pas sur votre machine, installez le immdiatement ! Menu de Firefox Modules complmentaires Dans la zone de recherche, entrez firebug
Installation de Firebug sous Firefox 4

h h
Cliquez sur le bouton Installer Redmarrer Firefox
Vous devriez voir apparatre un cafard (bug) droite de la barre de navigation.
Licne de firebug droite de la barre de navigation
Utilisation
h h
Rechargez la page daccueil du site avec le thme Orange Cliquez sur le bouton Firebug (le cafard)
Un volet souvre alors en bas de Firefox, dans la partie gauche se trouve le code HTML de votre page et dans le partie droite le code CSS appliqu llment HTML slectionn.
341
Linterface de firebug
h h
Cliquez sur la flche qui permet de slectionner un lment de la page (deuxime bouton de la barre doutils) Placez le curseur de la souris sur un titre en petites majuscules
Les proprits CSS de la balise H2 vues grce Firebug
Et cest ici que Firebug est magique !! llment tudi est entour en bleu ; dans le cadre de gauche de Firebug, le code HTML de llment tudi (<h2 class="title"...) est surlign ; dans le cadre de droite de Firebug, vous retrouvez le code CSS que vous avez ajout : font-variant: small-caps ; au-dessus saffichent le nom du fichier css (style.css) et la position du code css dans le fichier (line 87).
342
V - Les thmes
Si vous passez votre souris au-dessus du lien, le chemin complet du fichier CSS apparat, chose indispensable pour savoir quels fichiers sont rellement concerns.
Chemin du fichier contenant la proprit
Il est galement possible de modifier directement depuis Firebug les valeurs des proprits CSS. Laffichage se met jour immdiatement dans Firefox.
Modification dune proprit CSS grce Firebug
Lorsque vous modifiez vos proprits dans Firebug, les fichiers CSS ne sont pas modifis.
Utilisez flche haut et flche bas pour augmenter ou diminuer les valeurs numriques des proprits CSS.
2.3
Les templates de Orange
En modifiant les fichiers CSS du thme, vous modifiez laspect de votre page. Pour modifier la structure de la page (code HTML), il faut modifier les templates du thme. Drupal possde son propre moteur de template, PHPTemplate. Ce moteur interprte les fichiers .tpl.php qui contiennent du code HTML et du code PHP. Vous afficherez le nom de chaque rgion de la page en modifiant le template region.tpl.php.
h
Editez le fichier sites/all/themes/orange/orange/templates/region.tpl.php
343
Ce fichier commence par un long commentaire php (/** */) qui liste les variables php qui pourront tre values dans le template. Par exemple, il est dit que la variable $content affiche le contenu de la rgion et que la variable $region affiche le nom de la rgion. Voici le reste du code du template :
1. <?php if ($content): ?> 2. <div class="<?php print $classes; ?>"> 3. <?php print render($title_suffix); ?> 4. <?php print $content; ?> 5. </div> 6. <?php endif; ?>
la ligne 1 value si la variable $content nest pas vide. Si elle est vide, le template ne retourne rien ; la ligne 2 cre une balise <div> autour de la rgion et affiche ses classes CSS ; la ligne 3 affiche la variable $title_suffix qui peut tre dfinie par certains modules ; la ligne 4 affiche le contenu de la rgion (les blocs affectes la rgion). Il est bien sr possible de personnaliser ce template. Ici, vous allez ajouter une ligne qui affiche le nom de la rgion en utilisant la variable $region :
h
Modifiez le fichier en ajoutant la ligne 3

1. <?php if ($content): ?> 2. <div class="<?php print $classes; ?>"> 3. <div class="warning"><?php print $region; ?></div> 4. <?php print render($title_suffix); ?> 5. <?php print $content; ?> 6. </div> 7. <?php endif; ?>
Cette nouvelle ligne 3 affiche le contenu de la variable $region (nom de la rgion) dans une balise HTML <div> laquelle lui est applique le style css warning (police blanche sur fond orange) contenu dans le fichier style.css de orange.
Le template region.tpl.php affiche le nom des rgions du site
344
V - Les thmes
2.4 Theme developer : dcouverte des templates dun thme

2.4.1 Utilisation de Theme developer
Il nest pas toujours simple de connatre le nom du template responsable de la cration dun lment HTML de la page. La communaut Drupal a cr un outil qui devient vite indispensable au crateur de thme : Theme developer.
Installation
Le module Theme developer requiert le module Devel.
h
Tlchargez et activez les module Devel (http://drupal.org/project/devel) Version utilise pour ce livre 7.x-1.2 et Theme developer (http://drupal.org/project/devel_themer) Version utilise pour ce livre 7.x-1.x-dev.
Lorsque le module est install et activ, une case cocher Themer info apparat en bas gauche du site.
Le module Theme developeur est activ
Le module Theme developer ajoute du code sur chaque lment de la page. Ce code est de type :
<span thmr="thmr_2" style="display: block; outline: medium none;" thmr_curr="0">
Ce code peut modifier lapparence de votre site ou bloquer certains scripts Javascript. Lorsque vous rencontrez un problme inattendu, commencez par dsactiver ce module.
Utilisation
h
Cochez la case Themer info Cliquez sur le bloc Liens divers cr au chap. II 2.2.4 Cration dun nouveau menu
Vous pouvez alors pointer avec la souris, la manire de Firebug, vers un lment de la page.
h
345
Theme developeur affiche les information du template
Saffiche alors une fentre popup qui donne des informations sur le template responsable de la cration du code HTML slectionn. Voici les lments que vous utiliserez dans ce chapitre : Template called : chemin et nom du fichier template utilis ; Candidate template files : nom de fichiers de template pouvant tre utilis ; Section (Array, 25 elements) : liste des variables php pouvant tre utilises dans le template.
2.4.2 Modification du template block utilis

Theme developer indique que le template qui a gnr le block est sites/all/themes/orange/orange/templates/block.tpl.php.
h
ditez ce fichier block.tpl.php

1. <div id="<?php print $block_html_id; ?>" class="<?php print $classes; ?> clearfix"<?php print $attributes; ?>> 2. <?php print render($title_prefix); ?> 3. <?php if (!empty($block->subject)): ?> 4. <h2 class="title"<?php print $title_attributes; ?>><?php print $block>subject ?></h2> 5. <?php endif;?> 6. <?php print render($title_suffix); ?> 7. <div class="content"<?php print $content_attributes; ?>><?php print $content ?></div> 8.</div>
Ce fichier ressemble region.tpl.php tudi prcdemment :
Vous allez maintenant mettre le contenu des blocs avant leur titre (chose peu judicieuse, je vous le concde) .
h h h
Dplacez la ligne 7 avant la ligne 2 Sauvegardez le fichier Rechargez la page
346
V - Les thmes
Le titre des blocs en dessous de leur contenu
En modifiant le fichier block.tpl.php vous avez modifi le rendu de lensemble des blocs.
h
Annulez cette modification et remettez le titre au dessus du bloc
2.4.3 Cration dun template pour un bloc spcifique

Il est possible de crer des template qui vont modifier uniquement des blocs spcifiques, la ligne Candidate template files apporte des informations ce sujet.
h
Cliquez nouveau sur le bloc Liens divers
Les noms de fichiers de template possibles
Cette ligne indique que diffrents noms de fichiers sont possibles : block--menu--menu_liens_divers.tpl.php block--menu.tpl.php block--sidebar_first.tpl.php block.tpl.php Seul le bloc menu_liens_divers sera affect Seuls les blocs gnrs par le module menu seront affects Seuls les blocs de la rgion sidebar first seront affects Tous les blocs seront affects
Un seul template sera utilis par Drupal. Drupal cherche dans diffrents rpertoires (thme, module, ...) si le premier template existe (ici, block--menu--menu_liens_divers.tpl.php). Si il le trouve, il lutilise et ne cherche pas dautres fichiers. Sinon, il cherche le fichier suivant (block--menu.tpl.php).
347
Lors de la rdaction de ce livre, le module Theme developer possde un bug qui affiche des "__" au lieu de "--" pour les noms de template. Peut-tre que celui-ci sera corrig lorsque vous lirez ces lignes. Vous allez crer un template qui affichera un message uniquement dans le bloc liens divers :
h
Faites une copie du fichier sites/all/themes/orange/orange/templates/block.tpl.php dans le mme rpertoire et renommez-le en block--menu--menu_liens_divers.tpl.php ditez le fichier cr Avant la ligne <?php print render($title_prefix); ?> ajoutez le code :
<?php print "Je suis le nouveau template !"; ?>
h h h
Si vous regardez la page cet instant, votre nouveau fichier nest pas dtect par Drupal. Pour des raisons de performances, un cache existe et rpertorie les fichiers prsents sur votre installation. Pour que votre nouveau fichier soit dtect par Drupal; il faut donc vider les caches :
h h
Menu Configuration lien Performance Bouton Effacer tous les caches Le crateur de thme ralise cette action trs rgulirement, il est donc fastidieux de devoir aller sur la page performance chaque fois. Heureusement le module Devel propose une url qui efface les caches : devel/cache/clear (http://localhost/drupal/?q=devel/cache/clear). Mettez cet url en marque page de votre navigateur pour gagner du temps.
Rechargez la page
Le nouveau template est utilis !
348
V - Les thmes
Si vous ne parvenez pas slectionner un lment dans la page avec Theme developer, pointez vers un lment plus petit (par exemple, pour le bloc "Liens divers", un lien du bloc). Ensuite, utilisez les liens de la ligne Parents de la fentre popup pour remonter vers le template qui vous intresse.
Utilisation des liens Parents pour retrouver le template dsir
2.4.4 Utilisation des variables php

Vous allez ajouter un nouveau template pour modifier le bloc Bienvenue, Utilisateur identifi cr au chap. II 2.3.5 Exercice : Cration dun bloc pour un rle spcifique. Vous modifierez le titre de ce bloc afin quil affiche le nom de lutilisateur connect.
h h
Slectionnez le bloc Bienvenue, Utilisateur identifi avec Theme developer Cliquez sur la dernire ligne du popup .. (Array, 25 elements)
La liste de toutes les variables php utilisables dans le template saffiche alors.
Liste de toutes les variables php utilisables dans le template
349
Dans cette liste, recherchez la ligne user (Object) stdClass et cliquez dessus.
Description des attributs de lobjet user
Grce ces informations, vous savez que cest lattribut name de lobjet $user qui affichera le nom de lutilisateur connect. En php, il faudra donc crire : $user->name.
h
Faites une copie du fichier sites/all/themes/orange/orange/templates/block.tpl.php dans le mme rpertoire et renommez-le en block--block--2.tpl.php (nom du Candidate template files pour ce bloc) ditez le fichier cr Modifiez la ligne :
<h2 class="title"<?php print $title_attributes; ?>> <?php print $block->subject ?> </h2>
h h
en
<h2 class="title"<?php print $title_attributes; ?>> <?php print "Bienvenue, ".$user->name ?> </h2>
h h h
Sauvegardez le fichier Effacez les caches Rechargez la page
Affichage du nom de lutilisateur connect dans le bloc de bienvenue.
350
V - Les thmes
Il est possible dafficher la liste des variables dun template en utilisant les fonctions de Debug du module Devel. Cela est parfois indispensable lorsque le module casse la prsentation du site. Ces fonctions sont dtailles au chap. VI 3.1.3. Les fonctions de dbuggage Dans cet exemple, le template du thme a modifi le contenu du site. Ce nest pas une bonne pratique car si un webmaster tente de modifier le titre de votre bloc avec linterface dadministration, cela naura aucun effet.
2.5
Exercice : mettre un filet autour des blocs dune rgion
Mettez un filet Orange (#EF9F20) autour de chaque bloc de la rgion sidebar_first
Filet autour des blocs
Corrig
Pas besoin daller modifier les templates ici. Lajout dune rgle dans le fichier style.css du thme Orange suffira.
h
Avec firebug pointez vers un bloc de la rgion
Le code HTML de la rgion et de ses blocs
351
la rgion possde une classe css region-sidebar-first ; chaque bloc possde une classe css block.
h h
ditez le fichier sites/all/themes/orange/orange/css/style.css Ajoutez la rgle suivante :

.region-sidebar-first .block { border: 1px solid #EF9F20; }
h h
Sauvegardez le fichier Rechargez la page
2.6
Exercice : modifiez le format de date des commentaires
Par dfaut, les commentaires sont prsents sous la forme suivante :
Mauvais format de date de publication des commentaires
Faites en sorte que la date saffiche ainsi en utilisant la variable $changed du template :
Affichage de la date au format franais
Vrifiez que les formats de date et heures sont bien configurs (menu Configuration lien Date et heure).
Configuration des formats de date et heure
352
V - Les thmes
Corrig
h h h h
Affichez un contenu avec des commentaires Slectionnez un commentaire avec Theme developer Dans la fentre popup, affichez la liste des variables en cliquant sur ... (Array, 36 elements) Recherchez la variable $changed
La variable utiliser est $changed, elle est au bon format
Il faut donc utiliser la variable $changed dans le fichier comment.tpl.php

h h
ditez le fichier sites/all/themes/orange/orange/templates/comment.tpl.php Modifiez la ligne :

<div class="submitted"><?php print $created; ?> <?php print $author; ?></ div>
en
<div class="submitted"><?php print $changed; ?> <?php print $author; ?></ div>
h h
Sauvegardez le fichier Rechargez la page
2.7
Exercice : exploration dun template du module Poll
Avertissement : cet exercice est difficile raliser. Dans le Chap. I 2.5.1 Activer un module, vous avez cr un sondage grce au module Poll. Voici comment sont prsents les rsultats lorsquun utilisateur a dj vot :
353
Affichage des rsultats pour un utilisateur ne pouvant plus voter
Le but de cet exercice est dindiquer lutilisateur quel a t son vote :
Le choix de lutilisateur est rappel sur la page de rsultats
Corrig
Tout dabord, il faut rechercher quel est le template responsable de laffichage des rsultats dun sondage.
h h
Affichez les rsultats du sondage Slectionnez une ligne de rsultat avec Theme developer
354
V - Les thmes
Slection dune ligne de rsultat
Deux templates sont responsables de laffichage du rsultat : poll_results.tpl.php : ce template affiche lensemble des rsultats et les Votes totaux ; poll-bar.tpl.php : ce template affiche chaque ligne de rsultat. Dans cet exemple, il est utilis trois fois. Le message doit tre affich pour la ligne de rsultat, il faut donc utiliser poll-bar.tpl.php. Theme Developer indique que le template utilis se situe lemplacement modules/poll/poll-bar.tpl.php et pas dans le thme Orange. En effet, le thme Orange ne personnalise pas ce module et donc, cest le template du module lui-mme qui est utilis. Attention, lorsquun template se situe dans le rpertoire dun module, il faut en faire une copie dans votre propre thme. Ne modifiez jamais un template original, vous risqueriez de perdre vos modifications la prochaine mise jour de Drupal ou dun module.
h
Faites une copie du fichier modules/poll/poll-bar.tpl.php dans le rpertoire sites/all/themes/orange/ orange/templates/poll-bar.tpl.php ditez le fichier cr
Il sagit maintenant de savoir quelle est la variable utiliser dans le template. Une solution pour trouver simplement cette variable est de lire le commentaire prsent en haut du template :
* Variables available: * $title: The title of the poll. * $votes: The number of votes for this choice * $total_votes: The number of votes for this choice * $percentage: The percentage of votes for this choice. * $vote: The choice number of the current user's vote. * $voted: Set to TRUE if the user voted for this choice.
Il semblerait que la variable $vote puisse vous aider. Utilisez le module Theme Developer pour le vrifier. La variable $vote passe TRUE lorsque vous pointez la recette qui a t choisie par lutilisateur connect.
3 - Crer un thme partir dun design HTML/CSS
355
La variable $vote indique si lutilisateur connect a vot pour le choix slectionn

h
Modifiez la ligne :
<div class="text"><?php print $title; ?></div>
en
<div class="text"> <?php print $title; ?> <?php if ($vote) print "<em>(Votre choix)</em>"; ?> </div>
h h h
Sauvegardez le fichier Videz les caches Rechargez la page
Crer un thme partir dun design HTML/CSS
Vous savez maintenant quels sont les fichiers qui composent un thme Drupal et comment modifier un thme existant. Durant ce chapitre, vous allez apprendre crer un thme from scratch ( partir de rien). Un petit peu dhonntet : vous ne partirez pas vraiment de rien mais dun design HTML/CSS existant car ce nest pas lobjet de ce livre que de vous apprendre matriser ces langages.
3.1
Cration du thme
3.1.1 Tlchargement du design et cration du rpertoire

Le site free CSS templates propose plusieurs centaines de design HTML/CSS sous licence Creative Commons (CCPL). Lauteur du site ma donn son accord pour lutilisation de ses designs dans cet ouvrage et je len remercie. Pour la cration de ce thme, vous allez utiliser le design culinary tlchargeable ladresse http://www.freecsstemplates.org/preview/culinary/.
356
V - Les thmes
Le thme Culinary sur free CSS templates

h h
Tlcharger larchive culinary.zip Extrayez son contenu dans un nouveau rpertoire sites/default/all/culinary qui sera le rpertoire de votre thme
Fichiers du design culinary
Voici une description des fichiers de cette archive : dossier images : images utilise dans le thme (logo, illustration, etc.) ; index.html : code HTML du design ; default.css : code CSS du design ; license.txt : texte de la licence CCPL.
357
3.1.2 Cration du .info

Lors du chargement de la page Apparence, qui liste lensemble des thmes de linstallation, Drupal recherche un fichier .info dans chaque sous-rpertoire du rpertoire themes.
h
Crez un fichier culinary.info dans le rpertoire culinary

name = Culinary description = Theme Culinary de freecesstemplates. core = 7.x version = 7.x-dev engine = phptemplate
name description core version engine
Nom du thme, saffiche sur la page Apparence Description du thme, saffiche sur la page Apparence Version requise de Drupal. Ici, 7.x indique nimporte quelle version 7 de Drupal (7.0, 7.1, 7.2, etc.) Version du thme, saffiche sur la page Apparence Moteur de template utilis
Vous avez crit ici un fichier .info minimale. Vous modifierez ce fichier plusieurs reprise durant ce chapitre pour y ajouter de nouvelles directives de configuration.
h
Allez sur la page Apparence
Votre .info a t lu par Drupal
3.1.3 Le premier template : html.tpl.php

Le pre de tous les template est html.tpl.php, cest partir de celui-ci que tous les autres seront appels. Vous allez crer ce premier template partir du fichier index.html du design.
h h h
Renommez index.html en html.tpl.php Crez un sous-rpertoire templates Placez le template html.tpl.php dans ce rpertoire
358
V - Les thmes
Il nest pas obligatoire de placer ses templates dans le rpertoire templates, mais cela est recommand pour ne pas surcharger la racine du thme et pour une meilleure lisibilit. Votre thme peut ds maintenant safficher !!!
h h h
Page Apparence Choisir le lien Activer et choisir par dfaut du thme Culinary Aller sur la page daccueil du site
Votre thme fonctionne
Forcment, il reste encore un petit peu de travail : aucun style nest appliqu au HTML et le contenu est statique.
3.1.4 Ajout des fichiers css au thme

Commencez par informer Drupal que votre thme contient sa propre feuille de style CSS.
h h
ditez le fichier culinary.info la fin du fichier, ajoutez la ligne

stylesheets[all][] = default.css
La notation de cette ligne peut paratre complexe. Il est pourtant intressant de comprendre sa syntaxe car beaucoup de directives du fichier .info la suivent. stylesheets [all] [] Cest le nom de la variable de type tableau (array) de drupal laquelle il va falloir ajouter un lment. Utilis uniquement pour les feuilles CSS, cest le mdia dans lequel la feuille de style devra tre utilise. Ici tous les mdias, mais on aurait pu utiliser [screen] (cran) ou [print] (imprimante). Comme en PHP, ce double crochet indique que llment sera ajout en fin de tableau.
359
Il est galement possible de crer un sous-rpertoire pour regrouper lensemble des fichiers css du projet. Dans ce cas, il faut indiquer le chemin relatif du fichier CSS par rapport au fichier .info. Exemple pour un sous-rpertoire css :
stylesheets[all][] = css/default.css
html.tpl.php doit maintenant charger la liste des fichiers css de Drupal. Cette liste se trouve dans la variable $styles du template :
h h
ditez le fichier html.tpl.php Remplacez la ligne

<link href="default.css" rel="stylesheet" type="text/css" />
par
<?php print $styles; ?>
h
Videz le cache Si vous tes bloqu sur votre site Drupal cause du thme, entrez lurl http://localhost/drupal-7.7/?q=admin pour afficher une page qui utilise le thme dadministration Seven.
Affichez nouveau la page daccueil du site
Les feuilles de styles ont t ajoutes
360
V - Les thmes
Le contenu est toujours statique, mais la feuille de style du thme a t ajout ainsi que toutes les autres feuilles de style des diffrents modules Drupal utiliss.
3.1.5 Ajout des fichiers Javascript au thme

Le design Culinary ne contient pas de fichier Javascript, il est pourtant important dafficher la variable $script dans le template html.tpl.php pour que les fichiers .js des modules soient insrs au site.
h h
ditez le fichier html.tpl.php Ajoutez la ligne suivante sous celle des styles
<?php print $scripts; ?>
Un grand nombre de fichiers .js sont ajouts par les modules de Drupal
3.1.6 Le template page.tpl.php

Comme son nom lindique, le template html.tpl.php gre le code de la balise <html>. Le contenu de la page est gr dans page.tpl.php (balise <body>).
h h
Crez un fichier page.tpl.php dans le rpertoire templates du thme culinary Copiez le code se trouvant lintrieur de la balise <body> du fichier html.tpl.php (attention, il ne faut pas copier la balise <body>) et remplacez-le par le code suivant qui appellera page.tpl.php. Le code de la balise <body> devra tre :
<body> <?php print $page ?> </body>
h h
Collez le code se trouvant lintrieur de <body> dans le fichier page.tpl.php Videz le cache
Lapparence de votre thme nest pas modifi par ces actions, mais les variables PHP disponibles dans page.tpl.php sont diffrentes de celles de html.tpl.php.
361
3.2
Les rgions
Dans le Chap. I 2.1 Block : les blocs, vous avez positionn des blocs dans diffrentes rgions du thme Bartik. Chaque thme doit au moins dfinir 4 rgions : page_top, page_bottom, help et content. Elles sont en effet utilises par certains modules du cur de Drupal. Ensuite, il est possible de dfinir autant de rgions quil est ncessaire.
3.2.1 Cration des rgions

Pour ce thme, trois autres rgions seront dfinies : Menu primaire : menu du haut ; Colonne latrale : colonne latrale de droite ; Pied de page. Cest dans le .info que vous dcrivez les rgions de votre thme.
h
ditez le fichier culinary.info et ajoutez les lignes suivantes :

regions[page_top] = Haut de page regions[help] = Aide regions[page_bottom] = Bas de page regions[content] = Contenu regions[menu] = Menu principal regions[sidebar_first] = Colonne laterale regions[footer] = Pied de page
Pour chaque rgion dfinie dans le .info, une variable est disponible dans le template page.tpl.php. Par exemple, pour la rgion menu, une variable $page[menu] contenant le contenu des blocs afficher dans cette rgion sera disponible. Ltiquette (Menu principal) sera utilise pour le placement des blocs. Drupal placera automatiquement les blocs de votre installation dans les rgions de votre thme si vous utilisez des noms gnriques. Par exemple, tous les blocs que vous avez plac en Colonne latrale gauche de Bartik seront placs automatiquement en Colonne latrale de Culinary si le nom de variable de la rgion est sidebar_first. Drupal dfini automatiquement les rgions suivantes pour tous les thmes : sidebar_first, sidebar_second, content, header, footer, highlighted, help, page_top, page_bottom, dashboard_main, dashboard_sidebar, dashboard_inactive Cependant, je vous conseille de toutes les redfinir dans le .info pour plus de clart.
362
V - Les thmes
3.2.2 Affichage du contenu, rgion content

Il sagit maintenant dutiliser les variables disponibles dans les templates. Vous allez commencer par afficher le contenu de la page grce la variable $page[content] dans le template page.tpl.php.
h h h
ditez page.tpl.php Remplacez le code lintrieur de la balise <div id=content> par :

<?php print render($page['content']); ?>
Le code devra donc tre :

<div id="content"> <?php print render($page['content']); ?> </div> 
La variable $page['content'] contient un tableau de diffrents lments afficher (contenu dune node, liste des nodes). La fonction render transforme ce tableau en code HTML qui sera affich par le navigateur.
h
Sauvegardez le fichier et rechargez la page
Culinary affiche le contenu et le Javascript fonctionne
3.2.3 Affichage des blocs dans la rgion colonne latrale

La variable $page[sidebar_first] contient le code html des blocs placs dans la rgion Colonne latrale. Elle sutilise de la mme faon que $page[content].
h h
ditez page.tpl.php Remplacez le code lintrieur de la balise <div id=sidebar> :

<div id="sidebar">
363
<?php print render($page['sidebar_first']); ?> </div> 

h
Les blocs sont maintenant affichs
Vous pouvez vrifier si vos rgions sont correctement configures en allant sur la page dAperu des rgions des blocs s
h h
Menu Structure lien Blocs Lien Aperu des rgions des blocs (Culinary)
Les deux rgions sont correctement configures
364
V - Les thmes
3.2.4 Exercice : le menu

Afficher le menu Menu principal la place du menu du design.
Affichage du menu dans Culinary
Corrig
Lors de la cration dun menu, un bloc correspondant est cre. Il suffit donc de crer une rgion menu et dafficher le bloc Menu principal dans cette rgion. Il faut tout dabord afficher la variable $page[menu] dans page.tpl.php :
h h
ditez page.tpl.php Remplacez ainsi le code lintrieur de la balise <div id="menu"> :

<div id="menu"> <?php print render($page['menu']); ?> </div> 
Enregistrez le fichier Menu Structure lien Blocs Lien configurer du bloc Menu principal Titre du bloc : <none> Bouton Enregistrer le bloc Choisir la rgion Menu principal pour le menu Menu principal
Il faut maintenant positionner le bloc dans la rgion menu :

h
Il ne faut pas que le titre du bloc saffiche :

h h h
Vous retournez alors sur la page de gestion des blocs :

h
Choix de la rgion pour le bloc de menu
365
3.2.5 Exercice : le footer

Proposez une interface au Webmaster pour modifier le texte du Pied de page.
Texte de pied de page administrable
Corrig
Lide nest bien sr pas de crer un module permettant de saisir le texte du pied de page mais de crer un bloc personnalis (chap. II 2.1.4 Ajouter un bloc personnalis) et de lafficher en rgion Pied de page. Cration du bloc :
h h h h h h h
Menu Structure lien Blocs Lien + Ajouter un bloc Description du bloc : Pied de page pour thme Culinary Titre du bloc : <none> Corps du bloc :
Et voici le nouveau pied de page modifier !
Paramtres de la rgion : choisir Pied de page pour le thme Culinary Bouton Enregistrer le bloc ditez page.tpl.php Remplacez ainsi le code lintrieur de la balise <div id="footer"> :
<div id="footer"> <?php print render($page['footer']); ?> </div> 
Il faut maintenant afficher la variable $page[footer] dans page.tpl.php :

h h
Enregistrez le fichier
366
V - Les thmes
3.2.6 Les autres rgions

Il reste trois rgions dfinir page_top, page_bottom et help qui sont utilises par certains modules du coeur de Drupal.
Rgion help
h h
ditez le fichier page.tpl.php Avant la ligne <div id="content">, insrer le code suivant :
<div id="help"> <?php print render($page['help']); ?> </div>
 h
Les rgions page_top et page_bottom

Il est possible dinsrer les variables $page[page_top] et $page[page_bottom] dans le template page.tpl. php comme vous lavez fait pour les autres rgions. Cependant, il est prfrable de le faire dans html.tpl.php juste aprs la balise <body> pour tre sr quaucun code html ne sintercale entre les deux. Pour cela, html.tpl.php dispose de deux variables $page_top et $page_bottom.
h h
ditez le fichier html.tpl.php Modifiez le code de la balise <body> ainsi :

<body> <?php print $page_top ?> <?php print $page ?> <?php print $page_bottom ?> </body>
Ainsi, le module Toolbar, qui utilise la rgion page_top fonctionne avec votre thme.
Theming du contenu
Vous avez jusqu maintenant travaill sur la page de base de votre thme. Il est galement possible de prsenter le contenu de votre site. Dans cette section, vous allez apprendre prsenter les lments dune node de type Recette. Le module chap. IV 4.6 Display suite : prsentez vos contenus en utilisant linterface de Drupal permet de prsenter le contenu simplement.
4 - Theming du contenu
367
4.1
h h
Crer un template spcifique pour un type de contenu
Affichez une page contenant une node de type Recette Slectionnez lensemble du contenu de la node avec Theme developer
Inspection du template node.tpl.php
Theme developper vous apporte ces informations : le template utilis est node.tpl.php ; les champs de la node sont disponibles sous forme de variable ($field_temps_preparation). Lide est ici de crer un fichier sinspirant de node.tpl.php dans notre thme qui sera utilis uniquement pour afficher les contenu de type recette :
h h
Copiez le fichier modules/node/node.tpl.php Collez ce fichier dans le rpertoire de votre thme Theme Developper indique la ligne Candidate template files que le fichier peut prendre les noms suivants : node.tpl.php : le template est utilis pour afficher le contenu de toutes les nodes ; node--recette.tpl.php : le template est utilis pour afficher le contenu des nodes de type recette ; node--6.tpl.php : le template est utilis pour afficher le contenu de la node 6.
h h h
Renommez le fichier node.tpl.php de votre thme en node--recette.tpl.php Effacez les caches Slectionnez nouveau lensemble du contenu de la node avec Theme developer
368
V - Les thmes
Le template de votre thme est maintenant utilis
4.1.1 Crer un template node.tpl.php sur-mesure

Le template node.tpl.php a accs la valeur de tous les champs du type de contenu affich. Pour afficher le contenu, il est donc possible de reprendre le code par dfaut de node.tpl.php ou de crer du code sur mesure. Cest ce que vous allez faire, dans un premier temps, dans cette section.
Affichage du titre
h
Gardez uniquement la balise <div> parente du template node--recette.tpl.php
Le titre de la node est dans la variable $title. Ajoutez la classe "post" dans la balise parente <div> pour que la classe css de culinary sapplique et insrez-y le code suivant pour afficher le titre :
<div id="node-<?php print $node->nid; ?>" class="post <?php print $classes; ?> clearfix"<?php print $attributes; ?>> <h2 class="title"><a href="#"><?php print $title ?></a></h2> </div>
node--recette.tpl.php n'affiche que titre de la node
Affichage du corps
Le corps de la node (body) est disponible dans la variable $body.
369
Contenu de la variable $body
Pour lafficher dans le template, il suffit donc dajouter le code suivant aprs le titre :
<?php print $body[0]['safe_value'] ?>
Llment [value] est la valeur du body brute, llment ['safe_value'] est la valeur du body filtre par le format dentre. Vous pouvez alors modifier le code HTML pour quil sadapte au design Culinary :
<div class="entry"> <div class="intro"> <?php print $body[0]['safe_value'] ?> </div> </div>
Le titre et le body
370
V - Les thmes
Affichage du temps de prparation

Un champ personnalis saffiche de la mme faon :
Champ personnalis
Il faut donc ajouter le code suivant :

<div class="temps"> <?php print "Temps de prparation : ".$field_temps_preparation[0] ['value']?> </div>
Si votre site est multilingue, utilisez la fonction t() pour afficher vos chanes de caractres comme avec les modules (chap. VI 1.2.5. Conventions et finitions).
Afficher la liste des ingrdients

Pour afficher les champs contenant un nombre de valeurs suprieur un, il faut utiliser une boucle en PHP.
Le nombre de valeurs du champ est illimit
Il s'agit donc de parcourir le tableau $field_ingredients et d'afficher chaque valeur. Linstruction foreach() est alors utilise :
<h3>Ingrdients</h3> <ul class="ingredients"> <?php foreach ($field_ingredients as $ingredient) : ?> <li><?php print $ingredient['safe_value'] ?></li> <?php endforeach; ?> </ul>
371
La liste des ingrdients est affiche
Afficher limage
Vous pouvez galement utiliser la fonction render() pour afficher un champ que vous ne dsirez pas retravailler. Cela pourrait-tre le cas pour le champ image (photo de la recette). Ajoutez le code suivant au template :
<div class="image"> <?php print render($content['field_image'])?> </div>
Affichage de limage en style medium et sans tiquette
Limage sera alors rendue selon les paramtres utiliss pour laffichage du champ Photo de la recette.
Configuration du champ affich par la fonction render($content[field_image])
372
V - Les thmes
Exemple de rendu
Vous pouvez continuer ainsi afficher chaque champ de votre type de contenu. Lexemple dimplmentation suivant contient du code php pour le template et un fichier recette.css qui lui applique un style spcifique. Il faut indiquer dans le fichier .info du thme que ce fichier css est utilis.
h h
Dans le fichier culinary.info, ajoutez la ligne suivante :

stylesheets[all][] = recette.css
Puis crez le fichier recette.css

.infos { float: right; font-style: normal; margin: 0 0 1em 1em; border: 1px solid black; padding: 1em; color: white; background-color: #E14949; } ul.ingredients { font-style: normal; margin-left: 2em; } ol.etapes li{ list-style: decimal outside none; } .image { float: right; margin: 0 0 1em 1em; }
Enfin, voici le contenu du fichier node--recette.tpl.php

<div id="node-<?php print $node->nid; ?>" class="<?php print $classes; ?> clearfix post"<?php print $attributes; ?>> <h2 class="title"> <a href="#"><?php print $title ?></a> </h2> <p class="byline">Post par <?php print $name ?></p> <div class="entry"> <div class="infos"> <div class="temps"> <?php print "Temps de prparation : ".$field_temps_preparation[0] ['value']?> min </div>
373
<div class="prix"> <?php print "Prix : ".$field_prix[0]['value']?> </div> </div> <div class="intro"> <?php print $body[0]['safe_value'] ?> </div> <h3>Ingrdients</h3> <ul class="ingredients"> <?php foreach ($field_ingredients as $ingredient) : ?> <li><?php print $ingredient['safe_value'] ?></li> <?php endforeach; ?> </ul> <h3>Etapes</h3> <div class="image"> <?php print render($content['field_image'])?> </div> <ol class="etapes"> <?php foreach ($field_etapes as $etapes) : ?> <li><?php print $etapes['safe_value'] ?></li> <?php endforeach; ?> </ol> </div> </div>
Prsentation de la recette dans Culinary
374
V - Les thmes
Les tapes de la recette
Cette mthode de cration sur-mesure dun template pour un type de node est tout indique si vous avez un design contenant beaucoup de code HTML spcifique. Mais ne perdez pas de vue quelle comporte galement des dfauts : non utilisation de certains lments de configuration des champs (prfixe et suffixe, ordre, format, etc.) ; vous devez afficher la main les autres lments de node.tpl.php comme les commentaires, les liens vers les termes de taxonomy, etc. Pour la suite de ce livre, vous utiliserez des pratiques moins radicales en vous basant sur le template de Drupal par dfaut.
h h
Copiez le contenu du fichier modules/node/node.tpl.php Collez-le dans le fichier node--recette.tpl.php Il est galement possible de se baser sur les fichiers node.tpl.php des thmes existants (par exemple, celui de Bartik).
4.1.2 Fonctions Hide et Show (afficher limage sous les commentaires)

Dans le template node.tpl.php par dfaut, la ligne print render($content); affiche lintgralit du contenu. Cela peut poser problme si vous dsirez afficher un lment en dehors du contenu. Dans cet exemple, vous afficherez limage (photo de la recette) tout en bas de la page, aprs les commentaires. Le contenu du fichier node--recette.tpl.php utilis est celui du template par dfaut : modules/ node/node.tpl.php.
375
La fonction render()
La fonction render() prend en paramtre un lment qui contient des instructions traduire en code HTML. Cet lment est un tableau pouvant contenir dautres lments traduire :
Contenu du tableau $content
Il est possible de traduire un lment fils du tableau $content grce la fonction render : render($content['field_image']); traduit uniquement llment field_image. Pour afficher limage en bas de page, entrez le code suivant juste avant la dernire balise </div> :
<?php print render($content['field_image']); ?>
Limage affiche en dehors du contenu
Hide
Votre image est alors affiche deux fois : une fois en bas de page et une fois dans le contenu. Il est possible de cacher un lment fils du tableau grce la fonction hide(). Pour cela, entrez le code suivant juste avant la ligne print render($content); :
hide($content['field_image']);
376
V - Les thmes
Show
Inversement, la fonction show() permet dafficher un lment qui ne devrait plus ltre :
h
Affichez limage en haut de la page, avant le titre en dplaant la ligne <?php print render($content[field_image]); ?>.
Limage saffiche alors en haut, mais elle ne saffiche plus dans le contenu car elle a dj t traduite. Pour lafficher dans le contenu, entrez le code suivant juste avant la ligne print render($content); :
show($content['field_image']);
Ainsi, limage saffiche galement dans le contenu.
4.1.3 Modifier laffichage dun item grce au template field.tpl.php

Si vous dsirez modifier le code HTML dun seul champ dune node, cela est possible grce un template qui est associ chaque champ. Vous allez ici mettre en forme uniquement le champ " tapes " :
h
Avec Theme developper, slectionnez le champ tapes
Fonction de thme theme_field()
Ici, aucun template nest appel, et Drupal utilise une fonction de thme. Vous dcouvrirez plus tard dans cette section comment sutilise une fonction de thme. Le champ theme_hook_suggestions est lquivalent de la section Candidate function names : field--text_long.tpl.php : le template est utilis pour afficher les champs de type texte long ; node--field_etapes.tpl.php : le template est utilis pour afficher le contenu des champs tapes ; node--recette.tpl.php : le template est utilis pour afficher le contenu des champs des nodes de type recette ; node--field_etapes--recette.tpl.php : le template est utilis pour afficher le contenu des champs tapes des nodes de type recette.
377
Il existe un fichier template field.tpl.php par dfaut dans le rpertoire modules/field/theme/field.tpl.php :

h h
Copiez le fichier modules/field/theme/field.tpl.php dans votre rpertoire de thme Renommez-le en node--field_etapes.tpl.php ajout de balises <ol> et <li> ; mettre une classe etapes sur la balise <ol>.
<div class="<?php print $classes; ?> clearfix"<?php print $attributes; ?>> <?php if (!$label_hidden) : ?> <div class="field-label"<?php print $title_attributes; ?>><?php print $label ?>: </div> <?php endif; ?> <ol class="etapes field-items"<?php print $content_attributes; ?>> <?php foreach ($items as $delta => $item) : ?> <li class="field-item <?php print $delta % 2 ? 'odd' : 'even'; ?>"<?php print $item_attributes[$delta]; ?>> <?php print render($item); ?> </li> <?php endforeach; ?> </ol> </div>
Il suffit maintenant de modifier le code du template :
Videz les caches
tapes numrotes par la balise <ol>
Le fichier recette.css du chapitre prcdent doit tre charg par le .info pour que la classe " etapes " sapplique.
4.2
Le fichier template.php
Le fichier template.php occupe une place part dans les thmes. Il permet dinclure du code PHP pur pour vos thmes. En effet, il est peu recommand pas indiqu dinclure du code PHP complexe dans vos templates.
378
V - Les thmes
Ce fichier permet deux choses : de modifier les fonctions de thmes existantes en les surchargeant ; dajouter ou de modifier des variables via des fonctions preprocess.
4.2.1 Ajout dune variable un template

Lorsque vous avez utilis theme_developper, peut-tre avez-vous remarqu une ligne Preprocess functions.
Fonctions de preprocess disponibles pour node.tpl.php
Avant dinterprter le code dun template, Drupal regarde si une fonction preprocess existe. Si elle existe, il lexcutera. Dans lexemple suivant, vous utiliserez une fonction de preprocess pour ajouter une variable au template node--recette.tpl.php.
h
Crez le fichier template.php la racine de votre thme Attention ne pas ajouter ce fichier dans le rpertoire templates de votre thme !
Ajoutez-y le code suivant :

<?php function culinary_preprocess_node(&$variables) { if ($variables['type'] == "recette") { $variables['test'] = 'Je suis la !'; } }
Ce code nest pas trs compliqu. Vous devez utiliser la fonction de preprocess template_preprocess_ node comme vous la indiqu Theme Developper. Il faut remplacer le mot template_ par le nom de votre thme (culinary_). Cette fonction prend en argument le tableau de toutes les variables disponibles. Il suffit donc dajouter une variable ce tableau pour pouvoir lutiliser dans votre template. Largument $variables est pass par rfrence (&$variables). Ainsi, toutes les modifications faites sur ce tableau seront conserves.
h
Videz les caches
379
Rechargez la page et pointez vers le template node--recettes.tpl.php avec Theme developper
La nouvelle variable a t ajoute
Vous pouvez donc utiliser la variable "test" dans le template node.tpl.php.
4.2.2 Exercice : ajout des variables nombre_etapes et nombre_ ingredients

Calculez les variables nombre_etapes et nombre_ingrdients ; affichez les dans le template node.tpl.php.
Utilisation des variables cres dans le template
Corrig
Dans le fichier template.php, modifiez la fonction :
function culinary_preprocess_node(&$variables) { if ($variables['type'] == "recette") { $variables['nombre_ingredients'] = count($variables['field_ingredients']); $variables['nombre_etapes'] = count($variables['field_etapes']); } }
Puis, dans le fichier node--recette.tpl.php, affichez les variables :

<div class="submitted"> <?php print $submitted; ?><br/> <?php print 'nombre d\'tapes : '.$nombre_etapes ?>, <?php print 'nombre d\'ingrdients : '.$nombre_ingredients ?> </div>
4.2.3 Les fonctions de thme

Vous avez dj rencontr une fonction de thme lorsque vous avez point vers un champ du contenu (Fonction theme_field()). Vous avez alors utilis un template pour la surcharger. Mais il est galement possible de surcharger une fonction de thme par une autre fonction dans le fichier template.php. Par exemple, le fil dariane utilise une de ces fonctions. Vous allez la modifier :
380
V - Les thmes
Vrifiez que le fil dariane saffiche avec votre thme. Pour cela, la ligne <?php print $breadcrumb; ?> doit se trouver juste au dessus de la ligne <div id="content">. Positionnez-vous ensuite sur la page dun terme de taxonomie ayant un terme parent.
Fil darianne du terme Sicile

h
Pointez vers le fil dariane avec Theme developper
Le fil dariane est affich avec la fonction theme_breadcrumb()
Tout comme pour les templates, il est conseill de reprendre le code par dfaut de la fonction et de le modifier ensuite. Theme developper peut une nouvelle fois vous aider :
h
Cliquez sur le lien theme_breadcrumb()
Vous arrivez alors sur la page api.drupal.org correspondant la fonction. Copiez la section Code de la page.
Code original de la fonction
5 - Les variables disponibles dans les templates
381
Remarquez que api.drupal.org indique que la fonction est dans le fichier includes/theme.inc.
h h
Dans le fichier template.php de votre thme, collez le code de la fonction Modifiez son nom de theme_breadcrumb en culinary_breadcrumb
Vous pouvez maintenant modifier le code de la fonction comme bon vous semble. Vous pouvez par exemple changer le caractre de sparation. Pour cela, modifiez la ligne suivante :
$output .= '<div class="breadcrumb">' . implode(' + ', $breadcrumb) . '</ div>';
h
Videz les caches
Le nouveau fil dariane
Les variables disponibles dans les templates
Cette section liste les principales variables des principaux templates de Drupal et donne un exemple dutilisation de ces variables pour le thme culinary.
5.1
$styles $scripts $css $page
Variables de html.tpl.php
Balise <style> mis en forme qui importe les fichiers CSS ncessaires la page. Balise <script> mis en forme qui importe les fichiers javascript ncessaires la page. Tableau qui liste des chemins et noms des fichiers CSS ncessaires la page. Contenu de la page. Haut de page pouvant tre modifi par tous les modules (Toolbar ou administration menu par exemple). Cette variable doit tre place avant $page. Idem $page_top pour le bas de page. Objet php dcrivant le langage courant de la page (Par exemple, pour afficher le nom du langage : $language->native). Code html pour les meta tags du head (description, icone, etc.). Titre de la page : attention, ce titre saffiche en titre de la fentre (ou onglet) du navigateur et pas lintrieur du contenu. Classes CSS qui peuvent tre utilises dans la balise <body>.
$page_top $page_bottom $language $head $head_title $classes
382
V - Les thmes
Voici un exemple de fichier html.tpl.php pour Culinary :

<html xmlns="http://www.w3.org/1999/xhtml"> <head> <?php print $head ?> <meta http-equiv="content-type" content="text/html; charset=utf-8" /> <title><?php print $head_title; ?></title> <?php print $scripts; ?> <?php print $styles; ?> </head> <body <?php print $classes?>> <?php print $page_top ?> <?php print $page ?> <?php print $page_bottom ?> </body> </html>
Noubliez pas que vous pouvez vous baser sur les templates existants des autres thmes, par exemple celui de Bartik.
5.2
Variables de page.tpl.php
Nom du site (Menu Configuration lien Informations). Slogan du site (Menu Configuration lien Informations). Adresse de la page daccueil (Menu Configuration lien Informations). Utilise pour lier le logo la page daccueil. Vrai si vous tes sur la page daccueil. Chemin vers le fichier logo upload depuis la page de configuration du thme. Titre de la page. Onglets disponibles pour la page (Ex : diter et Voir pour une node). Messages Drupal afficher (Ex : La node xxx a bien t enregistre). Fil dariane. Url de base de votre installation de Drupal (Ex : /drupal/ ). Rpertoire courant du template (Ex : sites/all/themes/culinary). Vous pouvez galement utiliser les variables $page['nom_de_region'] pour afficher le contenu dune rgion.
$site_name $site_slogan $front_page $is_front $logo $title $tabs $messages $breadcrumb $base_path $directory
Voici un exemple de fichier page.tpl.php pour Culinary :

<div id="wrapper"> <div id="header"> <div id="logo"> <h1><a href="<?php print $front_page; ?>"><?php print $site_name; ?></ a></h1>
5 - Les variables disponibles dans les templates
383
<?php if ($site_slogan): ?> <h2><?php print $site_slogan; ?></h2> <?php endif; ?> </div>  </div>  <div id="menu"> <?php print render($page['primary_menu']) ?> </div>  <div id="page"> <div id="page-bgtop"> <?php if ($messages): ?> <div id="messages"> <?php print $messages; ?> </div> <?php endif; ?> <?php print $breadcrumb; ?> <div id="content"> <?php if ($title): ?> <h1 class="title" id="page-title"> <?php print $title; ?> </h1> <?php endif; ?> <?php if ($tabs): ?> <div class="tabs"> <?php print render($tabs); ?> </div> <?php endif; ?> <?php print render($page['content']); ?> </div>  <div id="sidebar"> <?php print render($page['right']) ?> </div>  <div style="clear: both; height: 1px"></div> </div> </div>  <div id="footer"> <?php print render($page['footer']) ?> </div>  </div> 
384
V - Les thmes
5.3
$title $date $content $nid $vid $user $field_xxx
Variables de node.tpl.php
Titre de la node. Date de cration de la node. Contenu de la node mis en forme. N de la node. N de version de la node. Objet user de lauteur de la node. Tableau correspondant aux occurrences des champs (exemple : $field_temps_preparation).
Un exemple dutilisation de ces variables est disponible chap. V 4.1.1 Crer un template node.tpl.php sur-mesure.
Le theming des vues

Lisez le chap. II 1 Views avant celui-ci
De nombreux templates peuvent tre utiliss pour modifier la sortie de vos vues. Linterface de Views vous aide retrouver le nom du template utiliser dans vos thmes et fourni le code de base du template.
Utilisation
h h
Cliquez sur le lien modifier de la vue Liste des recettes Dans la section AUTRE, cliquez sur le lien Thme : Informations
Saffiche une fentre popup contenant des informations sur les templates utiliss par votre thme pour afficher la vue.
h
Choisissez le thme Orange
Les templates utiliss par Orange
6 - Le theming des vues
385
Cette page est uniquement une page contenant des informations importantes concernant le theming de votre vue. Vous ne pouvez excuter aucune action partir dici.
Les styles de template

Il existe trois types de template : sortie de laffichage (views-view) : cest le template principal de la vue. Il affiche tout ce qui est en dehors des donnes de la vue : le titre, len-tte et le pied de page, les lments de pagination, le lien more, etc. ; sortie du style (views-view-nomdustyle) : ce template varie selon le format de laffichage. Pour un format en tableau, il affichera la balise <table> et len-tte du tableau <thead> ; sortie des champs (views-view-field) : il existe un template par champ. Il affiche le contenu du champ.
Choisir un nom de template

Le template sera utilis dans certains contextes selon le nom de fichier quil porte. Le nom dun template dune vue est form ainsi :
views-view-[style ou champ]--[nom de la vue]--[nom de l'affichage]--[nom du champ].tpl.php
Les chanes [] permettent de limiter le champ daction des templates. Voici quelques exemples et leur champs dutilisation (attention, certains noms de template peuvent choquer les mes sensibles) : views-view-table.tpl.php : ce template sera utilis pour tous les affichages utilisant le format tableau ; views-view-field--title.tpl.php : ce template sera utilis pour tous les champs ayant pour id title ; views-view-field--liste-des-recettes--field-illustration.tpl.php : un nom coucher dehors pour un template qui sera utilis pour le champ field-illustration dans la vue liste-des-recettes ; views-view-field--liste-des-recettes--page.tpl.php : ce template sera utilis pour les champs de la vue liste des recettes avec un affichage de type page.
Crer un template
Vous allez ici crer un template qui ajoutera une mention Bon march sous le titre lorsque le prix de la recette sera infrieur 4.00 EUR. Il faut commencer par choisir le nom du template qui convient. Ici, le template doit sappliquer sur le champ title, pour tous les affichages de la vue liste des recettes. Son nom sera donc :
views-view-field--liste-des-recettes--title.tpl.php
h
Dans le rpertoire sites\all\themes\orange\orange\templates, crez le fichier views-view-field--liste-des-recettes--title.tpl.php
386
V - Les thmes
Vous pouvez vrifier par Views que le template est pris en compte :
h h h
Cliquez sur le lien modifier de la vue Liste des recettes Dans la section AUTRE, cliquez sur le lien Thme : Informations Bouton Re-scanner les fichiers de template
ce moment, le nom du template utilis pour laffichage slectionn est en gras.
Le nouveau template est bien dtect

h
Vous devez rcuprer le code par dfaut du template en cliquant sur le lien Champ Contenu : Titre (ID: title)
Code original du template

h
Copiez le code dans le presse papier et collez-le dans le fichier cr prcdemment
Plusieurs variables sont votre disposition dans ce template. Vous pouvez par exemple utiliser $row pour rcuprer la valeur des autres champs de la ligne.
6 - Le theming des vues
387
Extrait du contenu de $row

h
Il suffit maintenant dajouter un peu de code dans votre template :

<?php if ($row->field_field_prix[0]['raw']['value'] > 4) : ?> <?php print $output; ?> <?php else :?> <?php print $output; ?> <br/> <em>Bon march</em> <?php endif; ?>
Enregistrez le fichier
Modification du champ titre en fonction du champ prix par le thme
Cet exemple de modification dune vue par un thme est visuel, mais il nest pas conseill dajouter du contenu via un template.
1 - Environnement de dveloppement
389
Chapitre
VI
Introduction la cration de modules
D
1
velopper un module Drupal peut parfois vous sauver si une fonctionnalit nexiste pas ou si vous souhaitez modifier certains comportement de Drupal. Sattaquer cette tche peut dabord paratre insurmontable mais finalement elle s'avre assez simple. Le but de ce chapitre est de vous permettre de dbuter en douceur la programmation avec Drupal. Il vous prsentera toute une palette doutils qui vous faciliteront votre vie de dveloppeur Drupal.
Environnement de dveloppement
Pour dvelopper des modules Drupal, un diteur de texte suffit Notepad++ pour Windows ou Gedit pour Linux mais un environnement de dveloppement tel quEclipse, vous simplifiera la vie grce la compltion automatique et des options de dbuggage que vous dcouvrirez par la suite (chap. VI 3.4. Dbugger avec Eclipse) Cette section est donc facultative si vous tes uniquement intress par la programmation Drupal. Le cas chant, vous pouvez passer directement au chap. VI 1.2. Architecture dun module.
390
VI - Introduction la cration de modules
1.1
Installation et configuration dEclipse
Pour dvelopper un module Drupal avec Eclipse, le plus simple est de choisir la distribution PDT (PHP Developement Tools Outils de dveloppement PHP). Vous pourrez la trouver ladresse suivante : http://www.eclipse.org/pdt/downloads. Cependant, si Eclipse est dj install sur votre configuration, il est possible dinstaller PDT sous forme de plugins. Ce type dinstallation ne sera pas dtaill ici.
1.1.1 Installation sous Windows

h h h
Rendez-vous ladresse http://www.eclipse.org/pdt/downloads Tlchargez le package All-In-One Windows 32-bit (version PDT 2.2.0 utilise pour ce livre) Extrayez le contenu de larchive dans un rpertoire (c:\Programmes\eclipse pour ce livre) Eclipse est un programme crit en Java, il faut donc que lenvironnement d'excution Java soit galement install (JRE http://www.java.com/fr/download/).
h h
Excutez eclipse.exe (c:\Programmes\eclipse\eclipse.exe pour ce livre) Slectionnez le rpertoire de Workspace par dfaut et cochez la case Use this as the default and do not ask again
Slection du Workspace au lancement dEclipse
Le Workspace est lespace de travail (un rpertoire) ou Eclipse va stocker des donnes de configuration dans le sous-dossier .metadata. Lorsque vous crez un nouveau projet cest galement ce rpertoire qui sera utilis. Veillez donc ne pas choisir un sous-rpertoire de c:\wamp car vous nallez pas crer un nouveau projet mais en crer partir du rpertoire Drupal existant, et il nest pas possible dimporter un projet inclus dans le rpertoire Workspace.
391
Il est possible de changer de Workspace partir dEclipse dans le menu File Switch Workspace.
h
Cliquez sur OK
Vous arrivez alors sur votre espace de travail. Il faut maintenant configurer Eclipse pour Drupal. Rendezvous au chap. VI 1.1.3 Configuration dEclipse pour Drupal.
1.1.2 Installation sous Ubuntu

Installer Java
Eclipse est un programme crit en Java, il faut donc tout dabord que votre installation puisse excuter un programme Java. Vous pouvez consulter la documentation du site ubuntu-fr pour installer Java dune autre faon : http://doc.ubuntu-fr.org/java Il faut tout dabord ajouter les dpots qui contiennent lenvironnement Java
h h h h h
Dmarre Synaptic Onglet Autre logiciels Slectionner la ligne Partenaires de Canonical Bouton Fermer Puis, bouton Recharger de la fentre principale de Synaptic
sudo apt-get install sun-java6-jre sun-java6-plugin sun-java6-fonts
Il suffit maintenant dinstaller les paquets Java :
Installer Eclipse
Vous pouvez consulter la documentation du site ubuntu-fr pour installer Eclipse dune autre faon : http://doc.ubuntu-fr.org/eclipse
h h h h
Rendez-vous ladresse http://www.eclipse.org/pdt/downloads Tlchargez le package Linux x86/GTK 2 32-bit ou 64-bit(version PDT 2.2.0 utilise pour ce livre) Extrayez le contenu de larchive dans un rpertoire (/home/atelier/eclipse) Excutez le programme /home/atelier/eclipse/eclipse
392
Eclipse sur Ubuntu
1.1.3 Configuration dEclipse pour Drupal

Association de fichiers
Un module Drupal comporte des fichiers contenant du code php, et qui ont des extensions diffrentes de .php. Cest le cas pour les fichiers *.module, *.install, *.theme et *.engine. Il faut donc configurer Eclipse pour quil traite ces fichiers comme des fichiers php classiques.
h h h
Dans Eclipse, cliquez sur Window Preferences Dans la liste de gauche slectionnez la ligne General Content Types Dans la zone Content types, slectionnez la ligne Text PHP Content Type
393
La fentre des prfrences, section Types de contenus.

h h h
Bouton Add... Ajoutez *.module dans la zone de texte Faites de mme pour les extensions *.install, *.theme et *.engine Validez la fentre des prfrences en cliquant sur OK
Les 4 nouvelles extensions devraient maintenant apparatre dans la zone File associations
h
Indentation
Par convention, tous les fichiers de Drupal doivent tre indents par 2 espaces. Eclipse indente par dfaut dune tabulation de 4 blancs, mais il est possible de modifier ce comportement.
h h
Dans Eclipse, cliquez Window Preferences Dans la liste de gauche slectionnez la ligne General Editors Text Editors
394
h h
la ligne Displayed tab width, indiquez 2 Cochez la case Insert spaces for tabs
Rglage de lindentation dans Eclipse.
Les prfrences permettent de rgler un nombre important de paramtres dans Eclipse. La zone de texte situe en haut gauche de la fentre permet de faire une recherche parmi toutes les prfrences. Par exemple, sur la copie dcran prcdente, seul les items contenant le mot tab ont t slectionns.
h h
Bouton OK Puis menu File Restart pour que les prfrences modifies soient prisent en compte
Cration dun projet partir dun dossier Drupal

Un projet sous Eclipse PDT comporte lensemble des fichiers du site web. Pour une installation Drupal, cest donc le rpertoire racine de votre site quil va falloir importer dans le projet.
h h h
Menu File New PHP Project Donnez un nom votre projet dans la zone Project name (drupal pour ce livre) Slectionnez loption Create project at existing location (from existing source) et pointez vers votre rpertoire dinstallation Drupal (c:\wamp\www\drupal)
395
Cration dun nouveau projet partir dun rpertoire existant

h h
Bouton Finish Fermez la fentre Welcome
Vous pouvez maintenant vrifier que les fichiers *.module souvrent bien avec lditeur php et quils sont bien coloriss.
396
Le fichier modules/block/block.module dit avec Eclipse.
Eclipse est maintenant prt tre utilis pour dvelopper un nouveau module Drupal ! Vous en apprendrez plus sur Eclipse au chap. VI 3.4. Dbugger avec Eclipse.
1.2
Architecture dun module
Dans ce chapitre, vous crerez votre premier module qui affichera un bloc contenant le fameux message 'Hello World !'. Il est bien sr possible de crer un bloc de faon plus simple via la page de gestion des blocs, mais cela vous permettra de comprendre quelques lments essentiels de la programmation Drupal.
1.2.1 Le rpertoire du module et le fichier .info

Comme pour les thmes, chaque module possde son propre rpertoire.
h
Le module sappellera Hello, il faut donc crer le rpertoire sites/all/modules/hello
397
Il est possible de crer un rpertoire ou des fichiers directement depuis l'arborescence d'Eclipse : clic droit lendroit ou vous voulez crer le rpertoire puis New Folder. Comme pour les thmes, les informations gnrales des modules sont inscrites dans un fichier .info.
h h
Crez le fichier hello.info dans votre rpertoire hello Copiez-y le code suivant :
; $Id: name = Hello description = Hello from Atelier Drupal. core = 7.x version = 7.x-0.x-dev package = Atelier Drupal files[] = hello.module
Crez un fichier hello.module vide dans le rpertoire du module Rendez-vous sur la page dactivation : menu Modules
Ce fichier doit exister pour que Drupal affiche les informations relatives aux modules.
h
Le fichier .info interprt par Drupal
Le module hello apparat dans la liste une nouvelle section ATELIER DRUPAL. Voici une description de chaque ligne du fichier .info.
; $Id: name description core version package files[]
Ligne utilise par le CVS de Drupal pour la gestion des version du fichier. Nom du module, affich dans la colonne NOM . Description du module, affiche dans la colonne DESCRIPTION. Indique avec quelle version de Drupal le module est compatible, ici, toutes les versions 7. Version du module, affiche dans la colonne VERSION. Section dans laquelle le module sera affich. Liste des fichiers du module.
398
1.2.2 Les hooks

Vous tes maintenant prt crire le code php de votre module. Ce module hello devra afficher un bloc Hello World ! .
Lobjectif du module hello
Les blocs sont grs par le module Block de Drupal, ce module propose entre autre une page de configuration des blocs (menu Structure lien Blocs) qui permet de choisir la rgion dans laquelle le bloc sera affich et se charge ensuite dafficher les blocs dans chaque rgion. Pour le module Hello, il s'agit de dire au module Block : Je propose un nouveau bloc qui a pour nom Hello World, pour titre My first module say et pour contenu Hello World !!! . Pour que les modules puissent se parler , Drupal utilise un systme de hooks. Les modules peuvent proposer des services (hooks) que les autres peuvent utiliser. Par exemple, Block propose hook_block_info qui runira les informations sur les blocs de tous les modules afin de construire sa page (menu Structure lien Blocs). Cest la premire hook que vous allez utiliser :
h
Dans le fichier hello.module, insrez le texte suivant :

<?php function hello_block_info() { $block['hello-block'] = array( 'info' => 'Hello world !', ); return $block; }
Voyez maintenant le rsultat de ce code :

h h
Activez le module Hello Menu Structure lien Blocs
La hook hook_block_info a pris en compte notre module
399
Voici maintenant lexplication du code :

<?php function info() hello_block_
Indique que le script contient du code php. Remarquez qu'il n'y a pas de balise fermante la fin du script (?>) c'est une rgle de Drupal. Pour implmenter une hook, il faut crer une fonction ayant pour nom <nom_du_ module>_<nom_de_la_hook>. Cette fonction du module hello implmente donc hook_block_info. Cette hook attend en valeur de retour un tableau associatif contenant la liste des blocs du module. L'lment info du tableau associatif indique la description du bloc telle qu'elle sera affiche sur la page menu Structure lien Blocs. La fonction retourne le tableau $block
$block['hello-block'] = array( 'info' => 'Hello world !' return $block;
En rsum, lorsque la page menu Structure lien Blocs est affiche, le module Block dmarre sa hook hook_block_info. Drupal cherche alors dans les modules activs si ils comportent une fonction portant le nom <nom_du_module>_block_info. Si cest le cas, il retourne au module Block les tableaux associatifs qui dcrivent les blocs des modules.
1.2.3 Rechercher de la documentation sur http://api.drupal.org

Vous avez appris grce ce livre comment hook_block_info fonctionnait : le nom de la hook, le type de valeur retourner, les lments du tableau associatif retourner, etc. Mais comment faire pour savoir quelles autres hooks existent et comment elles sutilisent ? La rponse est sur http://api.drupal.org.
h h
Rendez-vous sur le site http://api.drupal.org. Dans la zone de recherche entrez hook_block
La liste des hooks du module block sur http://api.drupal.org
Dans la liste qui apparat, vous pouvez retrouver hook_block_info, mais galement hook_block_view qui permet dafficher les blocs et hook_block_configure, qui permet de personnaliser la page de configuration dun bloc, etc.
400
Cliquez maintenant sur la ligne hook_block_info
La documentation de hook_block_info
Sur cette page vous pouvez retrouver une description de la hook : un lien vers la documentation du module block (block.api.php) est propos ; une explication du fonctionnement de la hook est propose. Plus bas, une section Return Value est importante, elle indique que : la hook attend en retour un tableau associatif (Return value : An associative array) dont chaque lment est un bloc et les cls attendues (key-value pairs) ; une seule cl est obligatoire (required), cest la cl info ; dautres sont optionnelles : cache permet de grer la faon dont le bloc sera mis en cache. weight, statuts, region, visibility, pages permettent de rgler les valeurs par dfaut de votre bloc.
1.2.4 hook_block_view : afficher des blocs

Il sagit maintenant de dfinir le titre du bloc (My first module says), son contenu (Hello World !), et de demander au module block de lafficher. Pour cela, il faut utiliser hook_block_view.
La documentation de hook_block_view
401
La page de documentation indique que : cette hook prend un paramtre $delta qui permet didentifier le block qui saffiche. En effet, un module peut proposer dafficher plusieurs blocs ; la valeur de retour attendue est un tableau associatif ; ce tableau associatif devra comporter deux lments qui ont pour cls 'subject' et 'content'.
h
Voici donc le code ajouter au fichier hello.module pour implmenter hook_block_view

function hello_block_view($delta = '') { $block = array( 'subject' => 'My First module say :', 'content' => 'Hello World !!!' ); return $block; }
La dclaration de fonction doit tre identique celle trouve sur api.drupal.org. Ne vous privez donc pas d'un copier/coller depuis ce site et n'oubliez pas ensuite de changer le mot hook_ par le nom de votre module (ici hello_block_view).
h
Allez sur la page menu Strucure lien Blocs et mettez ce bloc en Sidebar First sous Bartik.
Vous devriez maintenant voir apparatre le bloc !
1.2.5 Conventions et finitions

Votre module saffiche, certes, mais il comporte encore quelques dfauts pour devenir un module Drupal accept par la communaut !
Commentaires
La premire raison pour laquelle un module Drupal doit tre correctement comment est quil est plus facile reprendre et maintenir. La seconde est que Drupal utilise ces commentaires de faon mcanique pour gnrer sa documentation. Les deux pages que vous avez visit sur api.drupal.org proviennent directement du code source de Drupal ! Cette prouesse est ralise grce au logiciel Doxygen (http://www.doxygen.org). Voici le fichier hello.module correctement comment :
<?php /** * @file * Display a Hello World block */ /** * Implementation of hook_block_info() */
402
function hello_block_info() { $block['hello-block'] = array( 'info' => 'Hello world !', ); return $block; } /** * Implementation of hook_block_view() */ function hello_block_view($delta = '') { $block = array( 'subject' => 'First module say :', 'content' => 'Hello World !!!' ); return $block; }
Un fichier de code source doit dbuter avec un commentaire @file qui dcrit la fonction principale du fichier. Chaque fonction doit tre dcrite avec ses paramtres. Si cette fonction implmente une hook, indiquez juste son nom. Pour en savoir plus sur la gnration automatique de documentation par Doxygen, rendez-vous la page http://drupal.org/node/1354.
fonction t()
Comme vous avez pu le voir au chap. IV 2. Site multilingue, chaque chane de linterface dun module peut tre traduite via diffrents modules. Cela sera possible pour vos propres modules si vous utilisez la fonction t() (pour Translate) autour de chaque chane de caractre de votre module :
$block['hello-block'] = array( 'info' => t('Hello world !'), ); $block = array ( 'subject' => t('First module say :'), 'content' => t('Hello World !!!') );
Pour certains champs, il ne faut pas utiliser la fonction t() car elle est automatiquement appele.
403
hook_help
Tout module doit implmenter cette hook qui permet dutiliser le module Help.
/** * Implementation of hook_help() */ function hello_help($path, $arg) { switch ($path) { case 'admin/help#hello': return '<p>' . t('Sample module from Atelier Drupal book. This module just provide a hello world block.') . '</p>'; } }
Cette hook prend en argument le chemin daccs la page daide. Le chemin ici est admin/help (page daide de Drupal) section hello :
Le module hello a t ajout aux pages daide
Si ce lien napparat pas, effacez tous les caches.
Le lien est galement ajout la page des modules
Page daide du module Hello
404
Utilisez le module chap. VI 3.2. Le module Coder pour voir si votre module respecte les conventions de codage. Le module Hello que vous avez dvelopp tout au long de cette section vous a permis de dcouvrir comment dbuter avec la programmation Drupal. Mais il ne faisait rien proprement parler. Cest pourquoi dans la prochaine section, vous allez dveloppererez votre premier vrai module Drupal grce lenvironnement que vous avez mis en place.
Votre premier module Drupal
Tout au long de cette section, vous crerez un module qui permet de produire un rsum de votre installation Drupal. la fin de cette section, ce module aura une page lurl /summary, qui affichera la liste des modules activs, les vocabulaires de taxonomy, et les types de contenus.
La page du module Summary
Une page de configuration du module permettra de slectionner les sections afficher et de modifier les titres de celles-ci.
2 - Votre premier module Drupal
405
La page de configuration du module
Il y a donc du travail !
2.1
La page Summary
2.1.1 Dmarrage
Comme pour le module Hello, il faut crer :
h h
Un rpertoire pour le module sites/default/modules/summary (ou sites/all/modules/summary) Un fichier summary.info

; $Id: name = Summary description = Display a Summary of your Drupal Installation. core = 7.x package = Atelier Drupal files[] = summary.module
406
Et enfin un fichier summary.module avec un commentaire descriptif et une page daide :

<?php /* * @file * Display a Summary of your Drupal Installation. */ /** * Implementation of hook_help() */ function summary_help($path, $arg) { switch ($path) { case 'admin/help#summary': return '<p>' . t('Sample module from Atelier Drupal book. This module provide a summary page of your Drupal Installation.') . '</p>'; } }
2.1.2 hook_menu() : crez une page associe une Url

Il sagit de crer une nouvelle page dont le chemin sera /summary et le titre Summary of your site. Pour cela il faut utiliser la hook hook_menu(). La longue page de documentation de la hook indique que la valeur de retour doit tre un tableau associatif dont chaque lment est un menu car il est bien sr possible davoir plusieurs pages pour un module. La cl de chaque lment doit dcrire son chemin. La hook_menu() ne dfini donc pas un item de menu mais associe une page avec une Url. Pour chaque menu, un tableau associatif doit tre dcrit. Ici, vous utiliserez les cls 'title', 'access arguments', 'type' et 'page callback'.
h
Ajoutez ce code au fichier summary.module :

/* * Implementation of hook_menu() */ function summary_menu() { $items['summary'] = array( 'title' => 'Summary of your site', 'access arguments' => array(true), 'type' => MENU_CALLBACK, 'page callback' => 'summary_content', ); return $items; }
407
/* * Content of the summary page */ function summary_content() { return 'Hello World !!!'; }
Voici une description des cls utilises pour cet exemple :

'title' 'access arguments' 'type' 'page callback'
Titre de la page . La fonction t() est automatiquement appele. Permet de dfinir les droits d'accs. Ici, tout le monde a le droit d'accder cette page. Type de page et de menu, permet d'indiquer si le menu doit tre affich dans le bloc d'admin, dans le fil d'arianne, si c'est une sous-page, etc. Nom de la fonction qui sera appele pour retourner le contenu.
En php, une fonction peut prendre en argument le nom d'une autre fonction et demander son excution par la suite. Elle est alors appele fonction callback.
h h
Activez le module Summary Pointez votre navigateur vers lUrl /summary
La page /summarty
Il reste maintenant gnrer le contenu de cette page.
2.1.3 Liste des modules activs

La premire section du module doit afficher la liste des modules. Aprs recherche sur http://api.drupal.org, la fonction module_list() semble tre cre pour cela. Testez la fonction dans le bloc Execute PHP de Devel. Chap. VI 3.1 Devel : simplifiez votre vie de dveloppeur.
408
Test de module_list() avec le module Devel
Rsultat de la fonction module_list()
La fonction module_list() retourne donc un tableau (Array) contenant la liste des modules activs. Il suffit donc de modifier la fonction summary_content et de traiter le tableau.
function summary_content(){ //List of all activated modules $summary_module_list = module_list(); $summary_module_list = t('<h3>List of all activated modules</h3>') . implode($summary_module_list,', '); $output = $summary_module_list; return $output; }
Le module en action
409
2.1.4 Liste des vocabulaires de taxonomy

De la mme faon que pour les modules, le site http://api.drupal.org informe que la fonction taxonomy_get_vocabularies() existe.
dpm(taxonomy_get_vocabularies());
taxonomy_get_vocabularies retourne donc un tableau dobjets (stdClass). Chacun de ces objets dcrit un vocabulaire. Le nom du vocabulaire est dans la proprit name des objets. Il faut donc parcourir chaque lment du tableau et rcuprer le nom du vocabulaire :
h
Ajoutez ce code la fonction summary_content :

// List of vocabularies $summary_vocabularies = taxonomy_get_vocabularies(); $summary_vocabularies_list=''; foreach ($summary_vocabularies as $vocab){ $summary_vocabularies_list .= $vocab->name . ','; } $summary_vocabularies_list = t('<h3>Vocabularies</h3>') vocabularies_list; $output .= $summary_vocabularies_list; return $output;
$summary_
2.1.5 Exercice : liste des types de nodes

Ajoutez le code ncessaire la fonction summary_content() pour lister les types de nodes existants.
La section Node types
410
Corrig
dpm(node_type_get_types());
La fonction node_type_get_types retourne un tableau dobjets (stdClass).

//List of node types $summary_node_types = node_type_get_types(); $summary_node_types_list = array(); foreach ($summary_node_types as $node_type) { $summary_node_types_list[] = $node_type->name; } $summary_node_types_list = t('<h3>Node types</h3>').implode($summary_node_ types_list, ', '); $output .= $summary_node_types_list;
2.2
La page de configuration du module
2.2.1 hook_menu() : ajout dune deuxime page pour le module

La page de configuration du module summary sera accessible partir admin/config/system/summary. Il faut donc ajouter un lment au tableau de la hook_menu.
function summary_menu(){ $items['summary'] = array( 'title' => t('Summary of your site'), 'page callback' => 'summary_content', 'access arguments' => array(true), 'type' => MENU_CALLBACK, );
de
lUrl
411
$items['admin/config/system/summary'] = array( 'title' => t('Summary settings'), 'description' => t('Summary configuration page'), 'page callback' => 'drupal_get_form', 'page arguments' => array('summary_admin_settings'), 'access arguments' => array('administer site configuration'), 'type' => MENU_NORMAL_ITEM, ); return $items;
Lurl de la page (admin/config/system/summary) permet dajouter un lien dans la page de configuration (config) la section systme (system). Le lien Menu item du bloc Devel permet de connatre les informations des diffrentes pages. Cette page de configuration sera en fait un formulaire HTML. Pour composer un formulaire, Drupal propose une API bien particulire qui sera dcrite plus tard.
'page_callback' 'page arguments' 'access argument' 'type'
Ici, on appelle une fonction drupal (drupal_get_form) qui construira le formulaire. Liste des arguments passer la fonction callback. Vrifie que l'utilisateur a les droits d'administration du site avant d'afficher la page. Nom de la fonction qui sera appele pour retourner le contenu.
Le but est de crer un formulaire, Drupal propose pour cela la fonction drupal_get_form. Cette fonction prend en argument le nom dune autre fonction qui dcrit les lments qui composeront le formulaire. La fonction qui dcrira le formulaire sappellera summary_admin_settings, donc hook_menu appelera drupal_get_form(summary_admin_settings) lorsque la page devra safficher.
2.2.2 Form API : crer des formulaires HTML dans Drupal

La page dadministration proposera une case cocher pour chaque section de summary permettant ladministrateur de choisir si la section doit safficher ou non.
412
Ajoutez le code suivant au fichier summary.module :

/* * Define the adminsitration form */ function summary_admin_settings(){ $form['summary_display'] = array( '#type' => 'checkboxes', '#title' => t('Sections of the summary'), '#description' => t('Check the sections to show in the summary page'), '#options' => array('module' => t('Module list'), 'vocabulary' => t('Vocabulary list'), 'content_type' => t('Content types')), ); return $form; }
Un tableau $form est donc cr, chaque lment de ce tableau est un lment du formulaire et peut se paramtrer grce des proprits. Voici la liste des proprits utilises :
'#type' '#title' '#description' '#options'
Type de widget utiliser. Ici des cases cocher. Titre afficher au dessus du widget. Texte d'aide en dessous du widget. Proprit propre aux cases cocher, tableau listant les cases cocher afficher et leurs tiquettes.
Une description de tous les lments pouvant tre insrs dans un formulaire est disponible la page : http://api.drupal.org/api/drupal/developer--topics--forms_api_reference.html Le lien Hook_elements() du bloc Devel affiche la liste des lments disponibles.
h
Menu Configuration lien Summary settings
Les premiers lments du formulaire
2.2.3 system_settings_form : ajouter le bouton de sauvegarde

Il manque le bouton de sauvegardes votre formulaire. Il serait possible den crer un en ajoutant un nouvel lment de #type submit au tableau $form, mais il est prfrable dutiliser la fonction system_settings_form qui ajoute les boutons ncessaires par dfaut des formulaires de configuration.
413
Modifiez la dernire ligne de la fonction summary_admin_settings comme cela :

return system_settings_form($form);
Le bouton ajout par system_settings_form
Le bouton est bien l, mais les paramtres ne sont pas encore enregistrs.
2.2.4 variable_get : sauvegarder des donnes dans la table variable

Voici comment modifier le code pour que les valeurs soient sauvegardes :
function summary_admin_settings(){ $form['summary_display'] = array( '#type' => 'checkboxes', '#title' => t('Things to show for the summary'), '#description' => t('Check the things to show in the summary page'), '#options' => array('module' => t('Module list'), 'vocabulary' => t('Vocabulary list'), 'content_type' => t('Content types')), '#default_value' => variable_get('summary_display',array('module', 'vocabulary')), ); return system_settings_form($form); }
La fonction variable_get permet de rcuprer des variables enregistrs dans le tableau de variables globales $conf, lui mme stock dans la table variables de la base de donnes de Drupal. Elle prend deux paramtres, le premier, obligatoire, est le nom de la variable rcuprer, le second, optionnel, est la valeur que retourne variable_get si aucune variable nest trouve dans $conf. Ici, on initialise donc le formulaire avec des valeurs par dfaut qui seront, soit prises dans le tableau $conf si elles sont prsentes, soit prises dans le second paramtre qui indique que les cases module et vocabulary sont coches par dfaut.
414
Pour afficher ce que contient $conf, vous pouvez excuter le code suivant dans le bloc Execute PHP du module Devel :
global $conf; dpm($conf);
Dernire question ; comment sont sauvegardes ces valeurs ? Et bien cest la fonction system_settings_form qui soccupe de tout ! Pour que la fonction system_settings_form sauvegarde automatiquement les paramtres, il faut veiller ce que le nom de l'lment de formulaire $form['summary_display'] soit identique celui du premier paramtre de variable_get variable_get('summary_display').
2.2.5 Exercice : personnalisation des titres des sections

Ajoutez des lments textfield permettant lutilisateur de modifier les titres des sections ;
Modification des titres de sections
ajoutez des lments fieldset pour les cases cocher et un autre pour les labels.
415
Ajout de fieldset
Corrig
Ajoutez des lments textfield permettant lutilisateur de modifier les titres des sections
$form['summary_module_label'] = array( '#type' => 'textfield', '#title' => t('Label of the module section'), '#description' => t('Change the label of the module section'), '#default_value' => variable_get('summary_module_label','Activated modules'), ); $form['summary_taxonomy_label'] = array( '#type' => 'textfield', '#title' => t('Label of the taxonomy section'), '#description' => t('Change the label of the taxonomy section'), '#default_value' => variable_get('summary_taxonomy_label','Taxonomy vocabularies'), ); $form['summary_content_types'] = array( '#type' => 'textfield', '#title' => t('Label of the content types section'), '#description' => t('Change the label of the content types section'), '#default_value' => variable_get('summary_content_types','Content types'), );
Ajoutez des lments fieldset pour les cases cocher et un auter pour les labels
/* * Define the adminsitration form */ function summary_admin_settings(){
416
$form['checkbox_visible'] = array( '#type' => 'fieldset', '#title' => t('Section visibility'), '#description' => t('Things to show for the summary'), '#collapsible' => TRUE, '#collapsed' => TRUE, ); $form['checkbox_visible']['summary_display'] = array( '#type' => 'checkboxes', '#title' => t('Things to show for the summary'), '#description' => t('Check the things to show in the summary page'), '#options' => array('module' => t('Module list'), 'vocabulary' => t('Vocabulary list'), 'content_type' => t('Content types')), '#default_value' => variable_get('summary_display',array('module', 'vocabulary')), ); $form['labels'] = array( '#type' => 'fieldset', '#title' => t('Labels of sections'), '#description' => t('Change the labels of the summary'), '#collapsible' => TRUE, '#collapsed' => TRUE, ); $form['labels']['summary_module_label'] = array( '#type' => 'textfield', '#title' => t('Label of the module section'), '#description' => t('Change the label of the module section'), '#default_value' => variable_get('summary_module_label','Activated modules'), ); $form['labels']['summary_taxonomy_label'] = array( '#type' => 'textfield', '#title' => t('Label of the taxonomy section'), '#description' => t('Change the label of the taxonomy section'), '#default_value' => variable_get('summary_taxonomy_label','Taxonomy vocabularies'), ); $form['labels']['summary_content_types'] = array( '#type' => 'textfield', '#title' => t('Label of the content types section'), '#description' => t('Change the label of the content types section'), '#default_value' => variable_get('summary_content_types','Content types'), ); } return system_settings_form($form);
417
2.3
Utilisation des paramtres pour la page Summary
Il faut maintenant rcuprer les paramtres sauvegards dans la table variables par la page de configuration. Les valeurs des cases cocher sont stockes la ligne summary_display de la table variables. La fonction variable_get() permet de rcuprer ces valeurs :
h h
la page de configuration du module Summary, cochez uniquement la section Vocabulary list Bouton Enregistrer la configuration
dpm(variable_get(summary_display,array()));
Le lien Variable editor du bloc Devel affiche les valeurs des lignes de la table variables. summary_display est retourne sous forme de tableau associatif. Si la section nest pas afficher, sa valeur est 0 (false), sinon, sa valeur est le nom de la cl (true). Il suffit donc de tester cette valeur avant dajouter chaque section.
h
Modifiez la fonction summary_content comme cela :

function summary_content() { //List of all activated modules $summary_module_list = module_list(); $summary_module_list = t('<h3>Activated modules</h3>') . implode($summary_ module_list,', '); // List of vocabularies $summary_vocabularies = taxonomy_get_vocabularies(); $summary_vocabularies_list=''; foreach ($summary_vocabularies as $vocab){ $summary_vocabularies_list .= $vocab->name . ','; } $summary_vocabularies_list = t('<h3>Vocabularies</h3>') . $summary_ vocabularies_list;
418
// List of content types $summary_node_types = node_type_get_types(); $summary_node_types_list =''; foreach ($summary_node_types as $node_types){ $summary_node_types_list .= $node_types->name . ','; } $summary_node_types_list = t('<h3>Node type</h3>') . $summary_node_types_ list; $display = variable_get('summary_display',array()); $output = ''; if ($display['module']) { $output .= $summary_module_list; } if ($display['vocabulary']) { $output .= $summary_vocabularies_list; } if ($display['content_type']) { $output .= $summary_node_types_list; } return $output;
2.3.1 Exercice : affichage des labels personnaliss

Modifiez la fonction summary_content pour quelle affiche les labels de la page de configuration du module.
Modification des labels
419
Page Summary avec labels personnaliss
Corrig
Les valeurs des labels sont stockes dans les lignes summary_module_label, summary_taxonomy_label et summary_content_types de la table variables. La fonction variable_get() permet de rcuprer ces valeurs.
dpm(variable_get(summary_taxonomy_label,));
summary_taxonomy_label est donc retourne sous forme de chaine de caractre correspondant la valeur du label. Si rien nest retourn, il faut prciser une valeur par dfaut dans la fonction variable_get. Voici donc la ligne modifie pour la section liste des vocabulaires :
$summary_vocabularies_list = t('<h3>Vocabularies</h3>') . $summary_ vocabularies_list;
Modifie en :
$summary_vocabularies_list = '<h3>' . variable_get('summary_taxonomy_label' ,t('Vocabularies')) . '</h3>' . $summary_vocabularies_list;
Rptez lopration pour les autres sections.
420
2.4 Excuter des requtes SQL dans un module en rcuprer le rsultat

Il existe un grand nombre de fonctions dans lAPI Drupal, et qui interrogent la base de donnes votre place. Mais il est parfois ncessaire de faire ses propres requtes.
2.4.1 Requtes simple retournant une seul ligne

Vous allez commencer par afficher le nombre de nodes publies dans Drupal. La requte SQL est :
SELECT count(*) FROM node WHERE status = 1
Chap. III 4 La Base de donnes de Drupal La requte ne retourne quune seule valeur : le nombre de nodes. Vous allez maintenant modifier le fichier summary.module pour quil affiche une nouvelle section Number of nodes. Modifiez la fin de la fonction summary_content() ainsi :
//Number of nodes $query = 'SELECT count(*) FROM node WHERE status = 1'; $summary_node_count = db_query($query)->fetchField(); $summary_node_count = t('<h3>Number of nodes</h3>') . $summary_node_count; $display = variable_get('summary_display',array()); $output = ''; if ($display['module']) $output .= $summary_module_list ; if ($display['vocabulary']) $output .= $summary_vocabularies_list; if (array_key_exists('content_type',$display) && $display['content_type']) $output .= $summary_node_types_list; $output .= $summary_node_count; return $output;
La nouvelle section de summary
La fonction : db_query prend en paramtre la requte SQL et retourne un objet. Une mthode de cet objet est fetchField qui retourne le rsultat de la requte.
421
Noms de tables
La requte prcdente retourne le rsultat escompt, et pourtant elle pose un problme. Il est en effet possible de prfixer les tables avec une chane de caractre linstallation de Drupal. Ainsi, la table node naura peut-tre pas pour nom node mais drupal_node (si les tables sont prfixes drupal_). Pour que Drupal gre cela il faut entourer le nom des tables par des accolades. La requte devient donc :
$query = 'SELECT count(*) FROM {node} WHERE status = 1';
2.4.2 Requtes avec rsultat sur plusieurs lignes

Pour modifier votre nouveau paragraphe pour quil affiche le nombre de nodes par type, la requte SQL devient :
SELECT type, count(*) AS "Nombre nodes" FROM node GROUP BY type
Dans le module summary, la requte devient donc :

//Number of nodes per type $query = 'SELECT type, count(*) FROM {node} GROUP BY type';
Lobjet retourn par db_query (de type DatabaseStatementBase) permet dexcuter plusieurs mthodes : Retourne le nombre de lignes du rsultat de la requte rowCount
db_query($query)->rowCount()
Retourne une ligne du rsultat de la requte sous forme de tableau (nom colonne valeur). Au prochain appel de la fonction, la ligne suivante est retourne : fecthAssoc
db_query($query)->fetchAssoc()
Retourne l'ensemble des rsultats sous forme de tableau. La cl des lments est la premire colonne de la requte. fetchAllKeyed
db_query($query)->fetchAllKeyed()
422
Retourne l'ensemble des rsultats sous forme de tableau. La colonne devant servir de cl est passe en paramtre.
fetchAllAssoc
db_query($query)->fetchAllAssoc(type)
Retourne la requte SQL de lobjet. getQueryString

dpm(db_query($query)->getQueryString());
Retourne tous les lements d'une colonne. Le numro de la colonne est pass en paramtre.
fetchCol
db_query($query)->fetchCol(0)
Retourne la premire colonne de la premire ligne. fetchField

db_query($query)->fetchField()
Il y a donc plusieurs solutions possibles pour arriver au mme rsultat : Exemple de traitement des rsultats en utilisant la mthode fetchAllAssoc() :
//Number of nodes per type $query = 'SELECT type, count(*) AS count FROM {node} GROUP BY type'; $result = db_query($query)->fetchAllAssoc('type'); $summary_node_count_type = ''; foreach($result as $row) { $summary_node_count_type .= $row->type.' : '.$row->count.'<br/>'; } $summary_node_count = t('<h3>Number of nodes per type</h3>').$summary_node_ count_type ;
423
Exemple de traitement des rsultats en utilisant la mthode fetchAssoc() :

$query = 'SELECT type, count(*) AS count FROM {node} GROUP BY type'; //Avec la mthode fetchAssoc $result = db_query($query); $summary_node_count_type = ''; while ($row = $result->fetchAssoc()) { $summary_node_count_type .= $row['type'].' : '.$row['count'].'<br/>'; } $summary_node_count = t('<h3>Number of nodes per type</h3>').$summary_node_ count_type ;
La section nombre de nodes par type
2.4.3 Requtes avec variables

Vous aurez parfois besoin de positionner des variables dans vos requtes. Voici par exemple une requte qui slectionne le titre des nodes publies de type article :
$query = 'SELECT title FROM {node} WHERE type="article" AND status=1'; $result = db_query($query);
Imaginez maintenant que vous ayez deux variables $type et $status contenant respectivement le type et le statut des nodes afficher, la requte devient alors :
$query = 'SELECT title FROM {node} WHERE type = :type AND status = :status'; $result = db_query($query, array( ':type' => $type, ':status' => $status));
Il faut donc utiliser des jokers (:type, :status), leurs valeurs sont ensuite remplaces lors de lexcution de la fonction db_query. Celle-ci prend un tableau en deuxime argument qui contient la liste des valeurs et des jokers.
424
2.4.4 Requtes avec le constructeur de requtes

La requte prcdente est une requte simple mais le systme des jokers peut vite devenir confus si votre requte comporte un grand nombre de paramtres. Drupal propose alors tout un systme de construction de requtes via PHP. Voici par exemple ce que deviendrait la requte prcdente :
$query = db_select(node, n); $query ->fields('n', array('title')) ->condition('type', $type) ->condition('status', $status); $result = $query->execute();
Lide est donc de commencer par crer un objet de type SelectQuery en appelant la fonction db_select et ensuite de le modifier en lui ajoutant des directives SQL. Lorsque celle-ci est construite, il faut lancer la mthode execute() pour rcuprer le rsultat de la requte. La fonction db_select prend en premier argument le nom de la table utiliser (node) et en deuxime argument un alias (n). Cest cet alias qui sera utilis dans les autres directives SQL (fields('n', array('title')). Cette mthode permet de construire une requte tout au long dun script PHP sans avoir manipuler de longues chanes de caractres pour former une requte SQL valide. SelectQuery possde quelques dizaines de mthodes correspondant des directives SQL. Vous pouvez retrouver la liste des ces mthodes sur la page SelectQuery du site http://api.drupal.org.
Extrait de la page de documentation de SelectQuery
Vous pouvez utiliser les mthodes DeleteQuery, InsertQuery et UpdateQuery pour des requtes SQL delete, insert et update.
2.5
Theming du contenu
Dans le module Summary, vous avez insr quelques balises HTML directement dans le code PHP (balise H3 pour les titres). Dans cette section, vous permettrez aux crateurs de thmes de modifier lapparence du contenu de votre module.
425
Pour bien comprendre cette section, lisez le chap. V. Les thmes Drupal dans son ensemble.
2.5.1 Affichage du nombre de nodes sous forme de tableau

Il serait plus lisible dafficher le nombre de nodes par type de contenu sous forme de tableau :
Affichage dun tableau avec Bartik
Pour cela, il faut utiliser la fonction de theme Drupal theme_table. Vous pouvez rechercher comment elle sutilise sur api.drupal.org.
Les fonctions de thme sur api.drupal.org
Vous pouvez retrouver la liste des fonctions de thme la page http://api.drupal.org/api/group/themeable/7. Lorsquelles sont utilises lintrieur de Drupal, il faut appeler les fonctions de thme par la fonction theme() de cette faon : theme_table($variables) devient theme(table, $variables) ; theme_date($variables) devient theme(date, $variables) ; etc. La fonction theme_table prend en paramtre un tableau qui contient lui-mme deux tableaux. Le premier doit contenir les en-ttes (header), le second les lignes (rows).
426
Voici comment implmenter cette fonction pour le nombre de nodes par type :
$result = db_query($query); $header = array (t('Node type'), '#'); while ($row = $result->fetchAssoc()) { $rows[] = $row; } $table = theme('table', array ('header' => $header, 'rows' => $rows)); $summary_node_count_type = t('<h3>Number of nodes per type</h3>').$table;
Contenu des deux tableaux $header et $rows passs en paramtre
2.5.2 Implmentation de hook_theme

Vous allez maintenant crer votre propre fonction de thme que dautres dveloppeurs et crateurs de thmes pourront utiliser. Cette fonction permettra de prsenter un paragraphe du module summary :
427
La fonction de thme theme_summary_paragraph()
Pour cela, votre module doit implmenter la hook hook_theme() qui prend en paramtre la liste des fonctions de thme du module. Il faut prciser les paramtres quaura chaque fonction. Ici, vous avez besoin du titre de la section et de son contenu.
/** * Implementation of hook_theme */ function summary_theme () { $functions = array( 'summary_paragraph' => array ( 'variables' => array('title' => NULL, 'content' => NULL) ) ); return $functions; }
428
Vous pouvez consulter la liste de fonctions de thme disponible sur votre installation en utilisant le lien Theme registry du bloc Devel.
h h
Videz les caches Lien Theme registry du bloc devel (devel/theme/registry)
La fonction de thme de summary est enregistre
2.5.3 Cration dune fonction par dfaut pour le module

Il faut maintenant fournir une fonction par dfaut dans le module au cas o le thme actif ne surcharge pas la fonction de thme. Cette fonction affiche uniquement le titre dans une balise <h4> et le contenu dans une balise <p>
/** * Fonction de thme par dfaut */ function theme_summary_paragraph($variables) { $output = '<h4>'.$variable['title'].'</h4>'; $output .= '<p>'.$variable['content'].'</p>'; return $output; }
2.5.4 Appel de la fonction de thme dans le module

Vous utiliserez votre fonction dans le module pour prsenter vos paragraphes. Il suffit de passer en paramtre les deux chanes composants le titre et le contenu dans un tableau associatif :
$title = variable_get('summary_content_types',t('Content types')); $content = implode($summary_node_types_list, ', '); $summary_node_types_list = theme('summary_paragraph', array('title' $title, 'content' => $content)); =>
Le titre de content type est maintenant en <h4>

h
Modifiez le module pour quil utilise la fonction pour chacun des paragraphes.
429
2.5.5 Cration dun template par dfaut

Pour un crateur de thme, il est plus facile dutiliser un template de type .tpl.php. Et cela nest pas beaucoup plus compliqu fournir quune fonction de thme : Tout dabord, il faut prciser un nom de template dans la fonction hook_theme :
/** * Implementation of hook_theme */ function summary_theme () { $functions = array( 'summary_paragraph' => array ( 'variables' => array('title' => NULL, 'content' => NULL), 'template' => 'summary_paragraph', ) ); return $functions; }
Drupal ajoute automatiquement le suffixe .tpl.php au nom du template. Il reste crer le template par dfaut summary_paragraph.tpl.php dans le rpertoire du module summary :
<?php /** * @file * Default theme implementation for each paragraph in the summary module. * * Available variables: * $title: Title of the paragraph. * $content: Content of the paragraph */ ?> <li class="summary_item"> <h3><?php print $title ?></h3> <div class="summary_content"><?php print $content ?></div> </li>
h h
Videz les caches Rechargez votre page
Summary utilise maintenant un template !
430
Pour des raisons de performances, vitez de fournir un template lorsque celui-ci sera appel de nombreuses fois sur une page. Le but de cette section tait de vous ouvrir les portes de la programmation avec Drupal. Si vous dsirez aller plus loin, je vous conseille de parcourir le site http://api.drupal.org ou de lire le livre Pro Drupal Developement (http://www.drupalbook.com/).
3
3.1
h
Les outils pour mieux dvelopper avec Drupal

Devel : simplifiez votre vie de dveloppeur
Le module Devel est une boite outils pour aider le dveloppeur de modules Drupal. Installez et activez le module Devel (version utilise dans ce livre : 7.x-1.0)
3.1.1 Le bloc Dveloppement

h h
Activez le bloc Dveloppement en barre de gauche de Bartik. Allez sur la page daccueil de votre site.
Saffiche alors un bloc contenant un menu permettant daccder aux fonctionnalits de Devel : Devel settings Empty cache Execute PHP Code Field info Function reference Hook_elements() Accder la page de configuration de Devel. Permet de vider l'ensemble des caches de Drupal. Ouvre une page contenant une zone de texte permettant d'xecuter du code PHP. Affiche les informations de chaque champ pouvant tre attach un contenu. Affiche la liste de toutes les fonctions utilises sur le site. Si celles-ci sont dans l'API Drupal 7, un lien vers leur documentation est propose. Liste des lments pouvant tre inclus dans un formulaire.
Lancer le traitement rgulier Lance le cron. Menu item PHPinfo() Rebuild menus Reinstall modules Session viewer Theme registry Variable editor Dtaille les paramtres d'un menu (hook_menu). Par exemple : devel/menu/item&path=admin/config/ system/site-information, dtaillera le menu admin/config/system/site-information. Affiche des informations dtaills sur votre configuration PHP. Reconfigure l'ensemble des menus. Tous les menus reprennent leur configuration par dfaut. Dsinstalle et rinstalle tous les modules du site. Affiche des informations sur la session en cours. Affiche la liste de toutes les fonctions de thme du site. Affiche la liste de toutes les variables de $conf. Il est galement possible de les diter partir de cette interface.
3 - Les outils pour mieux dvelopper avec Drupal
431
Lditeur de variables
Dtails dun menu
3.1.2 Le bloc Execute PHP

h
Activez le bloc Execute PHP en pied de page de Bartik et de Seven.
Il est ensuite possible dexcuter du code php partir de cette zone de texte.
Test dutilisation de la fonction system_region_list()
Rsultat de la fonction
432
3.1.3 Les fonctions de dbuggage

Plusieurs fonctions de dbuggage sont livres avec Devel. Vous pouvez les insrer nimporte o dans votre code (y compris dans linterface Drupal). Saffiche avec Krumo dpm() dvm() kpr() dpr() X X X X Saffiche en haut de page Saffiche en zone de notification X X
3.1.4 Le gnrateur de contenu

Ce module permet de crer nimporte quel type de contenu pour tester votre site, il permet galement de crer des commentaires, des utilisateurs, des vocabulaires et des termes de taxonomy.
h h
Activez le module Devel generate Menu Configuration lien Dveloppement Cliquez sur Generate content.
Vous avez alors accs diffrents menus permettant de crer du contenu, des utilisateurs et de la taxonomy.
h
Le gnrateur de contenu
433
Vous pouvez alors rgler les diffrents paramtres avant de gnrer le contenu en cliquant sur Do it !
3.1.5 Le Profiler SQL

Devel permet de connatre la liste des requtes qui ont t excutes pour laffichage dune page.
h h h
Menu Configuration lien Dveloppement Cochez la case Afficher la liste des requtes Cliquez sur Enregistrer
3.2
Le module Coder
Le module Coder inspecte le code des modules et indique s'ils ne respectent pas les conventions de codages de drupal (http://drupal.org/node/318).
h h h
Installez le module (version utilise dans ce livre : 7.x-1.0-beta6) http://drupal.org/project/coder Activez les modules Coder et Coder Review Menu Modules
Coder ajoute un lien Code Review pour chaque module

h h
Cliquez sur le lien Code Review de votre module. Constatez le nombre derreurs corriger !
Un module bien peu respectueux des conventions !
434
3.3
Drupal for Firebug
Ce module permet de dbugger certaines parties de vos modules partir de Firebug, module de Firefox.
Installation
Pour que ce module fonctionne, il faut activer le module Drupal et le module Firefox.
h
Installez le module Drupal For Firebug(version utilise dans ce livre : 7.x-1.2) http://drupal.org/project/ drupalforfirebug Activez les modules Drupal for Firebug Preprocessor et Drupal for Firebug Tlchargez et activez le module Drupal For Firebug de Firefox (version utilise dans ce livre : 0.0.7) https://addons.mozilla.org/en-US/firefox/addon/drupal-for-firebug/ Lors de la rdaction de ce livre, le plugin pour firefox ne fonctionnait pas. Cest pourquoi les copies dcran ont t prises avec Google chrome avec lextension Drupal for Chrome.
h h
Utilisation
Chargez une page de Drupal, lancez Firebug, un nouvel onglet Drupal apparat, il est alors possible davoir des informations sur cette page :
Dtail des composants dun formulaire
435
Plusieurs sous-onglets sont alors disponibles : Informations Forms Sql User Node View Php Vous pouvez utiliser la fonction firep() pour afficher des informations dans cet onglet Affiche les paramtres des composants des formulaires de la page Affiche les requtes SQL excutes pour la page si loption du Profiler SQL est activ (chap VI -3.1.5 Le Profiler SQL) Affiche les informations lies lutilisateur Affiche les informations lies aux nodes charges sur la page (y compris celles des vues) Affiche les informations lies aux vues charges sur la page Fonctionne de la mme faon que le bloc Execute Php du module Devel (chap VI - 3.1.2 Le bloc Execute PHP)
3.4
Dbugger avec Eclipse
Lorsque vous dvelopperez des modules complexes, pouvoir dbugger avec une interface graphique peut vous faire gagner du temps : pouvoir mettre des points darrt, excuter le programme pas pas et voir directement lvolution des valeurs des variables peut aider mieux comprendre ses erreurs. Dans cette section, vous installerez le dbuggueur Xdebug sur votre serveur, et vous l'utiliserez avec Eclipse.
3.4.1 Installation de Xdebug sur WampServer

Xdebug est install par dfaut sur Wampserver, mais il nest pas configur en mode remote (debuggage distance) : Pour vrifier linstallation de XDebug sur votre serveur :
h h
Menu Rapports lien Tableau de bord dadministration Lien plus dinformations de la ligne PHP
Xdebug est activ !
Pour modifier la configuration de Xdebug :

h
Editez votre fichier php.ini (icne Wampserver PHP php.ini).
436
Modifiez ainsi les lignes de la section ; XDEBUG Extension du fichier :

[xdebug] xdebug.remote_enable=on xdebug.remote_host="127.0.0.1" xdebug.remote_port=9000 xdebug.remote_handler="dbgp" xdebug.remote_mode=req
Enregistrez le fichier et redmarrez WampServer.
3.4.2 Installation de Xdebug sur Ubuntu

Commencez par installer le paquet Xdebug
sudo apt-get install php5-xdebug
Puis ditez le fichier de configuration de Xdebug :

sudo gedit /etc/php5/conf.d/xdebug.ini
Ajoutez au fichier les lignes suivantes :

xdebug.remote_enable=on xdebug.remote_host="127.0.0.1" xdebug.remote_port=9000 xdebug.remote_handler="dbgp" xdebug.remote_mode=req
Sauvegardez le fichier et redmarrez Apache :

Vous pouvez vrifier si Xdebug sest bien install :

h h
Menu Rapports lien Tableau de bord dadministration Lien plus dinformations de la ligne PHP
Xdebug est bien install
3.4.3 Module easy Xdebug pour Firefox

Il existe un module pour Firefox qui permet de simplifier le dmarrage dune session xdebug.
h
Dans le menu Modules complmentaires de Firefox, recherchez lextension easy xdebug (version utilise pour ce livre easy Xdebug 1.5) Installer le module Redmarrez Firefox
h h
Deux icnes saffichent en bas droite de Firefox, lune pour dmarrer une session de dbuggage, lautre pour la stopper.
437
Les icnes de easy xdebug
Vous pouvez afficher ou cacher la Barre des modules de Firefox grce au menu Options Barre des modules.
3.4.4 Configuration dEclipse pour xdebug

Il sagit maintenant dindiquer Eclipse que vous utiliserez Xdebug pour dbugger votre projet Drupal :
h h h
Menu Window Preferences Slectionnez litem PHP Debug la ligne PHP Debugger choisissez XDebug
Configuration du debugger
h h h h
Cliquez sur le lien configure... de XDebug Slectionnez XDebug dans la liste Installed Debuggers Bouton Configure Dans la liste Accept remote session (JIT), choisissez any Vous pouvez galement dcocher la case Show super globals in variable views qui vous permettra de limiter le nombre de variables affiches lors du dbuggage.
h h
Bouton OK Bouton OK
438
3.4.5 Utiliser xdebug

Vous allez maintenant dbugger votre fonction summary_content(). Elle est utilise lors de laffichage de la page /summary.
h h
Ouvrez le fichier sites/all/modules/summary/summary.module Dans la marge de la premire ligne de la fonction, faites un clic droit et choisissez Toggle Breakpoints
Ajout dun point darrt dans le script
Un point bleu signifiant le point darrt devrait apparatre dans la marge. Lorsque le programme atteindra cette ligne, il arrtera de sexcuter et vous informera sur son tat. Vous pouvez galement positionner vos points darrts dans le fichiers template de vos thmes et modules.
h h h
Dans Firefox, pointez vers lURL /summary Dmarrez la session xdebug grce licne Start Xdebug Session de easy Xdebug. Rechargez la page (F5)
Eclipse demande alors le type de perspective quil doit utiliser pour la session de dbuggage
Eclipse a dtect une session de dbuggage

h
Bouton Yes
439
Une perspective sous Eclipse est un mode de prsentation des diffrentes fentres. Vous pouvez passer de lune lautre en cliquant sur les boutons droite de la barre doutils.
Les perspectives de Eclipse
Eclipse sarrte alors la premire ligne du index.php de Drupal. Utilisez la barre de boutons de la vue Debug dEclipse pour naviguer dans le programme.
Boutons de navigation dans le script

h
Bouton Resume (F8)
Le script se droule alors jusquau prochain point darrt qui est celui que vous avez ajout dans la fonction summary_content().
h h
Continuez drouler le script pas pas (Bouton Step Over (F6)) Remarquez lvolution des variables dans la vue Variables
Inspection du fonctionnement du module summary
Si Eclipse ne sarrte pas sur votre point darrt, il se peut que votre code ne soit pas excut par Drupal car le code HTML gnr est en cache. Cela est frquent pour le contenu des blocs. Videz alors le cache et rechargez la page.
440
Bonne route !
J'espre que c'est avec plaisir que vous avez dcouvert les possibilits de Drupal. Ce livre ne se prtend pas exhaustif car le sujet est trs vaste. J'ai essay de vous donner les cls pour ouvrir le maximum de portes pour explorer le vaste monde de Drupal. Maintenant, vous de dcouvrir LA fonctionnalit que vous recherchez ! bientt au dtour d'un forum !
441
442
443
Index
Symboles
$databases 152
A
Administration menu 248 Advanced Forum 288 Apache 146 api.drupal.org 399 Article 27
B
Backup and Migrate 162 Blocs 38, 67, 298 Crer un bloc 72 Crer un bloc avec Views 217 Liste des blocs 70 Options 70 Blog 285 BMI 48 Boutique 304 Boutons radio 136
Commentaires 31 Commerce 304 Configuration 56 Contact 289 Content Translation 244 Contenu Cration automatique 432 Cration Type de contenu 117 Crer un compte 79 Cron 178 CSS Ajout fichier 358 Modification 338 CTools 195
D
Dashboard 247 db_query() 420 db_select() 424 Dbuggage Eclipse 435 Fonctions 432 Devel 430 Display suite 274 dpm() 432 Droits d'accs 40, 82 Formats de texte 97 Drupal for Firebug 434 drupal.org api.drupal.org 399 localize.drupal.org 237 Recherche de module 58
C
Cache 173 Captcha 57 Cases cocher 136 Champ 107 Ajout l'utilisateur 135 Cases cocher 136 Fivestar 296 Image 126 Liste 143 Mail 127 Numrique 119 Terme de taxonomie 138 Texte 121 Zone de texte 124 CKEditor 263 Coder 433 Color 331
E
Eclipse Configuration 390 Dbugger 435 e-commerce 304 e-mail 156 Email Field 127
444
Execute PHP 431
F
Features 168 field.tpl.php 376 Field UI 106 Filter 92 Filtre 95 Firebug 340 Drupal for firebug 434 Fivestar 296 Fonctions de thme 379 Cration 426 Utilisation 425 Form API 411 Format d'entre 92 Format de texte 92 Wysiwyg 102 Forum 286 franais 14
info Modules 396 Thme 336, 357 Installation 12 Linux 19 WampServer 12 Internationalisation 229 t() 402
J
Javascript Ajout fichier au thme 360
K
kpr() 432
L
Langues 229 Liste de champs 143 Locale 230 Localization client 241 Logo 330
G
Gabarits 342 Grer laffichage 108 Grer les champs 107 Google Analytics 254
M
Mail 156 Marinelli 332 memory_limit 150 Menu Block 299 Menus 34, 73 Afficher un menu 76 Crer un menu 74 Liste des menus 73 Menu droulant 298, 334 Mise jour Drupal 176 Modules et thmes 174 Modifier 33 Module Administration menu 248 Advanced Forum 288 Backup and Migrate 162 Block 67 Blog 285 BMI 48
H
Hbergeur 155 Help 66 hide() 375 hook_block_info() 400 hook_block_view() 400 hook_help() 403 hook_menu() 406 hooks 398 hook_theme() 427 Htes virtuels 148 html.tpl.php 357, 381
I
Icne 331 Image 272 IMCE 265
445
Captcha 57 CKEditor 263 Coder 433 Color 331 Commerce 304 Contact 289 Content Translation 244 CTools 195 Dashboard 247 Dsinstallation 63 Devel 430 Display suite 274 Drupal for Firebug 434 Email Field 127 Features 168 Field UI 106 Filter 92 Fivestar 296 Forum 286 Google Analytics 254 Help 66 Image 272 IMCE 265 Installation 42, 60 Locale 230 Localization client 241 Menu 73 Menu Block 299 Module filter 252 Nice Menus 302 openWYSIWYG 101 Overlay 66 Path 85 Pathauto 268 PHP filter 94 Poll 42 Product 305 Rules 255 Search 270 Shortcuts 249 Taxonomy 129 Taxonomy menu 298 Theme developer 344 Token 252 Toolbar 55
Update Status 174 User 78 Video filter 98 Views 193 Weather 44 Webform 290 Wysiwyg 101 Module filter 252 MySQL 15, 24, 178 Configuration 151 Requte dans un module 420 Sauvegarde 162 Tables 178 Version mini 156
N
Nice Menus 302 Nodes Options 89, 118 node.tpl.php 368, 384
O
Overlay 66
P
page.tpl.php 360, 382 Paiement 310 Panier 308, 325 Path 85 Pathauto 268 Performances 173 PHP 150 Version mini 156 PHP filter 94 Poll 42 PostgreSQL 156 post_max_size 150 Preprocess 378 Product 305, 319
R
Rgions 39 Cration dans un thme 361 render() 375
446
Rsum 30 Rvisions 89 Rles utilisateurs 80 Rules 255
Type de contenu Cration 106 Options 90 Pages et articles 88
S
Sauvegarde 158 Views 172 Search 270 SelectQuery 424 Serveur Web Version mini 156 settings.php 151 Shortcuts 249 show() 376 Site multilingue 229 Sondage 42 SQL Profiler 433 Requte dans un module 420 system_settings_form() 412
U
Update Status 174 upload_max_size 150 url 85 URLs Simplifies 146 Utilisateurs 78
V
variable_get() 413 Video 98 Video filter 98 Views 193 Affichages 215 Cration d'un bloc 217 Critres de filtrage 206 Critres de tri 206 Display Suite 282 Droits daccs 229 Filtre contextuel 222 Formulaires expos 211 Relations 209 Slection des champs 203 Theming 384 VirtualHost 148 Vocabulaire 129
T
t() 402 Tableau de bord 64 Tags 116 Taxonomy 129 Cration d'un vocabulaire 131 Taxonomy menu 298 template.php 377 Templates 337 Modification 342 Thme Fonctions 379 Theme developer 344 Thmes 329 Configurer 329 Danland 51 Installation 49, 51 Marinelli 332 Orange 335 Templates 337 Token 252 Toolbar 55 Traduction dun module 239
W
Weather 44 Webform 290 Widgets 116 Wysiwyg 101 CKEditor 263
X
Xdebug 435
447

Cyprien Roudet Framabook Atelier Drupal 7 CC-By

Uploaded by

Document Information

Copyright

Available Formats

Share this document

Share or Embed Document

Sharing Options

Did you find this document useful?

Is this content inappropriate?

Copyright:

Available Formats

Cyprien Roudet Framabook Atelier Drupal 7 CC-By

Uploaded by

Copyright:

Available Formats

Atelier

Crer un site internet avec un CMS pas comme les autres

la dcouverte de Drupal . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .27

Organisation du site . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .67

Ajout de contenu . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .88

Field UI : types de contenus personnaliss . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .106

Sauvegarde / Restauration . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .158

Outils dadministration . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .173

La base de donnes de Drupal . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .178

Site multilingue . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .229

Administrer Drupal . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .247

Site coopratif . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .285

Blocs, menus . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .298

Commerce : crez une boutique . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .304

Structure et modification dun thme . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .335

Crer un thme partir dun design HTML/CSS . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .355

Theming du contenu . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .366

Les variables disponibles dans les templates . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .381

Le theming des vues . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .384

Chapitre VI - Introduction la cration de modules . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 389 1 Environnement de dveloppement . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .389

Votre premier module Drupal . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .404

Les outils pour mieux dvelopper avec Drupal . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .430

Notes propos de ce livre :

Conventions utilises dans ce livre

Versions alpha, beta et stables :

Copies d'crans et traductions en franais

Avantages - Assez facile installer

Wamp + Drupal depuis les sources

LAMP + Drupal depuis les sources

Windows + virtuali- Windows + sation de Linux Linux

Linux + virtualisation Windows

Bonne solution pour les utilisateurs dsirant passer Linux en douceur

1.1.1 Installation de WampServer

Tlchargement et accs linstallateur de Drupal

Page de tlchargement de drupal.org

Drupal est prt tre install !

1.2.1 Installation de la langue franaise

Tlchargement de la langue franaise

Drupal est prt tre install... en francais !

1.2.2 Installation de la base de donnes

Les raccourcis de WampServer

Cration de la base de donnes MySQL pour Drupal grce phpMyAdmin

Installation de la base de donnes par linstallateur Drupal

1.2.3 Configuration du site

Compltez les champs de la manire suivante :

Paramtres du site et de son administrateur

Linstallation de Drupal sous Windows est termine !

Installation rapide sous Linux

1.3.1 Installation dune solution LAMP

Votre solution LAMP est installe, phpMyAdmin fonctionne

1.3.2 Tlchargement et accs linstallateur de Drupal

Page daccueil de drupal.org

Drupal est prt tre install

1.3.3 Installation de la langue franaise

Tlchargement de la langue franaise

Drupal est prt tre install... en francais !

1.3.4 Vrification des pr-requis

Drupal demande des droits en criture

Cliquez sur le lien poursuivez linstallation pour faire disparatre le message

1.3.5 Installation de la base de donnes

Vous devriez alors voir apparatre la page de connexion de phpMyAdmin :

Cration de la base de donnes MySQL pour Drupal grce phpMyAdmin

Installation de la base de donnes par linstallateur Drupal

la fin de linstallation un message saffiche en haut de la page :