Dans cet article, je vais vous parler du déroulement de mon stage du 19 juin au 07 juillet.

Après la réalisation des wireframes (maquettes fonctionnelles) de toutes les pages je me suis mis avec l’équipe sur la conception des maquettes graphiques du site grâce au logiciel Adobe Photoshop. Nous avons utilisé 960 grid system, un sysème de grilles que nos tuteurs ont conseillé. C’est des templates contenant des Calques. Il est utilisable sur de nombreux logiciels tels que Photoshop, Fireworks, Gimp,…
Le 24 juin nous avons commencé le développement du site, la partie tant attendu du projet. Chacun des membres de l’équipe avait un nombre de pages à intégrer. Mais avant cela, n’oublions pas qu’il était nécessaire de configurer tous les plugins qu’on allait utiliser sur WordPress. Alors ce qu’il faut savoir c’est que pour ce site le thème à mettre en place est un thème enfant.

Qu’est ce qu’un thème enfant ?

Un thème enfant est un thème qui hérite toutes les fonctionnalités d’un autre thème appelé thème parent, sans jamais les modifier. Ainsi on peut apporter des modifications au thème enfant et en cas de mise à jour du parent aucune perte n’aura lieu, c’est tout l’intérêt d’un thème enfant.

conception-theme-enfant-wordpress

Tout fichier placé dans le thème enfant et portant le même nom que dans le thème parent, prendra le dessus et écrasera le fichier original sauf le functions.php.
De nombreux thèmes premium, contiennent un thème enfant prêt à l’emploi. Dans ce cas, il suffit juste de le mettre en place. Attention, il faut bien sûr installer le thème parent sans l’activer, puis installer le thème enfant et activer ce dernier.

Comment mettre en place un thème enfant ?

Pour créer un thème enfant, on a besoin du thème parent et de deux (02) fichiers qu’on va créer. Il faudra également créer un répertoire pour y placer les fichiers du thème enfant.

Il faut tout d’abord créer un dossier pour le thème enfant dans le FTP. Il suffit de créer le créer dans /wp-content/themes/ChildThemeName/.

On va maintenant créer les deux fichiers dont nous avons besoin et qu’on placera dans le dossier de notre thème enfant :

un fichier functions.php
un fichier style.css

Dans le fichier functions.php, on va intégrer le code qui va permettre de combiner ou d’écraser le fichier style.css du parent.

Voici le code à mettre dans le fichier functions.php et style.css du thème enfant :

functions.php

wordpress-functions-theme

style.css

wordpress-style-css

On peut à présent ajouter toutes les modifications CSS au niveau du fichier style.css ainsi que les fonctions qu’on souhaite au niveau du fichier functions.php

Quant à moi je vous retrouve très prochainement pour un article consacré au responsive design.