jQuery est une bibliothèque javascript permettant d'intégrer des effets graphiques facilement. Elle est librement téléchargeable et intégrable. Simple d'utilisation, je cherchais un livre me permettant d'aller plus loin que les tutoriels que l'on peut trouver.

C'est pour cela que j'ai acheté ce livre. J'avoue avoir été deçu (par les deux). En fait, les tutoriels sont nettement plus complet et les auteurs tournent en rond souvent. Finalement, je n'ai rien approfondi du tout. A part les quelques bout de code intégrables sans réfléchir (de toute façon, ils sont très peu décortiqués), ce livre n'a pas d'intéret.

Environ 400 pages en Anglais.

jQuery est une bibliothèque javascript permettant d'intégrer des effets graphiques facilement. Elle est librement téléchargeable et intégrable. Simple d'utilisation, je cherchais un livre me permettant d'aller plus loin que les tutoriels que l'on peut trouver.

C'est pour cela que j'ai acheté ce livre (package avec jQuery UI 1.6). Contrairement a ce dernier, ce sont les aspects plus fonctionnels qui sont abordées. Les développeurs y trouveront une bonne introduction... mais malheureusement pas beaucoup plus.

Environs 400 pages en Anglais.

Le theming drupal n’est pas facile à comprendre quand l’on commence à s’y intéresser. En effet, certains conseillent de partir de rien et de construire son thème « from scratch » d’autres conseillent de partir d’un thème existant… mais ceux-ci sont souvent complexes pour une première approche.

Personnellement, je pense que partir d’un thème existant est la meilleure solution, sous certaines conditions. Il s’agit de partir d’un thème simple, de l’adapter à notre besoin et de ainsi comprendre de nouveaux mécanismes (que l’on n’aura pas forcément saisis dès le départ) et ainsi progresser pour appréhender des thèmes plus complexes.

 
Quel kit de départ choisir ?

Pour commencer, il faut se rappeler des bases !

En suite, il s’agit simplement de prendre un thème simple pour le modifier. Dans mon cas, j’aime utiliser le kit de départ « Basic » , en le modifiant un peu. Je ne garde que les fichiers « .tpl.php » et le dossier « css ». Je supprime les autres fichiers, renomme le fichier basic.info en fonction du nom de mon nouveau thème… et j’adapte son contenu à mes besoins. Par exemple je n’utilise pas les « features » car je considère que cela est bien pour des thèmes génériques mais pas pour un thème custom… Finalement, je garde le fichier « template.php » au départ, mais je le vide complètement.

En bref, déjà que ce kit de départ est simpliste, mais moi, je le nettoie encore de son code, selon moi superflu.

Certains conseillent d'utiliser le starter kit "Zen"... personnellement, je ne le conseil pas car il est complexe. En effet, les thèmes de départ, sensés être simples dépendent fortement du thème principal (dont en fait ils sont des "sous-theme"). Ainsi, le thème Zen est sympa, mais pas simple a exploiter. Si vous l'utilisez, vous constaterez que le thème drupal de ce blog ressemble a l'un des sous thème Zen... sauf qu'il est en fait construit avec une copie personnalisé par mes soins du thème "basic". 

La structure des css

Le système d’organisation de drupal permet de remplacer les fichiers par ceux que l’on souhaite… en fait, par défault, drupal va utiliser ses fichier de gabarit a lui dans le cas ou le thème choisi n’en possède pas. Ainsi, on remplace en quelque sorte les gabarits du système par les nôtres en utilisant un thème spécifique. Ces remplacements concernent les fichiers « .tpl.php ». 

Bien évidemment, nos gabarits utilisent nos feuilles de style (css) qui sont elle même contenu dans le répertoire du thème.

La structure des fichiers CSS est elle aussi un peu spéciale, mais terriblement logique et efficace. Cette structure permet de savoir tout de suite quel fichier est à modifier pour obtenir un style précis sur un élément du code html.

Dans le cas de notre thème de base, nous avons :

• css/default.css : contient les propriétés concernant la structure de la page (wireframe), c’est a dire les mises en formes génériques concernant les différents blocks html. Il est le cadre le plus haut et concerne les éléments tel que le header, le wrapper (content) et le footer.
• css/layout.css vient juste en dessous de default.css et affine les mises en forme en gérant les principaux blocks que sont les « sidebars », les régions, etc. Cependant, ce fichier contient surtout des propriété de positionnement des éléments les uns par rapports aux autres. Ce fichier contient des propriétés portant sur les id et classes laissés sur les balises html (#content, .sidebar, etc).
• css/style.css concerne quant à lui les balises html. On retrouvera ainsi les mises en forme de liens, etc…

Ces trois fichiers permettent de tout mettre en forme. En effet, on part de default.css pour une organisation générale du rendu. On passe en suite a layout.css pour mettre en forme les blocks de la page tel que les dimension et positionnement des « sidebars », pour finalement finir par les balises html. On constate que tout reste général. Cela permet de garder une cohérence sur tout le site. Cependant, dans le cas d’un besoin précis de mettre en forme un élément en particulier, je vous invite a le faire dans un nouveau fichier css que vous indexerez dans le fichier montheme.info pour qu’il soit pris en considération par « montheme ».

Outils conseillés

Pour ces manipulations, vous n’aurez pas besoins de logiciels spécifiques. Un « block note » avec une coloration syntaxique suffit (Notepad++, SciTE, Smultron, etc). La coloration n’est pas obligatoire, mais est plus confortable ! Pour vous aider dans le choix des éléments a mettre en forme et déterminer quelle propriété intervient sur l’élément concerné, je vous conseil d’installer le plugin pour firefox nommé firebug.  

Créer un thème n’est pas très complexe, mais il faut savoir comment ils fonctionnent pour arriver à un résultat propre. Vous constaterez que je n’ai pas parlé de modification concernant le fichier template.php. En fait, j’utilise ce fichier essentiellement pour la suggestion de Template. Ce sujet sera abordé lors d’un prochain billet. 

Les thèmes s’appuient sur un moteur de Template. Par défaut et dans 99% des cas, ce moteur de Template est PHPTemplate.

.info

Le fichier « .info » est obligatoire car c’est lui qui contient les paramètres de configurations :

• Métadonnées,
• Emplacement des fichiers CSS dédiés au thème (généralement, on a un layout.cssqui concerne les « boites » et un style.css qui concerne plus globalement toutesles balises), 
• Emplacement des fichiers JS dédiés au thème (différents de ceux des modules), 
• Les noms des régions, ‐ Les « Features » (Ce sont les éléments personnalisables dans l’interfaced’administration de drupal tel que l’affichage du logo, du slogan du site, etc...) 
• Etc...

La version du thème est à négliger, voir oublier. Les informations concernant le drupal core et le moteur de Template utilisé sont obligatoires. Pour que le drupal core soit égal à la version utilisée, on ne tapera pas « 6.14 » par Exemple mais « VERSION ».

.tpl.php

Les fichiers d’extension « .tpl.php » sont les gabarits xhtml utilisés par le thème. Ils ne sont pas obligatoires et s’ils sont présents, ils viennent en remplacement de ceux du cœur de Drupal ou des différents modules. Le code PHP qu’ils contiennent doit se réduire que a la fonction « print ». Par défaut, on constate que certains thèmes comme Garland, zen ou d’autres contiennent également des conditions (if). Idéalement, ces conditions ne devraient pas apparaitre, sauf que dans le cas de ces thèmes, cela leur permet une plus grande généricité. Pour un thème fait « sur mesure », ces conditions sont inappropriées. Il en va de même pour les features du « .info » qui deviennent alors inutiles !

Tout autre élément « logique » écrit en PHP ET lié au thème sera à inclure dans un autre fichier (template.php par exemple).
Il y a cinq gabarits principaux :

• page.tpl.php, modèle principal des pages. 
• node.tpl.php, modèle de construction des nœuds (node), 
• block.tpl.php, modèle de construction des blocks, 
• comment.tpl.php, modèle de construction des éléments liés aux commentaires, 
• box.tpl.php, est cité comme étant le modèle de construction des boites, sauf quecelles-ci ne sont plus utilisées dans la construction des pages Drupal (depuis la version 6.x incluse !).

Il est possible d’utiliser d’autres fichiers de gabarit. Pour cela, on peut utiliser des noms de fichier réservés (tel que page‐front.tpl.php pour le gabarit de la page d’accueil) ou en spécifiant le fichier a utiliser dans le fichier template.php. 

La version complète en VO est ici !