Feuilles de style

Dans le monde du design web actuel, les feuilles de style aussi aussi importantes que le gabarit lui-même. La plupart des designers de notre époque utilisent une combinaison de marquage sémantique et de feuilles de style pour rendre leurs sites accessibles et faciles à modifier. CMSMS croit en les standards du Web (W3C), et les feuilles de style sont un outil pour s'y conformer.

Il n'est pas nécessaire, ici, d'aller dans les détails de CSS, puisqu'ils sont déjà traités dans de nombreuses et importantes ressources sur Internet.

L'admin "feuilles de style" est, en fait, très basique. Il n'y a ni balises, ni d'autres trucs. Depuis l'admin, vous créez réellement une nouvelle feuille de style, l'éditez, ou la retirez.

Voir aussi la page Je suis designer / Feuilles de style

Ajouter une feuille de style

Pour créer une feuille de style, procédez comme suit :

1. Cliquez sur 'Ajouter une feuille de style', lien situé en bas de la liste.
2. Donnez un nom à la feuille de style, principalement comme référence future dans d'autres étapes. Cela ne donne aucune sortie quelconque.
3. Ecrivez ou collez vos styles en CSS pur. Aucun parsing n'est effectué, ni aucune substitution de texte. Ecrivez comme vous le feriez depuis le Bloc Notes, TextEdit ou VI.
4. Eventuellement, ajoutez un type de média. Si vous concevez des sites réellement accessibles, vous devriez y insérer une valeur pour que la page soit rendue pour différents types de médias. Exemples : "screen","print", etc ... En cas de doute, laissez ce champ vide.
5. Cliquez sur Envoyer.

Parfait ! Vous avez créé et sauvergardé une feuille de style désormais utilisable avec vos différents designs !

Associer une feuille de style à un gabarit

"Super !", vous dîtes-vous. "Maintenant, j'ai un feuille de style et un gabarit. Mais ces éléments ne devraient-ils pas être reliés ?". En effet, vous avez raison. Normalement, vous ajoutez une balise <stylesheet> ou <link rel="stylesheet" src="maCSS.css" /> dans votre gabarit et faites pointer vers la CSS désirée. A la place, dans CMSMS, nous avons la balise Smarty {stylesheet} ...

Voici comment associer une feuille de style à un gabarit. Gardez à l'esprit que vous pouvez effectuer l'opération inverse depuis la page admin "Gabarit". Les deux fonctionnent basiquement de la même façon.

1. Cliquez sur le bouton "CSS" ( ancienne version bouton orange et rouge), sur la même ligne que la feuille de style que vous voulez attacher.
2. L'écran suivant montrera une liste des différents gabarits utilisant déjà celle-ci, et une liste déroulante des autres gabarits. Choisissez le gabarit que vous voulez voir associé à cette feuille de style dans la liste déroulante.
3. Cliquez sur 'Attacher à ce gabarit'
4. La feuille de style choisie devrait, à présent, afficher la liste des gabarits lui étant associés. Vous pouvez donc cliquer sur 'Retour au Menu' afin de retourner à la page admin "Feuilles de style".

A présent, lorsque vous regardez une page avec votre gabarit, vous devriez voir les styles dans la feuille de style associée.

Supprimer une feuille de style d'un gabarit

A FAIRE ...

=== Ajouter des styles à FCKeditor === -> POUR MEMOIRE A faire pour TinyMcE L'éditeur par défaut, FCKeditor, possède la faculté de pouvoir afficher des styles dans une liste déroulante lors de l'édition. Puisque vous ne voudriez probablement pas montrer TOUS les styles dans l'éditeur, vous pouvez désigner quels styles seront affichés à partir de la page "Options" du module FCKeditor.

Pour pouvoir utiliser des styles supplémentaires avec FCKeditor, procédez comme suit :

1. Créez une feuille de style que vous voulez pouvoir appliquer au texte. Par exemple : div.rose { color: pink; }
2. Associez-la à votre gabarit.
3. Aller dans 'Extensions'→'FCKeditorX'→'Styles' et collez le même code que dans la feuille de style créée. Par exemple : div.rose { color: pink; }
4. Quand vous éditez ou ajoutez une page, vous pouvez sélectionner du texte et appliquer ce style depuis la liste déroulante "Styles" de FCKeditor.

Note : Il semblerait que les styles supplémentaires pour FCKeditor ne fonctionnent plus dans la branche 0.12.x. Utiliser la version 0.13beta2 (ou plus récente) devrait rectifier le problème. Il semble cependant que certains problèmes subsistent, même avec cette version.

Editer une feuille de style

Sélectionner la feuille de style désirée dans Disposition » Feuilles de style

• Dans Nom: : un nom pour la feuille de style.
• Dans Contenu: : votre code CSS.
• Dans Type de média: (optionnel) : un média CSS tel que "screen", "print", ou "handheld". Le W3C fournit une liste des médias supportés.

This page in: English - Deutsch - Español - Français - Italiano - Lietuvių - Nederlands - Norsk - Polski - Česky - Русский - Svenska - Tiếng Việt - عربي - 日本語 简体中文

User Handbook/Admin Panel/Layout/Stylesheets/fr

From CMSMS