alainericgauthier.com

construire une présence sur le web

Le menu Apparence dans Drupal 7

Élément d'interface d'un thème Drupal, un cercle avec les couleurs Drupal

Séparer le contenu de la présentation

Si vous êtes un peu familier avec la création de pages web, vous savez qu'une bonne pratique consiste à séparer le contenu et la présentation. Drupal et tous les CMS que je connais en font de même.

Dans Drupal, la séparation du contenu et de la présentation, ça veut donc dire que vous modifiez le contenu (ce que votre site web contient) à un endroit et que vous mettez à jour la présentation de votre site web (de quoi il a l'air) ailleurs. Modifier la présentation de votre site web ne modifie pas le contenu. Dans Drupal, vous faites les changements à la présentation dans le menu Apparence.

Les thèmes du noyau de Drupal

Drupal vient avec quatre thèmes. Deux de ces thèmes sont utilisables pour un site web public. Il s'agit de Bartik et Garland. Drupal offre aussi un autre thème nommé Stark, mais celui-ci n'est pas vraiment utilisable pour un site public, il s'agit d'un thème qui permet de voir le contenu avec un strict minimum de présentation. Ce thème peut vous être utile si vous voulez comprendre comment fonctionnent les thèmes dans Drupal mais aussi si vous voulez voir comment s'affiche le code HTML généré par Drupal.

Finalement, Drupal offre un autre thème qui a une application particulière : Seven. Ce thème sert à l'administration du site. En effet, lorsque vous voyez un site Drupal de l'extérieur, vous n'avez qu'un nombre limité de menus ou de pages superposées (ce qu'on appelle l'overlay).

Pour simplifier la création des thèmes, la partie administration n'est pas prise en charge par Bartik ou Garland ou encore la grande majorité des thèmes distribués sur le site de Drupal. Les concepteurs de Drupal ont donc créé un thème qui assure la présentation de l'interface d'administration. La très grande majorité des sites utilisent ce thème pour l'administration et cela a deux avantages :

  1. Cela réduit le temps nécessaire à la création d'un thème.
  2. Cela offre une interface identique pour les administrateurs de plusieurs site.

Les thèmes sont contrôlés par le menu apparence.

Pour Drupal, un thème, c'est un ensemble de fichier qui contrôle comment le contenu sera affiché sur le site. Mais si la seule chose que vous pouviez faire c'est d'installer un thème, vous n'auriez pas beaucoup de flexibilité et vous seriez sûrement contraint de créer votre propre thème : une tâche qui demande beaucoup de temps et d'efforts même pour un programmeur très habitué.

Pour cette raisons, les thèmes offrent des options qui peuvent être modifiées par l'administrateur du site et c'est ce qui donne la possibilité à plusieurs site d'utiliser le même thème mais d'avoir des apparences complètement différentes.

Un survol des commandes disponibles

Pour administrer les thèmes, vous allez à /admin/appearance. Dans cette page, vous verrez trois onglets.

  1. L'onglet "Lister" affiche tous les thèmes et un lien vers les paramètres propres à ce thème. Pour chaque thème vous avez la possibilité de l'activer, le désactiver ou encore l'activer par défaut (ce qui le rend visible aux visiteur du site web).
  2. L'onglet "Mettre à jour" permet de voir s'il y a des mises à jours soit pour les thèmes, soit pour les modules (la même page est disponible dans le menu Modules).
  3. L'onglet "Paramètres" permet de contrôler les paramètres communs à tous les thèmes ou ceux propres à chaque thème.

Chaque thèmes a ses propres paramètres

Selon le thème que vous installerez, vous aurez accès à certains paramètres. Certains thèmes offrent beaucoup de flexibilité mais d'autres n'offrent que des options de base.

Un survol des paramètres globaux

Pour accéder à la page des paramètres globaux, cliquer sur l'onglet PARAMÈTRES.

Les paramètres globaux vous permettent de choisir ce qui est affiché et ce qui ne l'est pas pour un certains nombre d'éléments. Avec ces boîtes à cocher, vous pouvez contrôler l'affichage du logo, du nom du site, du slogan, le portrait des auteurs, le statut de l'utilisateur dans les commentaires, l'icône de raccourci (qui s'affiche dans la barre d'adresse), le menu principal et le menu secondaire. Vous pouvez aussi contrôler quel logo vous voulez afficher. Chaque thème offre un logo par défaut mais vous pouvez choisir votre propre fichier image et l'associer à tous les thèmes du site ou encore à un thème particulier.

Tout comme pour le logo, vous pouvez choisir votre propre icône de raccourci.

Des particularités

Les thèmes Garland et Bartik utilisent le module color, qui permet de définir des couleurs différentes pour certains éléments du thème. Vous pouvez donc configurer ces thèmes et obtenir une apparence tout à faire différente d'un site à l'autre en utilisant les couleurs et la disposition des blocs (comme nous l'avons vu dans le menu Structure).
Vous avez deux moyens de choisir la couleur, à l'aide d'un outil graphique ou en saisissant les codes HEX correspondant aux couleurs de votre choix. L'interface vous offre aussi la possibilité de pré-visualiser vos changements et de décider si les couleurs s'agencent bien ensemble.
Une autre particularité propre au thème Garland : vous pouvez choisir comment le contenu d'une page s'affiche, soit à largeur fixe, soit à largeur variable. Si le contenu est à largeur fixe, la page aura une largeur pré-determinée et elle ne s'ajustera pas à la largeur de la fenêtre du navigateur. Par contre, si vous choisissez la largeur variable, le contenu utilisera 100% de la largeur du navigateur et le contenu s'ajustera si la largeur de la fenêtre fonctionne.

Où trouver des thèmes

Avoir accès à seulement deux thèmes, c'est plutôt limité comme choix. Tout comme pour les modules, de nombreuses personnes offrent des thèmes gratuitement à partir du site.

En date de rédaction de cet article, le site Drupal [http://drupal.org] offre 677 thèmes pour Drupal 7. Vous pouvez voir une liste de ces thèmes pour Drupal 7 en suivant ce lien.

Avec près de 700 thèmes disponibles, vous aurez des heures de plaisirs et de recherche en perspective. Pour accélérer le processus, vous pouvez consulter la liste des thèmes les plus populaires. La plupart sont populaires parce qu'ils fonctionnent bien. Mais pour certains thèmes, vous verrez qu'ils ont piètre apparence si on ne fait que les installer. Ce sont des thèmes de base, qui servent à créer un site à l'apparence entièrement sur mesure plus rapidement.

Comment faire un thème sur mesure

Il se peut que vous ayez envie d'une apparence unique pour votre site web. Ou peut-être qu'une solution sur mesure que tout le monde peut utiliser ne vous intéresse pas. Si c'est le cas, vous aurez donc besoin d'aller plus loin dans la configuration de votre thème.

Il y a trois approches pour faire un thème sur mesure, tout dépend des caractéristiques de votre projet.

Installer un thème prêt à l'usage

Si vous trouvez un thème déjà complet, votre travail est déjà terminé. Pour le plupart des sites, c'est souvent tout ce qu'il faut. Installer un thème, le configurer, faire la disposition des blocs et votre site est prêt pour publier vos premières pages.

Sous-thème (ou comment perfectionner le thème presque parfait)

Mais peut-être que le thème que vous avez trouvé est presque parfait sauf pour le pied de page qui ne s'aligne pas exactement comme vous le voulez ou encore les hyperliens qui sont en italique et que vous aimeriez voir en caractères gras. Qu'à cela ne tienne, vous n'avez qu'à créer un sous-thème et à faire seulement les modifications que vous désirez et votre site est prêt à partir. Pour un programmeur habitué à faire des thèmes dans Drupal, ce genre de changements prend entre quelques minutes et quelques heures de travail (selon la complexité des changements). C'est une solution qui est parfois très économique pour arriver à un très bon résultat.

Starter-theme (ou comment démarrer plus vite un projet 100% sur mesure)

Si votre projet demande quelque chose de plus précis et d'entièrement sur mesure, vous pouvez utiliser un "starter-theme", c'est un thème qui met en place des fonctions de base mais qui n'offre rien au niveau de l'apparence. Vous aurez besoin d'un programmeur qui peut construire l'apparence de votre site à partir d'un thème de base mais qui devra programmer chaque aspect de l'apparence du site. C'est un projet qui demande un peu plus de temps mais qui vous garantit d'avoir un site entièrement original, sur mesure et parfaitement adapté à vos besoins. Et c'est quand même moins de travail que la dernière solution.

Un thème Drupal à partir de rien (pour ceux qui veulent tout contrôler)

ici vous devrez simplement tout construire vous-même. Pour la grande majorité des projets, même les plus complexes et les plus ambitieux, ce n'est que rarement nécessaire. Ceci dit, si vous voulez apprendre comment fonctionne le système de thème dans Drupal, c'est une excellente façon d'aborder ce sujet plutôt complexe. À ce sujet, voyez ma série d'articles et mon guide.

Conclusion

Si vous avez besoin d'un site et que vous n'avez pas de budget, vous pouvez simplement installer un thème complet et vous aurez quelque chose de tout à fait acceptable. Avec un peu de travail, vous obtiendrez même un site à l'apparence très professionnelle. vous devrez simplement investir du temps pour faire des essais avec différents thèmes. Malgré les efforts , le processus est assez simple.

Si votre projet demande un site vraiment sur mesure, vous aurez besoin d'apprendre vous-même comment  faire (ce qui peut être long si vous ne connaissez rien au CSS et au HTML) mais ce n'est pas impossible. Mais si vous êtes prêt à engager quelqu'un, vous pouvez faire appel à un designer/themer : c'est la désignation en anglais que la communauté Drupal utilise pour les personnes qui sont spécialisée dans la créations ou la modification d'un thème.

La construction d'un thème est une des choses que je connais le mieux au sujet de Drupal, si vous avez des questions, il me fera plaisir d'y répondre, vous pouvez simplement me contacter.

Ajouter un commentaire

Plain text

  • Les lignes et les paragraphes vont à la ligne automatiquement.
Actualiser Type the characters you see in this picture. Type the characters you see in the picture; if you can't read them, submit the form and a new image will be generated. Not case sensitive.  Switch to audio verification.