PHPBoost CMS

Nous allons voir comment procéder pour créer son thème assez simplement.



Faut-il des connaissances particulières ?
La mise en page de pages web utilise les langages XHTML et CSS. Il n'est pas nécessaire de connaître le XHTML pour faire son thème, en revanche il faut avoir quelques notions en CSS. Rassurez-vous, ce langage est très intuitif, il suffit d'avoir quelques notions en anglais pour le comprendre. Vous trouverez une liste des propriétés CSS sur le Site du Zéro. Si vous avez compris ces notions, avec un peu de bon sens et de volonté c'est à la porté de tout le monde.
Pour en savoir plus sur ces deux langages nous vous invitons à lire ce cours très bien fait, toujours sur le Site du Zéro.

Pour créer votre thème nous vous conseillons fortement de travailler sur un serveur local. Cela vous permettra de pouvoir travailler sur votre thème sans que ça n'ait un impact sur votre site en ligne.



Nous avons deux solutions. Soit nous partons du thème main et nous le modifions soit nous créons notre thème. Dans le premier cas ouvrez le dossier templates/main, sinon ouvrez le dossier templates et dupliquez le dossier main, que vous renommez en votre_theme, sachant que ce nom doit comporte des lettres minuscules (non accentuées), chiffres, - et _. Ouvrez ensuite le dossier que vous venez de créer.
A l'intérieur vous trouverez plusieurs types de fichiers :

• *.css : Ces fichiers servent à modifier l'apparence globale du site (couleurs, images, épaisseurs de traits, polices, tailles...).
• *.tpl : Ces fichiers servent à modifier plus profondément votre site, à déplacer l'affichage de textes , voici un exemple avec les templates modifiés http://www.mussotrail.com. La modification de ces fichiers nécessite des connaissances en XHTML.
  

Vous y trouverez aussi les dossier suivants :

• admin : dans ce dossier vous trouverez les fichiers *.tpl relatifs au panneau d'administration.
• config dans lequel il y a un dossier par langue dans laquelle le thème est porté. Ils contiennent les fichiers de configuration, c'est-à-dire les informations qui s'affichent dans l'administration des thèmes (créateur, date, version, largeur de page...). Si vous avez décidé plus haut de créer votre propre thème il faudra adapter le contenu de ces fichiers.
• images dans lequel on trouve toutes les images relatives au thème.
  

Rentrons maintenant dans le vif du sujet, il va falloir modifier les fichiers CSS. Il est préférable de s'y prendre dans l'ordre suivant :

• content.css : Classes propres au contenu du site (messages, modules).
• design.css : Eléments du design (conteneurs).
• global.css : Classes utilisées sur l'ensemble du site, aussi bien dans l'administration que dans les modules.
• admin.css : Feuille de style gérant le panneau d'administration comme son nom l'indique.
  

Les deux fichiers suivants sont en principe indépendant des thèmes, ils ne contiennent aucune information de couleur mais simplement du positionnement et autres propriétés ne changeant pas quelque soit la couleur.

• bbcode.css : L'ensemble des styles générés par les balises BBCode.
• generic.css : Styles génériques, normalement compatibles avec tous les thèmes.
  

Ensuite viennent les modules. Pour une majorité d'entre eux aucun seul un CSS générique est utilisé, ainsi vous ne devriez pas avoir à les modifier. Si tel est le cas vous vous en apercevrez vite et il faudra effectuer les modifications dans leur dossier respectif.

Au fur et à mesure de l'avancement vous verrez que ça prend forme, après c'est à vous de changer les couleurs moi je suis resté dans le noir car on voit bien les changements pour le tutoriel mais le thème ne sera pas rendu public en téléchargement car je l'ai fait "vite" (je me suis plus amélioré sur "comment bien expliquer" que de bien fait fondre les couleurs entre elles en mettant les bonnes couleurs).

---

Articles contenus par cette catégorie :  

 content.css
 CSS
 design.css
 Global.css
 Le content.css
 le default.css
 le design.css
 Le global.css
 test
 tpl
 Travaux Pratique