fbpx
loder

WooCommerce statuts commandes : Changer les couleurs

WooCommerce-statuts-commandes-Changer-les-couleurs

Dans cet article nous allons voir comment changer les couleurs pour Woocommerce statuts commandes, les statuts personnalisés mais aussi les statuts ajoutés avec Colissimo.

Qu’est ce que Woocommerce ?

WooCommerce est une extension open source pour WordPress permettant de créer une boutique en ligne. Il est conçu pour les petites et grandes entreprises en ligne utilisant WordPress

Pourquoi vouloir changer les couleurs des statuts de commandes dans Woocommerce ?

WooCommerce statuts commandes : Changer les couleurs

Dans woocommerce les couleurs pour les statuts de commandes sont prédéfinis et peuvent être simple à comprendre et à prendre en main.

WooCommerce statuts commandes : Changer les couleurs

Chaque statut à une couleur qui lui est propre. Seuls les statuts “Annulée” et “Attente paiement” sont gris.

Il en est de même pour les statuts de commande ajoutée à Woocommerce, comme les statuts personnalisés ou les statuts ajoutés avec une extension comme Colissimo

Cela peut rapidement rendre la lisibilité des statuts de commandes difficile. 

Il existe des solutions pour changer  les couleurs des statuts et créer de nouveaux status, néanmoins ses solutions sont souvent payantes et très coûteuses pour leurs utilisations. 

WooCommerce statuts commandes : comment personnaliser les couleurs sans payer le moindre sous ?

WooCommerce statuts commandes : Changer les couleurs

Oui ! C’est possible pour cela il faudra vous rendre dans la partie “Éditeur de thème” dans l’onglet “Apparence”

Un message vous expliquant de faire attention aux modifications apparaît ? C’est normal, cliquez sur ‘Je comprends’. 

Sur la partie de droite vous allez avoir “functions.php” rendez vous sur le fichier, en bas du fichiers copier ceci :

add_action('admin_head', 'styling_admin_order_list' );
function styling_admin_order_list() {
    global $pagenow, $post;
    if( $pagenow != 'edit.php') return; //sortie
    if( 'shop_order' != get_post_type())return; //sortie
    if( get_post_type($post->ID) != 'shop_order' ) return; //sortie
    ?>
    <style>
        .order-status.status-on-hold {
            background-color: #DF3F32!important;
            color: white;
        }
		.order-status.status-lpc_ready_to_ship, .order-status.status-lpc_transit{
            background-color: #FDBA00!important;
            color: white;
        }
		.order-status.status-lpc_delivered{
            background-color: #2481F6!important;
            color: white;
        }
		.order-status.status-processing{
            background-color: #28AB45!important;
            color: white;
        }
		
    </style>
    <?php
}

Liste des classe des statuts de commandes Woocommerce : 

.status-processing -> En cours 

.status-completed -> Terminée

.status-cancelled -> Annulée

.status-refunded -> Remboursé 

.status-failed -> Échoué

.status-pending -> Attente paiement

.status-on-hold -> Attente

Liste des classe des statuts de commandes colissimo Woocommerce :

.status-lpc_ready_to_ship  ->  Prêt à expédier

.status-lpc_transit -> En Transit

 .status-lpc_anomaly -> Anomalie

Bonus : Changer l’ordre des statuts de commandes

function misha_change_statuses_order( $wc_statuses_arr ){
	$new_statuses_arr = array(
		'wc-lpc_ready_to_ship' => $wc_statuses_arr['wc-lpc_ready_to_ship'], // Prêt à expédier
		'wc-processing' => $wc_statuses_arr['wc-processing'], // 1
		'wc-lpc_transit' => $wc_statuses_arr['wc-lpc_transit'], // En Transit 
		'wc-completed' => $wc_statuses_arr['wc-completed'], // 2
		'wc-lpc_delivered' => $wc_statuses_arr['wc-lpc_delivered'], // 3
		'wc-lpc_anomaly' => $wc_statuses_arr['wc-lpc_anomaly'], // Anomalie	
		'wc-cancelled' => $wc_statuses_arr['wc-cancelled'], // 3
		'wc-refunded' => $wc_statuses_arr['wc-refunded'], // 4
		'wc-failed' => $wc_statuses_arr['wc-failed'], // 5
		'wc-pending' => $wc_statuses_arr['wc-pending'], // 6
		'wc-on-hold' => $wc_statuses_arr['wc-on-hold'] // 7
	);
	return $new_statuses_arr;
} 
add_filter( 'wc_order_statuses', 'misha_change_statuses_order' );
 

Besoin d’aide sur WooCommerce ?

Laisser un commentaire

Votre adresse de messagerie ne sera pas publiée. Les champs obligatoires sont indiqués avec *