Alsur Media | Cambiar color de los pedidos en la administración de Magento
12681
single,single-post,postid-12681,single-format-standard,ajax_fade,page_not_loaded,,wpb-js-composer js-comp-ver-4.1.2,vc_responsive

Modificando los colores de los pedidos en la administración de Magento

magento-admin-colores

Modificando los colores de los pedidos en la administración de Magento

22:08 07 julio in Magento
6 Comments

Hemos tenido que modificar los colores de los renglones que muestran los pedidos en la administración de Magento para un cliente, aquí os dejamos la información del proceso seguido para llevar los cambios a cabo.

En primer lugar debemos duplicar el archivo grid.js

js/mage/adminhtml/grid.js

Lo copiamos a:

js/colors/adminhtml/grid.js

Una vez duplicado, lo editamos y añadimos:

colorize();

cerca de la linea 210, en una linea nueva anterior a la que contiene:

}.bind(this)

Y al final del documento añadimos este código para definir los colores que queremos usar:

function colorize () {
 $$('td').each(function(macguffin) {
 if(macguffin.innerHTML.strip()=="Processing") macguffin.parentNode.setStyle({backgroundColor: 'Orange' });
 if(macguffin.innerHTML.strip()=="Pending") macguffin.parentNode.setStyle({backgroundColor: 'Gold', color:'Black' });
 if(macguffin.innerHTML.strip()=="Payment Review") macguffin.parentNode.setStyle({backgroundColor: 'LightPink' });
 if((macguffin.innerHTML.strip()=="On Hold")||(macguffin.innerHTML.strip()=="Payment Review")) macguffin.parentNode.setStyle({backgroundColor: 'HotPink' });
 if(macguffin.innerHTML.strip()=="Suspected Fraud") macguffin.parentNode.setStyle({backgroundColor: 'Red' });
 if((macguffin.innerHTML.strip()=="Closed")||(macguffin.innerHTML.strip()=="Canceled")||(macguffin.innerHTML.strip()=="Cancelled")) macguffin.parentNode.setStyle({backgroundColor: 'LightBlue', fontStyle: 'italic' });
 if(macguffin.innerHTML.strip()=="Complete") macguffin.parentNode.setStyle({backgroundColor: 'LightGreen' });
 });

}
document.observe("dom:loaded", colorize);

Ahora tenemos que editar el archivo xml para que Magento carge nuestro grid.js, editamos el archivo:

app/design/adminhtml/default/default/layout/local.xml

Lo modificamos indicando que no cargue el grid.js de mage y que utilice el nuestro en su lugar:

 
<reference name="head">
<action method="removeItem"><type>js</type><name>mage/adminhtml/grid.js</name></action>
<action method="addItem"><type>js</type><name>colors/adminhtml/grid.js</name></action>
</reference>

Una vez hechos los cambios, refrescar la cache y podréis ver los pedidos de forma clara, sabréis de inmediato cuales importan, cuales están completos, etc.

santibm

info@alsurmedia.com
6 Comments
  • Ferche 13:50h, 26 julio Responder

    Hola, no encuentro el fichero
    app/design/adminhtml/default/default/layout/local.xml

    Estoy en version 1.9.0.1.

    Gracias

  • santibm 00:38h, 27 julio Responder

    Hola Ferche!

    Si no existe lo puedes crear, tendrías que añadirle:

    <?xml version="1.0"?>
    <layout version="0.1.0">
        <default translate="label" module="page">
     <!-- Pon aquí el código --> 
        </default>
    </layout>
    
  • Ferche 16:24h, 28 julio Responder

    Hola santibm,
    he duplicado y modificado el grid.js y tambien he creado el local.xml tal como indicas, pero no funciona. Todo se queda igual.

    El contenido del local.xml ha quedado así:

    jsmage/adminhtml/grid.js
    jscolors/adminhtml/grid.js

    Gracias

    Un saludo

  • Ferche 16:25h, 28 julio Responder

    Veo que no aparece el “codigo” en el mensaje anterior enviado.

  • santibm 17:23h, 28 julio Responder

    Hola!! Ya veo que no se queda el código…

    ¿Has limpiado la cache tras los cambios?

  • Ferche 07:08h, 29 julio Responder

    Hola santibm, si que había refrescado la cache.
    Ya he localizado el problema. No me aparecía correctamente porque había cambiado los títulos del “Status Label” en la gestion de estados. He cambiado los textos en el código y ahora funciona correctamente.

    Muchas gracias por la aportación y por tu ayuda

Post A Comment