Créez votre thème WordPress avec le framework Underscores

Un framework ?

Un framework est une bibliothèque de fichiers sur laquelle vous vous appuyez pour créer votre propre thème. Cela vous permet de bénéficier d’un code fonctionnel et vous évite de réinventer la roue.

Choisir son framework pour WordPress n’est pas chose aisée. Il existe en effet une quantité astronomique de thèmes de base. Tous ne sont d’ailleurs pas des frameworks à proprement parlé (Suffusion, Presswork, …)  Je vous invite à lire ces articles qui vous présenterons les frameworks les plus populaires :

Les frameworks sont généralement sous licence libre, mais s’appuient chacun sur des bases différentes (960.cs, html5 Boilerplate, Blueprint, 1140 Css Grid, etc.). Ils ne sont pas tous faciles à appréhender et pas toujours documentés.

_s Theme

Pour le site que je développe actuellement, je cherchais la simplicité. Je suis tombé sur le thème Underscores ou _s Theme pour faire court. Ce framework est le successeur de Toolbox, un theme développé par ThemeShaper. Pour info, ThemeShaper fait partie du team Automattic (à l’origine de WordPress).

Ce thème reprend en fait en grande partie le fonctionnement du thème TwentyTen. Eh oui, pourquoi faire compliqué? Ce thème a fait ses preuves.

Underscores présente les fichiers principaux avec les boucles déjà prêtes. Il suffit de personnaliser si besoin et de peupler ce code avec notre HTML/Css personnel.

Mais ce n’est pas tout. Voici quelques atouts de _s Theme:

  • Un code HTML5 light et bien commenté.
  • Optimisé pour le référencement
  • Les fonctions d’entête et d’arrière-plan personnalisés activables simplement dans le function.php
  • Des options de thème activables avec des exemples concrets.
  • Des scripts et templates pour lecture facilitée sur terminaux mobiles
  • 5 CSS : Deux sidebars sur gauche, Deux sidebars sur droite, Une sidebar de chaque côté du contenu, et un contenu avec une sidebar à droite ou à gauche.
  • Un fichier style.css structuré et commenté, s’appuyant sur le reset de Eric Meyer et Blueprint
  • Licence GPL
  • Et bien plus…

Comment-faire?

Tout d’abord, il vous faut télécharger l’archive sur GitHub. Ensuite, décompressez l’archive et avec l’outil de votre choix remplacez les termes des fichiers PHP et CSS comme suit:

  • Chercher : ’_s’
  • Remplacer par : ’LeNomDeVotreTheme’
  • Chercher : ‘_s_’
  • Remplacer par :  ‘LeNomDeVotreTheme_’
  • Chercher : ‘  _s’ (attention à l’espace avant l’underscore)
  • Remplacer par :  ‘ LeNomDeVotreTheme’ (avec espace avant)

Installez maintenant votre thème avec la méthode habituelle et vérifiez que tout fonctionne. Si c’est le cas, vous pouvez maintenant personnaliser votre thème.

Jetez un oeil à function.php et aux options qui vous sont offertes. Ensuite, commencez à étudier index.php et les différents content.php qui vous permettront de comprendre la structure et vous aiderons à développer votre CSS.

Si vous rencontrez un dysfonctionnement, c’est que le remplacement du nom des fichiers a échoué. Recommencez en faisant très attention aux espaces et underscores, et pensez bien à effectuer ces remplacements dans les sous-dossiers.

Au final

Le Framework Underscores est de loin le plus simple que j’ai pu tester. Si comme moi vous n’avez encore jamais utilisé de framework, commencez par celui-ci. Maintenant que j’en ai compris le fonctionnement (enfin, je crois), je peux envisager d’utiliser des frameworks plus complexes, mais _s Theme reste pour le moment mon favori.

 

 

, ,

Une Réponse to “Créez votre thème WordPress avec le framework Underscores”

  1. Vertex-Polygon 17 août 2012 à 15 h 40 min # Répondre

    Nouveauté du framework :

    Générez votre propre thème basé sur underscores grâce à l’outil en ligne underscorses.me

Laisser un commentaire