Création de thème avec Omega 4

Le theming dans Drupal est loin d’être aisé. La création d’un thème a partir du zéro, s’il peut s’avérer pratique, peut se montrer difficilement exportable vers un autre site. Il est donc souvent plus simple de partir d’un des thèmes de base selon ses besoins que l’on adaptera par la suite. Le problème, c’est que si un thème de base peut avoir le format désiré, ils ne remplira pas forcément tous les besoins comme le Responsive ou le HTML5/CSS3.

Pour remédier à ces problèmes, il existe une solution au premier abord complexe mais qui une fois maitrisé permet de maitriser totalement ses thèmes: Omega.

Omega est un framework de thème, c’est à dire qu’il permet de produire des thèmes très complets qui pourront s’adapter à vos besoins. La force d’Omega, c’est qu’il est compatible avec de nombreux outils. Pour facilité l’intégration il est compatible avec 960 Grid ou des fluid layouts et le responsive en ayant une approche Mobile First Web Design. En plus d’avoir les spécificités des thèmes drupal qui permettent de définir des zones, des régions, il inclut plusieurs librairies javascript polyfill, ou permet de gérer la mise en cache de son design ou l’aggrégation du CSS.

On peut également gérer son thème via des contextes, créer des sous thèmes simplement part l’interface graphique ou drush ou encore, exporter le thème une fois qu’on l’a configurer comme on le souhaitait.

Un moyen de réaliser un thème complet et robuste mais Omega reste complexe à prendre en main étant donné le nombre de ses possibilités.

Pour ce qui est des différences entre les versions, actuellement pour Drupal 7, il existe 2 versions: La version 3 et la 4. Les différences techniques entre les deux versions sont assez nombreuses et sont listées dans la documentation. La version 3, est la plus ancienne et n’est plus mis à jour (il n’y a que des mises à jour de sécurité). La première version stable de la 4 est sortie en septembre 2013 et elle reste bien moins utilisé mais elle sera porté vers Drupal 8 contrairement à la version 3. C’est pour cette dernière raison que je vais m’intéresser à la version 4.

Avant de commencer, il faut comprendre comment Omega fonctionne. Il se présente comme un thème mais ce n’est pas lui que vous allez modifier directement, vous allez générer un thème à partir de l’un de ses starterkits. Il existe 3 starterkits dans la version 3:
– Omega-XHTML qui permet d’avoir un thème basé sur XHTML mais pas HTML 5
– Starterkit Omega-HTML5 qui lui est basé sur HTML 5. C’est le kit par défaut
– Omega-Alpha qui est, si j’ai bien compris, une version allégée ou une vieille version du starterkit XHTML (la documentation est plutôt évasive à ce sujet, personne n’a l’air d’utiliser ce kit).

Pour la version 4, il n’en existe qu’un, le « default » qui correspond à la version HTML 5 de la version 3.

Avant de pouvoir créer votre thème, vous d’abord télécharger le thème Omega mais ne pas l’activer. Avec Drush:

drush dl omega

Vous ne devez pas l’activer.

Cela devrait vous donner accès à de nouvelles commandes Drush:
drush omega-wizard vous permet de créer un sous-thème
drush omega-export vous permet d’exporter les configurations que vous avez réalisé avec l’interface administrative dans le .info
drush omega-revert vous permet de nettoyer la base de données des configurations réalisées avec l’interface administrative

Pour générer un sous-thème, vous devez lancer cette commande Drush et suivre les instructions:

drush omega-wizard

Si vous ne trouvez pas la commande Drush, vider le cache de drupal (drush cc all). Si vous ne trouvez désespérément pas cette commande, c’est que votre version de Drush est trop ancienne. Vous pouvez vérifier sa version avec la commande suivante:

drush status

Étant sous Debian 6, je n’avais que la version 3.3 et j’ai dû la mettre à jour, voici un article qui vous expliquera simplement comment procéder.

Une fois votre sous-thème créer, nous allons pouvoir passer à la configuration et la personnalisation de celui-ci.

Post to Twitter Post to Facebook Post to Google Buzz Post to LinkedIn

Laissez un commentaire

« »