Modyfikacja oznaczenia promocji w WooCommerce

Znaczek promocji w WooCommerce pojawia się w widoku archiwum (listy produktów) oraz na stronie produktu, gdy wprowadzona zostanie cena promocyjna.

Dla tych co lubią w plikach dłubać mogą pobrać plik odpowiedzialny za znaczek z katalogu:

twoja-domena/wp-content/plugins/woocommerce/loop/sale-flash.php

i wgrać go do katalogu swojego tematu:

twoja-domena/wp-content/themes/twój-temat/woocommerce/loop/sale-flash.php

Później możemy w tym pliku dodać obrazek zamiast tekstu lub dokonać innych zmian.

Czasami chcemy tylko zmienić tekst, wtedy zamiast bezpośredniej modyfikacji tego pliku możemy skorzystać z filtra i dorzucić kod do pliku functions.php:

add_filter( 'woocommerce_sale_flash', 'wc_custom_replace_sale_text' );
function wc_custom_replace_sale_text( $html ) {
return str_replace( __( 'Sale!', 'woocommerce' ), __( 'Za pół darmo!', 'woocommerce' ), $html );
}

Możemy także zmienić wygląd dodając małe co nieco do pliku ze stylami CSS. Na przykład możemy wyczarować wrzosowy znaczek z zaokrąglonymi rogami:

span.onsale {
width: 100px;
padding: 10px 20px;
background: #eba4ff;
color: #400052;
-moz-border-radius: 10px;
-webkit-border-radius: 10px;
border-radius: 10px;
border: 2px solid #400052;
margin: auto;
text-align: center;
}

Oczywiście bawiąc się stylami możemy stworzyć odrębne wersja dla widoku listy produktów oraz pojedynczego produktu, jak również poczynić znacznie głębsze modyfikacje, CSS daje nam wiele możliwości.

I na koniec tradycyjnie zdjęcie. Co ono ma do tego wpisu?
To wyszła głęboko skryta tęsknota za latem, ciepełkiem i wodą.
Cierpliwości do wędkowania nie mam, ale chwilę popatrzeć na nich mogę, zwłaszcza jak widzę takie słońce i aparat mam przy sobie! :-)

3 stycznia 2019, Tomasz Bartosiewicz,

Dodaj komentarz

Twój adres email nie zostanie opublikowany. Pola, których wypełnienie jest wymagane, są oznaczone symbolem *