Cet article est une traduction du tutoriel How To Create a WordPress Theme rédigé par Ian Stewart, l’auteur du framework WordPress Thematic disponible sur son site ThemeShaper. Avec son aimable autorisation et mes remerciements.

Avant de commencer la réalisation du thème WordPress vous devez mettre en place les outils de votre environnement de développement. Dans cet article, nous allons passer en revue le meilleur des outils pour mettre en place un environnement de test multiplateforme qui ferait la fierté de tout développeur WordPress professionnel.

Serveur de test local : XAMP ou WAMP

La meilleure façon développer votre thème WordPress personnalisé est de le faire en mode déconnecté du web, c’est à dire en local sur votre ordinateur. Pour cela vous devez donc transformer votre ordinateur en serveur local, et donc le configuer comme un serveur web classique (Apache, MySQL et PHP). Cela vous permettra d’installer WordPress en local sur votre ordinateur.

Installer ces différents éléments séparément peut être techniquement assez périlleux mais heureusement il existe quelques logiciels gratuits qui feront l’installation complète pour vous.

Si vous êtes sous Windows, vous devrez vous pencher vers XAMP.

Si vous êtes sur un Mac, téléchargez MAMP. C’est ce que j’utilise et ça fait l’affaire.

WordPress

Bien sûr vous devrez télécharger la dernière version de WordPress et l’installer correctement sur votre ordinateur.

Si vous utilisez XAMP, suiviez ces instructions pour installer WordPress en local.

Si vous utilisez MAMP, suives ces instructions pour installer WordPress en local. (ndT : ou bien mon article sur le même sujet).

Jeu d’essai

Votre installation de WordPress va avoir besoin de données d’exemple comlètes c’est-à-dire d’un jeu d’essai pour vérifier votre thème. Dans l’outil d’administration de WordPress utilisez Outils>Import et choisissez WordPress dans la liste. Pour cela vous devez juste disposer d’un fichier WXR à importer.

Il y a plusieurs choix possibles :

Chacun de ces jeux d’essai ont des plus et des moins. En général, je préfère charger le maximum de données d’essai possible. Absolument tout. Pour éviter qu’un cas particulier ne soit pas prévu. Quand vous pensez avoir fini votre thème, naviguez au travers des différents articles que vous avez chargés. Vérifiez les archives par mois, par année et par catégorie. Avec un jeu d’essai complet il vous sera facile de vérifier si rien ne manque à votre thème.

Editeur de texte

Vous n’avez pas besoin d’un éditeur graphique évolué pour créer un thème WordPress, un éditeur plein texte basique suffira. Mais certains éditeurs sont meilleurs que d’autres, évidemment .

Pour Windows, essayez Notepad++. C’est gratuit , open-source, et recommandé par Lifehacker.

Pour Mac OS, je recommande Smultron. C’est gratuit, open-source et – si vous décidez d’éditer votre thème en ligne via FTP- il fonctionne correctement avec le client FTP Cyberduck.

Firefox

Evidemment, vous pouvez utiliser n’importe quel navigateur pour le développement web mais celui que je recommande est Firefox. Plus spécialement avec les deux extensions suivantes qui vont vous simplifier la vie pour le développement avec WordPress.

L’extension Web Developper Add-on for Firefox ajoute une barre d’outils offrant une série d’options permettant d’inspecter et de déboguer votre code, de la désactivation des CSS à la validation locale du code HTML (en bref gérer tout ce qui peut se passer sur le navigateur de votre environnement de test).

L’extension Firebug Add-on for FireFox est indispensable. Avec Firebug activé vous pouvez cliquer sur n’importe quel élément de la page pour voir – dans une fenêtre en bas de l’écran – à quoi ressemble le code source et comment son affichage est contrôlé par le CSS.

HTML et CSS

Je ne vais pas vous mentir, des notions basiques HTML et CSS vous seront utiles. Je vous recommande de consulter le site HTML dog et en particulier HTML Beginner Tutorial et CSS Beginner Tutorial. La consultation de ces deux tutoriaux n’est pas obligatoire mais cela vous apportera les concepts de base sans trop d’effort.

PHP

Et à propos de PHP ? Ne doit-on pas connaître PHP pour développer un thème WordPress ? Et bien, oui, vous le devez. Mais je vous en apprendrai suffisamment pour être à l’aise avec le développement au fil de l’avancement. Si vous voulez devenir un expert – c’est toujours bien de l’être – vous pouvez commencer par l’article PHP for the absolute beginner sur PHP101. Vous aurez seulement besoin de retenir les concepts de base.

Cet article fait partie du tutoriel Créer un Thème WordPress :

  1. Introduction
  2. Outils de Développement
  3. Structure HTML du Thème
  4. Structure des Dossiers et Templates
  5. Template Header
  6. Template Index
  7. Templates Single, Attachment et 404
  8. Template Comments
  9. Template Search et Page
  10. Template Archives, Auteur, Catégories et Mots clés
  11. Template Sidebar
  12. Design du Thème, Initialisation et Construction CSS

flattr this!