Tweet
Re : Création d'un template avec Artisteer, les limites
=> 3 conseils ou astuces basiques :
Cela vous paraîtra peut-être d'abord de petites manies, mais lorsque par la suite vous voudrez retrouver tous les changements que vous avez apportés, par exemple avec NotePad2, rien ne sera plus simple et rapide : CTRL+F (= Find = Rechercher), puis µ (= moi), puis ENTRÉE. Enfin, en refermant la boîte de dialogue, un simple appui sur F3 vous permettra de voir successivement toutes vos modifications. => Plus besoin de vous demander pourquoi votre template n'est plus ce qu'il était avant vos bidouillages ;-)
...Alors un autre conseil — que tous les développeurs et créateurs de site vous donneront, ce n'est pas original : utilisez Firebug : https://getfirebug.com. Cette extension est quasi irremplaçable pour modifier les styles d'un template ou d'une extension — au point que si par exemple vous posez une question sur le forum Rockettheme à propos de l'un de leur template, il ne vous sera même pas répondu si vous n'avez pas préalablement installé cette extension de Firefox.
En bref, Firebug est un outil permettant (1°) de comprendre, (2°) de modifier, mais aussi (3°) d'apprendre les CSS.
Que voulez-vous de mieux ? :-)
Amicalement,
PhilJ
Envoyé par Blackflag
Voir le message
- Chaque fois que c'est possible, évitez de modifier la feuille de style principale, template.css. En effet, en cas de mise à jour du template, tout votre travail sera écrasé. Les frameworks (Gantry, Warp, Vertex et les autres) prévoient en général des feuilles de style permettant des overrides, c'est-à-dire des surcharges. Ce sont ces dernières qu'il est préférables de modifier, de préférence au fichier template.css. Par exemple, si vous utilisez JSN framework (JoomlaShine), le fichier à modifier est nommé custom.css. Avec Gantry (Rockettheme), ce sera rt_xxxxx-custom.css, où xxxx est le nom du template. Etc.
Raisonnez de même pour les extensions : évitez de bidouiller directement les feuilles de style des composants / plugins / modules. Là aussi, pratiquez l'override. Sinon, la prochaine mise à jour risque fort d'être une remise à zéro :-\
— - De toute façon, faites des sauvegardes des fichiers que vous modifiez. Très fréquentes si vous êtes débutant, seulement en cas de doute ou pour des modifications majeures si vous êtes aguerri.
— - Et : commentez systématiquement tous vos ajouts / toutes vos modifications.
—
Astuce : utilisez un code facile à retrouver dans vos fichiers CSS. Par exemple, un caractère inhabituel — ou bien, vos initiales, si elles s'y prêtent (= si elles ne peuvent pas être confondues avec un code, comme ma, dans margin).
Exemple avec la lettre grecque µ (mu) :
—
...ce que vous comprendrez et lirez : j'ai (µ) modifié (#) la taille de la police de la balise <H1>, en remplaçant 24px par 22px.Code:h1 { /* µ# 24px */ font-size: 22px; }
—
Autre exemple :
—
...que vous comprendre et lirez : j'ai (µ) ajouté (+) une instruction line-height, , et supprimé (-) l'instruction font-weight: bold à la classe topmenu.Code:.topmenu { /* µ+ line-height µ- font-weight: bold */ line-height: 2em; }
Cela vous paraîtra peut-être d'abord de petites manies, mais lorsque par la suite vous voudrez retrouver tous les changements que vous avez apportés, par exemple avec NotePad2, rien ne sera plus simple et rapide : CTRL+F (= Find = Rechercher), puis µ (= moi), puis ENTRÉE. Enfin, en refermant la boîte de dialogue, un simple appui sur F3 vous permettra de voir successivement toutes vos modifications. => Plus besoin de vous demander pourquoi votre template n'est plus ce qu'il était avant vos bidouillages ;-)
Je pense que faire des tests en ajoutant mes propres valeurs, images ou en modifiant quelques trucs avec des éléments du site du zero pour voir ce que ça change, ça me permettrait de mettre une image de résultat sur une action.
En bref, Firebug est un outil permettant (1°) de comprendre, (2°) de modifier, mais aussi (3°) d'apprendre les CSS.
Que voulez-vous de mieux ? :-)
Amicalement,
PhilJ
.
Commentaire