Jak ve WooCommerce pokladně opravit fialovou barvu pozadí

Jak odstranit fialové pozadí platební sekce ve WooCommerce 9.6?

Nedávná aktualizace WooCommerce 9.6 přinesla nejen nové funkce, ale také rebranding pluginu – změnilo se logo a barvy. Bohužel, tato změna ovlivnila i vzhled webu, konkrétně platební sekci v pokladně, kde se může objevit nežádoucí fialové pozadí.

V tomto článku si ukážeme jednoduchý způsob, jak tuto výchozí barvu odstranit a přizpůsobit platební sekci vašemu designu.

Oprava je jednoduchá pomocí vlastního CSS, které vložte do child šablony nebo do Vzhled > Přizpůsobit > CSS.

CSS pro změnu fialové platební sekce ve WooCommerce

/* Nastavení pozadí pro platební sekci na různých stránkách WooCommerce */
#add_payment_method #payment, .woocommerce-cart #payment, .woocommerce-checkout #payment {
    background: #f4f4f4;
}

/* Styly pro box platební metody */
#add_payment_method #payment div.payment_box, .woocommerce-cart #payment div.payment_box, .woocommerce-checkout #payment div.payment_box {
    background-color: #ccc;
	color:#000;
}

/* Trojúhelníkový indikátor pro box platební metody */
#add_payment_method #payment div.payment_box::before, .woocommerce-cart #payment div.payment_box::before, .woocommerce-checkout #payment div.payment_box::before {
	border: 1em solid #ccc;
    border-right-color: transparent;
    border-left-color: transparent;
    border-top-color: transparent;
}

Deisgn si můžete libovolně upravit a HEX kód barvy nastavit dle vlastních preferencí. Nyní je to připravené pro neutrální šedou barvu.