Modifier template coté admin

[lordbdp]

Bonjour tout le monde,

Actuellement chaque ligne de listing est blanche dans les onglets Tableau de bord/Présentation,Tableau de bord/Les 10 dernières commandes, ainsi que chaque autre onglet. Je voudrais savoir comment modifier le template afin d'avoir une ligne sur deux grise afin de retrouver plus facilement les contenus.

Merci d'avance.

[lordbdp]

Je sais que c'est du CSS qu'il faut modifier mais en revanche où c'est là que je bloque.

[LeorLindel]

Tu peux prendre exemple sur le module de livraison "Royal Mail" (admin/view/template/royal_mail.tpl) et appliquer dans ton fichier (admin/view/template/home.tpl) les classes "even" et "odd" que tu retrouveras dans la feuille de style (admin/view/stylesheet/stylesheet.css).

N'hésites pas à faire un retour d'expérience.

[lordbdp]

Alors actuellement j'ai juste remplacé dans stylesheet.css :

Code: Tout sélectionner

.list tbody td {

   vertical-align: middle;

   padding: 0px 5px;

   background: #FFFFFF;

}

par

Code: Tout sélectionner

.list tbody td {

   vertical-align: middle;

   padding: 0px 5px;

   background: #A9BFBC;

}

Mais ce que je souhaiterai c'est mettre une commande onMouseover= donc j'ai tenté en créant :

Code: Tout sélectionner

.list tbody td {

   vertical-align: middle;

   padding: 0px 5px;

   background: #FFFFFF;

}
.list2 tbody td {

   vertical-align: middle;

   padding: 0px 5px;

   background: #A9BFBC;

}

mais je ne sais pas où mettre la commande onMouseover=, ni si la commande est correcte :

Code: Tout sélectionner

onMouseover="list=list2" onMouseout="list=list"

[LeorLindel]

Voila comment faire !

Dans le fichier admin/view/stylesheet/stylesheet.css

Remplacer ces lignes :

Code: Tout sélectionner

.list tbody td {
   vertical-align: middle;
   padding: 0px 5px;
   background: #FFFFFF;
}


Par celles-ci :

Code: Tout sélectionner

.list tbody td {
   vertical-align: middle;
   padding: 0px 5px;
}
.list tbody tr:odd {
   background: #FFFFFF;
}
.list tbody tr:even {
   background: #E4EEF7;
}


Dans le fichier admin/view/template/common/footer.tpl

Chercher cette ligne :

Code: Tout sélectionner

<div id="footer"><?php echo $text_footer; ?></div>


Ajouter ces lignes dessous :

Code: Tout sélectionner

<script type="text/javascript">
$(document).ready(
  function(){
    $('.list tr:even').mouseover(function() {
      $(this).css("background-color", "#cccccc");
    }).mouseout(function(){
      $(this).css("background-color", "#F4F4F8");
    });
   
    $('.list tr:odd').mouseover(function() {
      $(this).css("background-color", "#cccccc");
    }).mouseout(function(){
      $(this).css("background-color", "");
    });
});
</script>


[lordbdp]

Désolé mais ça me ramène au point de départ... Pas de changement toutes les lignes restent blanches.

Est-ce normal de ne pas refermer le script java ?

[LeorLindel]

J'ai en effet omis une ligne lors du copier/coller, mais puisque tu l'as constaté, tu aurais pu fermer cette balise et constater que cela fonctionnait !!!

Il faut bien entendu inclure ce script ainsi que sa fermeture :

Code: Tout sélectionner

<script type="text/javascript">
$(document).ready(
  function(){
    $('.list tr:even').mouseover(function() {
      $(this).css("background-color", "#cccccc");
    }).mouseout(function(){
      $(this).css("background-color", "#F4F4F8");
    });
   
    $('.list tr:odd').mouseover(function() {
      $(this).css("background-color", "#cccccc");
    }).mouseout(function(){
      $(this).css("background-color", "");
    });
});
</script>


PS : Script du dessus modifié

[lordbdp]

Nickel ! Merci ^^

Si ! J'avais fermé la balise mais je me demandais si il falait absolument puisque sur certains progs on laisse ouvert... C'est tout.

[lordbdp]

Juste pour signaler qu'il existe désormais (vQmod) See Your Rows pour éviter de toucher au code