Les articles de ce didacticiel ont pour but de vous aider à créer un thème à partir d'un thème déjà existant.
Vous apprendrez à maîtriser l'architecture d'un thème PHPBoost afin d'en réaliser un à votre image, à vos goûts, et avant tout un thème dédié à votre projet.
Ce didacticiel s'appuiera donc sur le thème
Base fourni avec le CMS, créé sans fioriture et répertoriant la totalité des éléments nécessaires à l'élaboration un thème pour PHPBoost.
La mise en forme de pages web utilise les langages Javascript, HTML et CSS. Avec PHPBoost, seules des connaissances en CSS sont nécessaires pour débuter la réalisation d'un thème. Les langages Javascript et HTML vous seront utiles pour une réalisation plus élaborée.
Le langage CSS est très intuitif, rapidement assimilable avec quelques notions d'anglais, et très fourni en didacticiels d'apprentissage sur la toile. Vous trouverez la liste des propriétés CSS et la possibilité de les tester sur le site
w3school.com. Si vous avez compris ces notions, avec un peu de bon sens et de volonté, c'est à la portée de tout le monde.
Pour en savoir plus sur l'apprentissage des bases de ces différents langages, nous vous invitons à lire
ce didacticiel mis à jour régulièrement, sur le site OpenClassrooms (inscription gratuite nécessaire pour suivre le didacticiel).
Afin de travailler sans pour autant empêcher l'accès à votre site, nous vous recommandons de modifier votre thème en local.
Cela vous permettra également d'éditer rapidement vos fichiers et d'avoir un rendu direct sans nécessité de les transférer via FTP.
Chaque développeurs possède sa propre façon de coder. Lorsque l'on travaille en équipe il est important d'avoir une base commune. Vous trouverez dans l'article
Conventions HTML et CSS notre façon d'écrire le code CSS.
Avant de faire des modifications, il est important de comprendre la façon dont est organisé un thème. Nous vous invitons à lire l'article
Structure des thèmes. Chaque répertoires et chaque fichiers sont détaillés.
La personnalisation graphique d'un thème passe par 3 étapes :
Pour rappel, le code CSS correspond au style que l'on applique sur des éléments du code HTML. Le code CSS de PHPBoost est contenu dans les fichiers .css . Certains éléments peuvent encore être contenu dans des fichiers .tpl, mais nous avons essayé de les supprimer au maximum pour faciliter la mise à jour graphique.
L'article
Personnalisation du code CSS contient toutes les infos dont vous pourriez avoir besoin.
Le code HTML de PHPBoost est contenu dans les fichiers .tpl. Chaque module contient ces propres fichiers personnalisables.
L'article
Personnalisation des modules ou de framework vous aidera à la personnalisation et à la modification du code afin d'organiser le site web comme vous le souhaitez.
Dans certains cas, vous pouvez être amené à modifier certaines images afin d'apporter une touche personnelle.
Maintenant que vous avez modifié votre thème pour qu'il soit à l'image de votre site web, nous pouvons passer à la dernière étape.
Il faut maintenant préparer votre thème à l'exportation. L'article
Finalisation du thème vous présente quelques conseils afin de pouvoir partager votre création.