Bandeau

Site de démonstration du jeu de squelettes ESCAL fonctionnant sous SPIP3 et mis à la disposition des Etablissements SColaires de l’Académie de Lyon... et de qui veut.

Utilisé à ce jour dans 483 sites
logo article ou rubrique
Jouer avec les couleurs
Article mis en ligne le 16 mars 2013
dernière modification le 15 janvier 2019

par Jean Christophe Villeneuve

Une page de configuration dans l’espace privé permet de choisir les couleurs pour l’ensemble du site : fonds, textes et bordures mais on peut avoir envie de jouer un peu plus.

 Jouer avec le fond

 Selon la langue

Si on utilise le multilinguisme, on peut définir un fond en fonction du contexte de langue dans le site.

Pour cela, il suffit de

  • créer un fichier css pour chaque langue, Escal s’occupant du reste. Ces fichiers doivent s’appeler XX.css où XX correspond au code de langue (fr, en, de, es, it, ....) et doivent se trouver dans le dossier /squelettes/styles
  • mettre dans ces fichiers le code suivant
  1. div#conteneur {
  2.         background-color: couleur;
  3. }

Télécharger

couleur sera la couleur choisie pour chaque secteur. Cette couleur pourra être

    • une couleur en code hexadécimal -> exemple : #0000FF
    • une couleur nommée -> exemple : grey
    • une couleur en code rgb -> exemple : rgb(24,125,255)

On peut évidemment définir d’autres règles CSS dans ces fichiers lang.css

 Selon le secteur

On peut aussi définir le fond des pages en fonction du secteur dans lequel on se trouve.

Pour cela, il suffit de

  • créer un fichier css pour chaque secteur, Escal-V3 s’occupant du reste. Ces fichiers doivent s’appeler secteurXX.css (où XX correspond au numéro du secteur) et doivent se trouver dans le dossier /squelettes/styles
  • mettre dans ces fichiers le code suivant
  1. div#conteneur {
  2.         background-color: couleur;
  3. }

Télécharger

couleur sera la couleur choisie pour chaque secteur. Cette couleur pourra être

    • une couleur en code hexadécimal -> exemple : #0000FF
    • une couleur nommée -> exemple : grey
    • une couleur en code rgb -> exemple : rgb(24,125,255)

On peut évidemment définir d’autres règles CSS dans ces fichiers secteurXX.css

 Jouer avec les cadres

Dans Escal, tous les cadres latéraux ont une class spécifique. On peut donc personnaliser les couleurs de chacun d’entre eux. Tout est expliqué dans cet article.

qrcode:http://escal.ac-lyon.fr/spip/spip.php?article194

Plan du site Contact Mentions légales Espace rédacteurs squelette RSS

2009-2019 © Escal V4 - Tous droits réservés
Haut de page
Réalisé sous SPIP
Habillage ESCAL 4.3.2