Purity2.fr

  • Full Screen
  • Wide Screen
  • Narrow Screen
  • Augmenter la taille
  • Taille par défaut
  • Diminuer la taille
French (Fr)English (United Kingdom)
btn_25
afuj
joomla_1_5_25
telecharger_joomla_17

topgauche

Cette position a été rajoutée, elle n'est pas prévue de base dans le template.

voici comment faire :

créer deux nouvelles positions en haut du "content"

topdroite

Cette position a été rajoutée, elle n'est pas prévue de base dans le template.

voici comment faire :

créer deux nouvelles positions en haut du "content"

Les positions (à venir ....)

Les notions de Wrap et de Main | Les styles de modules Jaxhtml et Jarounded | définition des blocks | variations de positions

HEADER (à finir) | MAINNAV | TOPSL | BOTSL | FOOTER | LEFT | RIGHT | MAIN

Couleurs des liens dans les modules de menu de couleur

Note des utilisateurs: / 0
MauvaisTrès bien 

Charger le tutoriel au format PDF pdf_button

Ce tutoriel concerne les modules de menus de couleur _black, _blue, _green, _red.

Nous verrons l'exemple du menu "user menu" avec un module _green

Nous allons tout d'abord appliquer le suffixe de classe de module "_green" au module "user menu".

Pour celà, il faut se rendre dans l'administration des modules,  au niveau des paramètres avancés.

usermoduleadmin

Voilà ce que nous allons réaliser :

modulecolor-1

Tout va se passer dans le fichier template.css

Chemin : template > ja_purity_ii > css > template.css

1-Autoriser le changement de couleur des liens

Nous allons  autoriser le changement de couleur des liens de menu en modifiant

div.module_black *, div.module_green *, div.module_blue *, div.module_red * { color: #fff !important; }

Comme ceci :

div.module_black *, div.module_green *, div.module_blue *, div.module_red * { }

2- Couleur du titre du module

Afin de changer la couleur du titre en rouge, nous allons rajouter la ligne de code suivante :

div.module_green h3 {color: #900;}

3- Couleur des liens de menu

Afin de changer la couleur des liens de menu en jaune, nous allons rajouter la ligne suivante :

#ja-container .module_green ul.menu li a {color: #ff0;}

4- Couleur des liens survolés et de l'arrière plan

pour modifier les liens survolés en jaune avec un fond noir, nous allons rajouter la ligne suivante :

#ja-container .module_green ul.menu li a:hover {background: #000; color: #ff0;}

5- Les liens actifs

modulecolor-2

Pour pouvoir changer la couleur des liens actifs, il va falloir modifier la ligne :

#ja-container ul.menu li.active > a { color: #069 !important; font-weight: bold !important; }

Comme suit :

#ja-container ul.menu li.active > a { color: #069; font-weight: bold !important; }

Pour avoir un lien actif rouge sur un fond vert clair, nous allons ajouter les lignes suivantes :

#ja-container .module_green ul.menu li a:focus,
#ja-container .module_green ul.menu li.active a,
#ja-container .module_green ul.menu li a:active {background: #ceffbf; color: #f00;}

Tout ce que nous venons d'appliquer pour le suffixe de classe de module _green, nous pouvons l'appliquer pour les autres couleurs de modules.


 

Blue badge top

Pour afficher ce style de modules, il faut rajouter le suffixe de classe de module _blue _badge badge-top dans l'admin du module.

De plus, il faut que l'emplacement du module affiche un style JArounded, sinon la couleur ne sera pas prise en compte.

 

Black badge hot

Pour afficher ce style de modules, il faut rajouter le suffixe de classe de module _black _badge badge-hot dans l'admin du module.

De plus, il faut que l'emplacement du module affiche un style JArounded, sinon la couleur ne sera pas prise en compte.

 

Red badge pick

Pour afficher ce style de modules, il faut rajouter le suffixe de classe de module _red _badge badge-pick dans l'admin du module.

De plus, il faut que l'emplacement du module affiche un style JArounded, sinon la couleur ne sera pas prise en compte.

Blue

Pour afficher ce style de modules, il faut rajouter le suffixe de classe de module _blue dans l'admin du module.

De plus, il faut que l'emplacement du module affiche un style JArounded, sinon la couleur ne sera pas prise en compte.

Black

Pour afficher ce style de modules, il faut rajouter le suffixe de classe de module _black dans l'admin du module.

De plus, il faut que l'emplacement du module affiche un style JArounded, sinon la couleur ne sera pas prise en compte.

Red

Pour afficher ce style de modules, il faut rajouter le suffixe de classe de module _red dans l'admin du module.

De plus, il faut que l'emplacement du module affiche un style JArounded, sinon la couleur ne sera pas prise en compte.

 

Hot

Pour afficher ce style de modules, il faut rajouter le suffixe de classe de module  _badge badge-hot dans l'admin du module.
 

Top

Pour afficher ce style de modules, il faut rajouter le suffixe de classe de module  _badge badge-top dans l'admin du module.
 

Pick

Pour afficher ce style de modules, il faut rajouter le suffixe de classe de module  _badge badge-pick dans l'admin du module.
 

New

Pour afficher ce style de modules, il faut rajouter le suffixe de classe de module  _badge badge-new dans l'admin du module.

Green

Pour afficher ce style de modules, il faut rajouter le suffixe de classe de module _green dans l'admin du module.

De plus, il faut que l'emplacement du module affiche un style JArounded, sinon la couleur ne sera pas prise en compte.

 

Green badge new

Pour afficher ce style de modules, il faut rajouter le suffixe de classe de module _green _badge badge-new dans l'admin du module.

De plus, il faut que l'emplacement du module affiche un style JArounded, sinon la couleur ne sera pas prise en compte.

joomlart ja purity 2

purity2_thumbnail

Joomlart - T3 Blank

t3blank_thumbnail

Les liens intéressants

web_links

adaptations de Ja Purity II

purity2_thumbnail
Vous êtes ici : Tutoriels Mise en page Modules Couleurs des liens dans les modules de menu de couleur